perf tuning

Author: yyx990803

src/compiler.js

@@ -11,7 +11,6 @@ var Emitter     = require('./emitter'),
 
     // cache methods
     slice       = [].slice,
-    each        = [].forEach,
     makeHash    = utils.hash,
     extend      = utils.extend,
     def         = utils.defProtected,
@@ -27,7 +26,7 @@ var Emitter     = require('./emitter'),
     // list of priority directives
     // that needs to be checked in specific order
     priorityDirectives = [
-        'i' + 'f',
+        'if',
         'repeat',
         'view',
         'component'
@@ -39,7 +38,8 @@ var Emitter     = require('./emitter'),
  */
 function Compiler (vm, options) {
 
-    var compiler = this
+    var compiler = this,
+        key, i
 
     // default state
     compiler.init       = true
@@ -94,17 +94,22 @@ function Compiler (vm, options) {
     // create bindings for computed properties
     var computed = options.computed
     if (computed) {
-        for (var key in computed) {
+        for (key in computed) {
             compiler.createBinding(key)
         }
     }
 
     // copy paramAttributes
-    if (options.paramAttributes) {
-        options.paramAttributes.forEach(function (attr) {
-            var val = compiler.eval(el.getAttribute(attr))
-            vm[attr] = utils.checkNumber(val)
-        })
+    var params = options.paramAttributes
+    if (params) {
+        i = params.length
+        while (i--) {
+            vm[params[i]] = utils.checkNumber(
+                compiler.eval(
+                    el.getAttribute(params[i])
+                )
+            )
+        }
     }
 
     // beforeCompile hook
@@ -131,9 +136,10 @@ function Compiler (vm, options) {
     compiler.compile(el, true)
 
     // bind deferred directives (child components)
-    compiler.deferred.forEach(function (dir) {
-        compiler.bindDirective(dir)
-    })
+    i = compiler.deferred.length
+    while (i--) {
+        compiler.bindDirective(compiler.deferred[i])
+    }
 
     // extract dependencies for computed properties
     compiler.parseDeps()
@@ -158,27 +164,32 @@ CompilerProto.setupElement = function (options) {
         ? document.querySelector(options.el)
         : options.el || document.createElement(options.tagName || 'div')
 
-    var template = options.template
+    var template = options.template,
+        child, frag, replacer, i, attr, attrs
+
     if (template) {
         // collect anything already in there
         /* jshint boss: true */
-        var child,
-            frag = this.rawContent = document.createDocumentFragment()
+        frag = this.rawContent = document.createDocumentFragment()
         while (child = el.firstChild) {
             frag.appendChild(child)
         }
         // replace option: use the first node in
         // the template directly
         if (options.replace && template.childNodes.length === 1) {
-            var replacer = template.childNodes[0].cloneNode(true)
+            replacer = template.childNodes[0].cloneNode(true)
             if (el.parentNode) {
                 el.parentNode.insertBefore(replacer, el)
                 el.parentNode.removeChild(el)
             }
             // copy over attributes
-            each.call(el.attributes, function (attr) {
-                replacer.setAttribute(attr.name, attr.value)
-            })
+            if (el.hasAttributes()) {
+                i = el.attributes.length
+                while (i--) {
+                    attr = el.attributes[i]
+                    replacer.setAttribute(attr.name, attr.value)
+                }
+            }
             // replace
             el = replacer
         } else {
@@ -189,9 +200,9 @@ CompilerProto.setupElement = function (options) {
     // apply element options
     if (options.id) el.id = options.id
     if (options.className) el.className = options.className
-    var attrs = options.attributes
+    attrs = options.attributes
     if (attrs) {
-        for (var attr in attrs) {
+        for (attr in attrs) {
             el.setAttribute(attr, attrs[attr])
         }
     }
@@ -224,19 +235,21 @@ CompilerProto.setupObserver = function () {
         .on('mutate', onSet)
 
     // register hooks
-    hooks.forEach(function (hook) {
-        var fns = options[hook]
+    var i = hooks.length, j, hook, fns
+    while (i--) {
+        hook = hooks[i]
+        fns = options[hook]
         if (Array.isArray(fns)) {
-            var i = fns.length
+            j = fns.length
             // since hooks were merged with child at head,
             // we loop reversely.
-            while (i--) {
-                registerHook(hook, fns[i])
+            while (j--) {
+                registerHook(hook, fns[j])
             }
         } else if (fns) {
             registerHook(hook, fns)
         }
-    })
+    }
 
     // broadcast attached/detached hooks
     observer
@@ -300,8 +313,7 @@ CompilerProto.observeData = function (data) {
     $dataBinding.update(data)
 
     // allow $data to be swapped
-    defGetSet(compiler.vm, '$data', {
-        enumerable: false,
+    Object.defineProperty(compiler.vm, '$data', {
         get: function () {
             compiler.observer.emit('get', '$data')
             return compiler.data
@@ -622,7 +634,7 @@ CompilerProto.defineProp = function (key, binding) {
 
     binding.value = data[key]
 
-    defGetSet(compiler.vm, key, {
+    Object.defineProperty(compiler.vm, key, {
         get: function () {
             return compiler.data[key]
         },
@@ -640,14 +652,14 @@ CompilerProto.defineProp = function (key, binding) {
 CompilerProto.defineMeta = function (key, binding) {
     var vm = this.vm,
         ob = this.observer,
-        value = binding.value = key in vm
+        value = binding.value = hasOwn.call(vm, key)
             ? vm[key]
             : this.data[key]
     // remove initital meta in data, since the same piece
     // of data can be observed by different VMs, each have
     // its own associated meta info.
     delete this.data[key]
-    defGetSet(vm, key, {
+    Object.defineProperty(vm, key, {
         get: function () {
             if (Observer.shouldGet) ob.emit('get', key)
             return value
@@ -676,7 +688,7 @@ CompilerProto.defineExp = function (key, binding, directive) {
  */
 CompilerProto.defineComputed = function (key, binding, value) {
     this.markComputed(binding, value)
-    defGetSet(this.vm, key, {
+    Object.defineProperty(this.vm, key, {
         get: binding.value.$get,
         set: binding.value.$set
     })
@@ -884,11 +896,4 @@ function getRoot (compiler) {
     return compiler
 }
 
-/**
- *  for convenience & minification
- */
-function defGetSet (obj, key, def) {
-    Object.defineProperty(obj, key, def)
-}
-
 module.exports = Compiler

src/directives/repeat.js

@@ -5,7 +5,7 @@ module.exports = {
 
     bind: function () {
 
-        this.identifier = '$repeat' + this.id
+        this.identifier = '$r' + this.id
 
         var el   = this.el,
             ctn  = this.container = el.parentNode
@@ -106,7 +106,7 @@ module.exports = {
             item = newCollection[i]
             if (isObject) {
                 item.$index = i
-                if (item[this.identifier]) {
+                if (item.__emitter__ && item.__emitter__[this.identifier]) {
                     // this piece of data is being reused.
                     // record its final position in reused vms
                     item.$reused = true
@@ -145,7 +145,7 @@ module.exports = {
                 vms[vm.$index] = vm
             } else {
                 // this one can be destroyed.
-                delete item[this.identifier]
+                delete item.__emitter__[this.identifier]
                 vm.$destroy()
             }
         }
@@ -215,7 +215,7 @@ module.exports = {
             })
 
         // attach an ienumerable identifier
-        utils.defProtected(data, this.identifier, true)
+        data.__emitter__[this.identifier] = true
         vm.$index = index
 
         if (wrap) {

src/emitter.js

@@ -2,8 +2,7 @@ function Emitter () {
     this._ctx = this
 }
 
-var EmitterProto = Emitter.prototype,
-    slice = [].slice
+var EmitterProto = Emitter.prototype
 
 EmitterProto.on = function(event, fn){
     this._cbs = this._cbs || {}
@@ -16,7 +15,7 @@ Emitter.prototype.once = function(event, fn){
     var self = this
     this._cbs = this._cbs || {}
 
-    function on() {
+    function on () {
         self.off(event, on)
         fn.apply(this, arguments)
     }
@@ -57,15 +56,14 @@ Emitter.prototype.off = function(event, fn){
     return this
 }
 
-Emitter.prototype.emit = function(event){
+Emitter.prototype.emit = function(event, a, b, c){
     this._cbs = this._cbs || {}
-    var args = slice.call(arguments, 1),
-        callbacks = this._cbs[event]
+    var callbacks = this._cbs[event]
 
     if (callbacks) {
         callbacks = callbacks.slice(0)
         for (var i = 0, len = callbacks.length; i < len; i++) {
-            callbacks[i].apply(this._ctx, args)
+            callbacks[i].call(this._ctx, a, b, c)
         }
     }
 

src/exp-parser.js

@@ -156,8 +156,10 @@ exports.parse = function (exp, compiler, data, filters) {
 
     // wrap expression with computed filters
     if (filters) {
-        filters.forEach(function (filter) {
-            var args = filter.args
+        var args, filter
+        for (var i = 0, l = filters.length; i < l; i++) {
+            filter = filters[i]
+            args = filter.args
                 ? ',"' + filter.args.map(escapeQuote).join('","') + '"'
                 : ''
             body =
@@ -166,7 +168,7 @@ exports.parse = function (exp, compiler, data, filters) {
                 '").call(this,' +
                     body + args +
                 ')'
-        })
+        }
     }
 
     body = accessors + 'return ' + body

src/filters.js

@@ -98,12 +98,12 @@ var filters = module.exports = {
         }
 
         // get the search string
-        var search = stripQuotes(searchKey) || get(this, searchKey)
+        var search = stripQuotes(searchKey) || this.$get(searchKey)
         if (!search) return arr
         search = search.toLowerCase()
 
         // get the optional dataKey
-        dataKey = dataKey && (stripQuotes(dataKey) || get(this, dataKey))
+        dataKey = dataKey && (stripQuotes(dataKey) || this.$get(dataKey))
 
         // convert object to array
         if (!Array.isArray(arr)) {
@@ -120,7 +120,7 @@ var filters = module.exports = {
 
     orderBy: function (arr, sortKey, reverseKey) {
 
-        var key = stripQuotes(sortKey) || get(this, sortKey)
+        var key = stripQuotes(sortKey) || this.$get(sortKey)
         if (!key) return arr
 
         // convert object to array
@@ -134,9 +134,9 @@ var filters = module.exports = {
                 order = -1
             } else if (reverseKey.charAt(0) === '!') {
                 reverseKey = reverseKey.slice(1)
-                order = get(this, reverseKey) ? 1 : -1
+                order = this.$get(reverseKey) ? 1 : -1
             } else {
-                order = get(this, reverseKey) ? -1 : 1
+                order = this.$get(reverseKey) ? -1 : 1
             }
         }
 

src/observer.js

@@ -5,6 +5,7 @@ var Emitter  = require('./emitter'),
     // cache methods
     typeOf   = utils.typeOf,
     def      = utils.defProtected,
+    hasOwn   = ({}).hasOwnProperty,
     slice    = [].slice,
     // types
     OBJECT   = 'Object',
@@ -134,15 +135,15 @@ function unlinkArrayElements (arr, items) {
 var ObjProxy = Object.create(Object.prototype)
 
 def(ObjProxy, '$add', function (key, val) {
-    if (key in this) return
+    if (hasOwn.call(this, key)) return
     this[key] = val
     convertKey(this, key)
     // emit a propagating set event
     this.__emitter__.emit('set', key, val, true)
 }, !hasProto)
 
 def(ObjProxy, '$delete', function (key) {
-    if (!(key in this)) return
+    if (!(hasOwn.call(this, key))) return
     // trigger set events
     this[key] = undefined
     delete this[key]
@@ -315,7 +316,7 @@ function copyPaths (newObj, oldObj) {
     }
     var path, type, oldVal, newVal
     for (path in oldObj) {
-        if (!(path in newObj)) {
+        if (!(hasOwn.call(newObj, path))) {
             oldVal = oldObj[path]
             type = typeOf(oldVal)
             if (type === OBJECT) {
@@ -346,7 +347,7 @@ function ensurePath (obj, key) {
     }
     if (typeOf(obj) === OBJECT) {
         sec = path[i]
-        if (!(sec in obj)) {
+        if (!(hasOwn.call(obj, sec))) {
             obj[sec] = undefined
             if (obj.__emitter__) convertKey(obj, sec)
         }

src/utils.js

@@ -80,11 +80,10 @@ var utils = module.exports = {
      *  or for...in loops.
      */
     defProtected: function (obj, key, val, enumerable, writable) {
-        if (obj.hasOwnProperty(key)) return
         Object.defineProperty(obj, key, {
             value        : val,
-            enumerable   : !!enumerable,
-            writable     : !!writable,
+            enumerable   : enumerable,
+            writable     : writable,
             configurable : true
         })
     },