Speeding up rendering of large html tables

출처: https://www.competa.com/blog/speeding-up-rendering-of-large-html-tables/

Although table seems to have become the black sheep of html tags, it is still a very usefull if used what it was intended for: displaying data in a tabular way.

One of the nice features of tables is that one can let the browser handle the width of table cells.
The browser starts rendering the table and when it finds that a cell needs more space, it will re-render the table with an increased width for the specific column.

However when the table contains a lot of data, it might take the browser a lot of time to render the table.
While other browsers do this rendering progressively Internet Explorer does this rendering in memory and thus it could take some time before the user sees anything.

One can speed up the rendering by setting the table’s CSS property ‘table-layout’ to ‘fixed’.
The browser will then take the first row of the table to calulate the widths of its columns. So be sure to specify the width of columns in the first row.

Because no re-rendering has to be done, this will speed up the rendering of the table, and Internet Explorer can also render progressively.

*요약: 테이블의 맨처음 row에있는 모든 컬럼의 가로 사이즈를 지정해줘라.