vue/examples/todomvc/js/perf.js

setTimeout(function () {
    
    // Initial load & render metrics

    metrics.afterRenderAsync = now()
    console.log('Vue load     : ' + (metrics.afterLoad - metrics.beforeLoad).toFixed(2) + 'ms')
    console.log('Render sync  : ' + (metrics.afterRender - metrics.beforeRender).toFixed(2) + 'ms')
    console.log('Render async : ' + (metrics.afterRenderAsync - metrics.beforeRender).toFixed(2) + 'ms')
    console.log('Total sync   : ' + (metrics.afterRender - metrics.beforeLoad).toFixed(2) + 'ms')
    console.log('Total async  : ' + (metrics.afterRenderAsync - metrics.beforeLoad).toFixed(2) + 'ms')

    // Benchmark
    // add 100 items
    // toggle them one by one
    // then delete them one by one

    var benchSetting = window.location.search.match(/\bbenchmark=(\d+)/)
    if (!benchSetting) return

    var itemsToAdd = +benchSetting[1],
        render,
        bench,
        addTime,
        toggleTime,
        removeTime

    var start = now(),
        last

    add()

    function add() {
        last = now()
        var newTodo = '12345',
            todoInput = document.getElementById('new-todo')
        for (var i = 0; i < itemsToAdd; i++) {
            var keyupEvent = document.createEvent('Event');
            keyupEvent.initEvent('keyup', true, true);
            keyupEvent.keyCode = 13;
            app.newTodo = 'Something to do ' + i;
            todoInput.dispatchEvent(keyupEvent)
        }
        setTimeout(toggle, 0)
    }

    function toggle () {
        addTime = now() - last
        var checkboxes = document.querySelectorAll('.toggle')
        for (var i = 0; i < checkboxes.length; i++) {
            checkboxes[i].click()
        }
        last = now()
        setTimeout(remove, 0)
    }

    function remove () {
        toggleTime = now() - last
        var deleteButtons = document.querySelectorAll('.destroy');
        for (var i = 0; i < deleteButtons.length; i++) {
            deleteButtons[i].click()
        }
        last = now()
        setTimeout(report, 0)
    }

    function report () {
        bench = now() - start
        removeTime = now() - last
        console.log('\nBenchmark x ' + itemsToAdd)
        console.log('add    : ' + addTime.toFixed(2) + 'ms')
        console.log('toggle : ' + toggleTime.toFixed(2) + 'ms')
        console.log('remove : ' + removeTime.toFixed(2) + 'ms')
        console.log('total  : ' + bench.toFixed(2) + 'ms')
    }

}, 0)