테이블의 행에 표시 할 많은 수의 필드로 구성된 웹 페이지를 디자인해야합니다. 여러 범주가 있습니다. 각 카테고리별로 별도의 테이블을 만들고 다르게 디자인하고 싶습니다.Html 테이블 디자인. 어느 것이 더 낫습니다 : 하나의 테이블에 다수의 행 또는 각 행이 적은 테이블이 많습니다
웹 페이지에 많은 수의 테이블이 있으면 느려 집니까? 어느 쪽이 더 낫습니다 .. 각각 10 개의 행이있는 10 개의 테이블 또는 100 개의 행이있는 단일 테이블이 있습니까? 페이지 로딩 속도와 관련하여 상당한 차이가 있습니까?
이런 식으로 하나의 테이블을 사용하는 것이 좋지만, 각 섹션을 포함하기 위해 thead 및 tbody 요소를 많이 사용하는 것이 좋습니다.
편집 : 약간의 테스트를 수행했는데 하나 또는 그 이상의 다른 테스트를 사용하여 큰 증가를 발견하지 못했습니다. 필자의 컴퓨터에서는 10000 개의 행과 5 개의 열이있는 단일 테이블과 각각 1000 개의 행과 5 개의 열이있는 10 개의 테이블에 대해 약 1800ms (각 주제마다 평균 10 개의 테스트 사용)의 페이지 생성 시간을 사용했습니다. 테스트에 사용
코드 : 페이지로드 우수한 성능의 문제의 통계 또는 그냥 기존의 관행의 특정
<html>
<head>
<script type="text/javascript">
var start_time = (new Date()).getTime();
function detectTimeDiff(){
alert("Time taken: "+((new Date()).getTime() - start_time)+" milliseconds.");
}
</script>
</head>
<body onload="detectTimeDiff()">
<?php
$multiple_tables = true;
$table_count = 10;
?>
<table>
<?php
$table_count--;
for($i=0;$i<10000;$i++){
if($multiple_tables){
if($i%$table_count == 0){
?>
</table>
<table>
<?php
}
}
?>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<?php
}
?>
</table>
</body>
</html>
어떤 이유. – Abhishek
주로 연습하십시오. 하지만 페이지 로딩 시간이 약간 증가 할 가능성이 있습니다. –