性能问题,是什么原因造成的?

时间:2018-05-18 10:34:25

标签: javascript php performance chart.js

我在网页上加载了Chartjs的图表上存在性能问题

这是一个堆积条形图,我正在对我数据库中提取的数据进行大量计算。

我想知道的是我需要在哪里更改代码以缩短执行时间?

感谢stackoverflow,我已经把它用来计算执行时间:

$time_start = microtime(true); 
echo 'Total execution time in seconds: ' . (microtime(true) - $time_start);

围绕我的php文件中的两个主要循环。

结果在这里:

Total execution time in seconds: 0.01149320602417
Total execution time2 in seconds: 0.0041401386260986

显然这不是因为循环正确吗?

我还跟踪了Chrome的效果:

enter image description here

还有:

enter image description here

这是否意味着缓慢的加载时间是由Chartjs造成的,还是没有证明什么?

我最初认为是因为这篇文章:Chart.js too slow rendering vertical stacked bars chart 这是在循环中将值赋予图表的方法,但现在我不再确定了。

我将vars传递给我的图表的方式(计算第二个循环):

for ($cd=0; $cd <= $curday; $cd++) {
    for ($i=0; $i <$maxy; $i++) {
        if (!isset($dataset[$i][$cd])) break; 
        //$dummydata = array(NULL, $dataset[$i][$cd]);
        $dummydata = array();
        // add empty values for previous days
        for ($zz=0; $zz < $cd; $zz++){
            $dummydata[]=null;
        }
        // add current value
        $dummydata[]=$dataset[$i][$cd];
        $dummy=array('type' => "bar",
                   'label' => "Intensity " . $intensity[$i][$cd],
                   'backgroundColor' => $intColors[$intensity[$i][$cd]],
                   'data' => ($dummydata));
        array_push($arrDatasets, $dummy);
    }         
}

编辑: 数据到json:

$arrReturn = (array('labels' => $labels, 
                               'datasets' => $arrDatasets));
            $mydata = json_encode(($arrReturn));

编辑: Javascript部分:

$html .= "<script>";
    $html .= "var ctx=document.getElementById('myChart').getContext('2d');";
    $html .= "var myChart = new Chart(ctx, {";
    $html .= "type:'". $type . "',";
    $html .= "data:" . $mydata . ",";
    $html .= "options: " . $options;
    $html .= "});";
    $html .= "</script>";

这是$ mydata的输出: enter image description here

1 个答案:

答案 0 :(得分:0)

这是由于Chartjs。我更改了库并使用了一个更合适的图表,它几乎立即显示负载