instantiation bench vs old version & make benches run in browsers only

benchmarks/bench.js

@@ -0,0 +1,3 @@
+require('./observer').run(function () {
+  require('./instantiation').run()
+})

benchmarks/instantiation.js

@@ -1,22 +1,20 @@
 console.log('\nInstantiation\n')
 
+var done = null
+var OldVue = require('../../vue')
 var Vue = require('../src/vue')
 var sideEffect = null
 var parent = new Vue({
   data: { a: 1 }
 })
-
-function getNano () {
-  var hr = process.hrtime()
-  return hr[0] * 1e9 + hr[1]
-}
+var oldParent = new OldVue({
+  data: { a: 1 }
+})
 
 function now () {
-  return process.hrtime
-    ? getNano() / 1e6
-    : window.performence
-      ? window.performence.now()
-      : Date.now()
+  return window.performence
+    ? window.performence.now()
+    : Date.now()
 }
 
 // warm up
@@ -24,31 +22,81 @@ for (var i = 0; i < 1000; i++) {
   sideEffect = new Vue()
 }
 
+var queue = []
+
 function bench (desc, n, fn) {
-  var s = now()
-  for (var i = 0; i < n; i++) {
-    fn()
+  queue.push(function () {
+    var s = now()
+    for (var i = 0; i < n; i++) {
+      fn()
+    }
+    var time = now() - s
+    var opf = (16 / (time / n)).toFixed(2)
+    console.log(desc + ' ' + n + ' times - ' + opf + ' ops/frame')
+  })
+}
+
+function run () {
+  queue.shift()()
+  if (queue.length) {
+    setTimeout(run, 0)
+  } else {
+    done && done()
   }
-  var time = now() - s
-  var opf = (16 / (time / n)).toFixed(2)
-  console.log(desc + ' ' + n + ' times - ' + opf + ' ops/frame')
 }
 
 function simpleInstance () {
   sideEffect = new Vue({
+    el: document.createElement('div'),
+    data: {a: 1}
+  })
+}
+
+function oldSimpleInstance () {
+  sideEffect = new OldVue({
     data: {a: 1}
   })
 }
 
 function simpleInstanceWithInheritance () {
   sideEffect = new Vue({
+    el: document.createElement('div'),
     parent: parent,
     data: { b:2 }
   })
 }
 
+function oldSimpleInstanceWithInheritance () {
+  sideEffect = new OldVue({
+    parent: oldParent,
+    data: { b:2 }
+  })
+}
+
 function complexInstance () {
   sideEffect = new Vue({
+    el: document.createElement('div'),
+    data: {
+      a: {
+        b: {
+          c: 1
+        }
+      },
+      c: {
+        b: {
+          c: { a:1 },
+          d: 2,
+          e: 3,
+          d: 4
+        }
+      },
+      e: [{a:1}, {a:2}, {a:3}]
+    }
+  })
+}
+
+function oldComplexInstance () {
+  sideEffect = new OldVue({
     data: {
       a: {
         b: {
@@ -72,10 +120,27 @@ bench('Simple instance', 10, simpleInstance)
 bench('Simple instance', 100, simpleInstance)
 bench('Simple instance', 1000, simpleInstance)
 
+bench('Simple instance (old)', 10, oldSimpleInstance)
+bench('Simple instance (old)', 100, oldSimpleInstance)
+bench('Simple instance (old)', 1000, oldSimpleInstance)
+
 bench('Simple instance with inheritance', 10, simpleInstanceWithInheritance)
 bench('Simple instance with inheritance', 100, simpleInstanceWithInheritance)
 bench('Simple instance with inheritance', 1000, simpleInstanceWithInheritance)
 
+bench('Simple instance with inheritance (old)', 10, oldSimpleInstanceWithInheritance)
+bench('Simple instance with inheritance (old)', 100, oldSimpleInstanceWithInheritance)
+bench('Simple instance with inheritance (old)', 1000, oldSimpleInstanceWithInheritance)
+
 bench('Complex instance', 10, complexInstance)
 bench('Complex instance', 100, complexInstance)
-bench('Complex instance', 1000, complexInstance)
+bench('Complex instance', 1000, complexInstance)
+
+bench('Complex instance (old)', 10, oldComplexInstance)
+bench('Complex instance (old)', 100, oldComplexInstance)
+bench('Complex instance (old)', 1000, oldComplexInstance)
+
+exports.run = function (cb) {
+  done = cb
+  run()
+}

benchmarks/observer.js

@@ -1,5 +1,6 @@
 console.log('\nObserver\n')
 
+var done = null
 var Observer = require('../src/observe/observer')
 var Emitter = require('../src/emitter')
 var OldObserver = require('../../vue/src/observer')
@@ -9,30 +10,36 @@ function cb () {
   sideEffect = !sideEffect
 }
 
-function getNano () {
-  var hr = process.hrtime()
-  return hr[0] * 1e9 + hr[1]
-}
-
 function now () {
-  return process.hrtime
-    ? getNano() / 1e6
-    : window.performence
-      ? window.performence.now()
-      : Date.now()
+  return window.performence
+    ? window.performence.now()
+    : Date.now()
 }
 
+var queue = []
+
 function bench (desc, fac, run) {
-  var objs = []
-  for (var i = 0; i < runs; i++) {
-    objs.push(fac(i))
-  }
-  var s = now()
-  for (var i = 0; i < runs; i++) {
-    run(objs[i])
+  queue.push(function () {
+    var objs = []
+    for (var i = 0; i < runs; i++) {
+      objs.push(fac(i))
+    }
+    var s = now()
+    for (var i = 0; i < runs; i++) {
+      run(objs[i])
+    }
+    var passed = now() - s
+    console.log(desc + ' - ' + (16 / (passed / runs)).toFixed(2) + ' ops/frame')
+  })  
+}
+
+function run () {
+  queue.shift()()
+  if (queue.length) {
+    setTimeout(run, 0)
+  } else {
+    done && done()
   }
-  var passed = now() - s
-  console.log(desc + ' - ' + (16 / (passed / runs)).toFixed(2) + ' ops/frame')
 }
 
 bench(
@@ -363,4 +370,9 @@ bench(
   function (o) {
     o.reverse()
   }
-)
+)
+
+exports.run = function (cb) {
+  done = cb
+  run()
+}

gruntfile.js

@@ -78,7 +78,7 @@ module.exports = function (grunt) {
         }
       },
       bench: {
-        src: ['benchmarks/*.js', '!benchmarks/browser.js'],
+        src: ['benchmarks/bench.js'],
         dest: 'benchmarks/browser.js'
       }
     },
@@ -116,6 +116,7 @@ module.exports = function (grunt) {
 
   grunt.registerTask('unit', ['karma:browsers'])
   grunt.registerTask('phantom', ['karma:phantom'])
+  grunt.registerTask('bench', ['browserify:bench'])
   grunt.registerTask('watch', ['browserify:watch'])
   grunt.registerTask('build', ['browserify:build', 'uglify:build'])
 

src/vue.js

@@ -59,6 +59,7 @@ extend(p, require('./instance/scope'))
 extend(p, require('./instance/data'))
 extend(p, require('./instance/proxy'))
 extend(p, require('./instance/bindings'))
+extend(p, require('./instance/element'))
 extend(p, require('./instance/compile'))
 
 /**

tasks/bench.js

@@ -1,31 +0,0 @@
-/**
- * Run benchmarks in Node
- */
-
-module.exports = function (grunt) {
-  grunt.registerTask('bench', function (target) {
-
-    // polyfill window/document for old Vue
-    global.window = {
-      setTimeout: setTimeout,
-      console: console
-    }
-    global.document = {
-      documentElement: {}
-    }
-
-    if (target) {
-      run(target)
-    } else {
-      require('fs')
-        .readdirSync('./benchmarks')
-        .forEach(run)
-    }
-
-    function run (mod) {
-      if (mod === 'browser.js' || mod === 'runner.html') return
-      require('../benchmarks/' + mod)
-    }
-
-  })
-}