douli4852 2016-01-19 15:25
浏览 14

包含许多列的HTML表格需要很长时间才能呈现

I'm trying to make a "map" of holidays and for that I need every month with every day they have in the header and the names of each employee at the left columns, till there I have no problems, the problem is the browser is taking too long to load and after load it breaks my navigation with hashtags ( can't load another view in the "content" section ).

Building the header:

$year_start = new DateTime('1-1-2016');
$year_end = new DateTime('1-5-2017');
$period = new DatePeriod($year_start, new DateInterval('P1D'), $year_end);
$period_m = new DatePeriod($year_start, new DateInterval('P1M'), $year_end);

<thead>
    <?php
    echo '<tr>';
    echo '<th colspan="2"></th>';
    foreach ($period_m as $month){  
        echo '<th style="text-align:center;" colspan="'.cal_days_in_month(CAL_GREGORIAN, $month->format('m'), $month->format('Y')).'">'.$month->format('F').'</th>';
    }
    echo "</tr>";
    echo "<tr>";
    ?>
    <th> Name</th>
    <th> Department</th>
    <?php
    foreach($period as $day){
        echo "<th>" . $day->format('j')."</th>";
    }
    echo "</tr>";
    ?>
</thead>`

Building the body ( that's what takes to long )

<tbody >
        <tr>
            <td><?=$user['name']?></td>
            <td><?=$user['department']?></td>
        <?php
        foreach($period as $day){
            if ($day->format('N') === '7' || $day->format('N') === '6') {
                echo '<td class="weekend"></td>'; 
            }else if(in_array($day->format('Y-n-j'), $holidayDays) || in_array($day->format('*-n-j'), $holidayDays)){
                echo '<td class="holiday"></td>'; 
            }else{
                if(isset($user['dates']) && in_array($day->format('Y-n-j'),$user['dates'])){
                    echo '<td class="user-holiday"> 1 </td>'; 
                }else{
                    echo '<td></td>';   
                }
            }
        }
        ?>
        </tr>
    <?php       
    }
    ?>
    </tbody>

With Firefox developer I tried to analyse the speed and the slowest are those ones:

Recalcute Style duration = 5 905,15 ms

Layout duration = 3 289,58 ms

There's no javascript in this page.

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 基于卷积神经网络的声纹识别
    • ¥15 Python中的request,如何使用ssr节点,通过代理requests网页。本人在泰国,需要用大陆ip才能玩网页游戏,合法合规。
    • ¥100 为什么这个恒流源电路不能恒流?
    • ¥15 有偿求跨组件数据流路径图
    • ¥15 写一个方法checkPerson,入参实体类Person,出参布尔值
    • ¥15 我想咨询一下路面纹理三维点云数据处理的一些问题,上传的坐标文件里是怎么对无序点进行编号的,以及xy坐标在处理的时候是进行整体模型分片处理的吗
    • ¥15 CSAPPattacklab
    • ¥15 一直显示正在等待HID—ISP
    • ¥15 Python turtle 画图
    • ¥15 stm32开发clion时遇到的编译问题