Highcharts update vs new chart (v11)

Revision 11 of this benchmark created by nonooo on

Description

check pour 13 courbes...

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="//code.highcharts.com/highcharts.js"></script>
<script src="//code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="height: 400px"></div>

Setup

var empty_data = [
            { name: 'mnf1', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf2', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf3', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf4', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf5', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf6', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf7', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf8', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf9', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf10', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf11', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf12', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] },
            { name: 'mnf13', data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] }
            ];
    
    
    
    
    var options = {
      chart: {
        renderTo: 'container',
        type: 'spline',
        backgroundColor: 'transparent'
      },
            animation: {
                enabled: false
            },
            title: {
                text: null
            },
            credits: {
                enabled: false
            },
            legend: {
                enabled: false
            },
            tooltip: {
                enabled: true
            },
            exporting: {
                enabled: false
            },
            yAxis: {
                labels: {
                    enabled: true,
                    formatter: function () {
                        return this.value / 1000000 + ' M€';
                    }
                },
                title: {
                    text: null
                }
            },
      series: empty_data
    };
    var chart;

Teardown


    chart.destroy();

Test runner

Ready to run.

Testing in
TestOps/sec
new chart
chart = new Highcharts.Chart(options);
chart.destroy();
chart = new Highcharts.Chart(options);
ready
update
chart = new Highcharts.Chart(options);

    for (i = 0; i < chart.series.length; i++) {
        chart.series[i].setData(empty_data[i].data);
        chart.series[i].update({ name: empty_data[i].name }, false);
    }

chart.redraw();
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.