Какая структура HTML работает лучше для браузера?

Question

Ну, похоже, общее мнение : Мы должны использовать таблицы только для табличных данных, а не для макетов.

Хорошо, я согласен, и я понимаю причины (одна из причин - производительность).

• Но кто-то может дать реальные тесты сравнения таблиц с другими структурами?
• А какова лучшая структура для производительности браузера?

Answer 1

Вам не нужно действительно делать тесты .. вы можете увидеть разницу визуально . Если вы посмотрите на pre-css-layout сайта, он обычно отображается медленно, поскольку таблица должна быть полностью вытянута. Когда он разделен css, он заметно быстрее. Я был свидетелем этого на десятках сайтов, прежде чем они конвертировались в макеты CSS.

Кроме того, для таблиц требуются ячейки и строки таблицы почти для всего. Не полагаясь на строки / ячейки, вы уменьшаете количество кода на LOTS.

"Лучшая структура"? Нет лучшей структуры. Все зависит от макета. Хотя, как правило, вы хотите избежать деления и сохранить все как можно более краткими, но семантически размеченными.

Answer 2

Мне очень нравится этот сайт, который дает вам таймер того, как долго вы должны бороться, используя чистый CSS перед вами ...

http://giveupandusetables.com/

Answer 3

Основная проблема с производительностью таблиц заключается в том, что они могут вызывать чрезмерные перефразирования . Макет первой ячейки таблицы может быть изменен в зависимости от содержимого в последующих ячейках, что в основном заставляет браузер вернуться назад и снова запустить макет.

Answer 4

Основная причина, по которой я всегда слышал, почему вы должны использовать divs против таблиц, это адаптивность.Если вы создаете макет таблицы, вы должны изменить весь свой HTML, чтобы изменить его, но с помощью divs вы можете просто использовать CSS-свойства layout, float и position, чтобы перемещать вещи.