What HTML structure performs better for the browser?

Well, it seems to be the general opinion: We should use tables only for tabular data, and not for layouting .

Ok, I'm agree and I understand the reasons (one of the reasons is the performance).

  • But someone could give real benchmarks comparing tables vs other structures?
  • And what is the best structure for the browser performance?

  • You don't need to really do benchmarks.. you can see the difference visually. If you look at a site pre-css-layout, it usually rendered slowly since the table has to be fully drawn out. When it's divided up with css, it's noticeably faster. I've witnessed this on dozens of sites before they converted to css layouts.

    In addition, tables require table cells and rows for nearly everything. By not relying on rows/cells, you reduce the code bloat by LOTS.

    "Best structure" ? There is no best structure. It all depends on the layout. Though usually, you want to avoid divitus and keep things as succinct as possible yet semantically marked up.


    The main reason I've always heard for why you should use divs vs tables is adaptability. If you make a table layout, you have to change all of your HTML to change it, but with divs, you can just use the layout , float , and position CSS properties to move things around.


    The main performance issue with tables is that they can cause excessive reflows. The layout of the first cell in the table can be changed by content in later cells, which basically makes the browser have to go back and start the layout again.

    链接地址: http://www.djcxy.com/p/88160.html

    上一篇: 如何计算CSS像素大小?

    下一篇: 什么HTML结构对浏览器更好?