对for指令的diff, patch进行优化

RubyLouvre · May 20, 2016 · 9229afb · 9229afb
1 parent 74f924a
commit 9229afb
Show file tree

Hide file tree

Showing 9 changed files with 37 additions and 30 deletions.
diff --git a/src/avalon.test.js b/src/avalon.test.js
@@ -1,14 +1,24 @@
 
+//
+//var avalon = require('./seed/modern') 
+//
+//require('./filters/index')
+//require('./vdom/index')
+//require('./dom/modern')
+//require('./directives/modern')
+//require('./strategy/index')
+//require('./component/index')
+//require('./vmodel/modern')
 
-var avalon = require('./seed/modern') 
+var avalon = require('./seed/compact') //这个版本兼容IE6
 
 require('./filters/index')
 require('./vdom/index')
-require('./dom/modern')
-require('./directives/modern')
+require('./dom/compact')
+require('./directives/compact')
 require('./strategy/index')
 require('./component/index')
-require('./vmodel/modern')
+require('./vmodel/compact')
 
 
 require('../components/button/index')

diff --git a/src/directives/attr.js b/src/directives/attr.js
@@ -1,5 +1,6 @@
 
 var attrUpdate = require('../dom/attr/compact')
+var update = require('./_update')
 
 avalon.directive('attr', {
     parse: function (binding, num) {
@@ -28,11 +29,8 @@ avalon.directive('attr', {
                     cur.changeAttr = patch
                 }
             }
-            if (cur.changeAttr) {
-                var list = cur.change || (cur.change = [])
-                if(avalon.Array.ensure(list, this.update)){
-                   steps.count += 1
-                }
+            if (cur.changeAttr) { 
+                update(cur, this.update, steps, 'attr' )
             }
         } else {
             cur.props[name] = p

diff --git a/src/directives/attr.modern.js b/src/directives/attr.modern.js
@@ -1,5 +1,6 @@
 
 var attrUpdate = require('../dom/attr/modern')
+var update = require('./_update')
 
 avalon.directive('attr', {
     parse: function (binding, num) {
@@ -29,10 +30,7 @@ avalon.directive('attr', {
                 }
             }
             if (cur.changeAttr) {
-                var list = cur.change || (cur.change = [])
-                if(avalon.Array.ensure(list, this.update)){
-                    steps.count += 1
-                }
+                update(cur, attrUpdate, steps, 'attr' )
             }
         } else {
             cur.props[name] = p

diff --git a/src/directives/compact.js b/src/directives/compact.js
@@ -1,5 +1,5 @@
 require('./important')
-require('./controller2')
+require('./controller')
 //处理属性样式
 require('./attr')
 require('./css')

diff --git a/src/directives/controller.js b/src/directives/controller.js
@@ -1,4 +1,6 @@
 // 抽离出来公用
+var update = require('./_update')
+
 avalon.skipController = function (fast, vm, iv) {
     if (fast) {
         var id = vm.$render ? vm.$render.$id : vm.$id
@@ -37,10 +39,8 @@ avalon.directive('controller', {
     },
     diff: function (cur, pre, steps, name) {
         if (pre.props[name] !== cur.props[name]) {
-            var list = cur.change || (cur.change = [])
-            if (avalon.Array.ensure(list, this.update)) {
-                steps.count += 1
-            }
+            console.log('controller',steps)
+            update(cur, this.update, steps, 'controller' )
         }
     },
     update: function (node, vnode) {

diff --git a/src/directives/css.js b/src/directives/css.js
@@ -1,4 +1,5 @@
 
+var update = require('./_update')
 
 avalon.directive('css', {
     parse: function (binding, num) {
@@ -7,7 +8,7 @@ avalon.directive('css', {
     diff: function (cur, pre, steps, name) {
         var a = cur.props[name]
         var p = pre.props[name]
-        if ( Object(a) === a) {
+        if (Object(a) === a) {
             if (Array.isArray(a)) {
                 a = cur.props[name] = avalon.mix.apply({}, a)
             }
@@ -27,10 +28,7 @@ avalon.directive('css', {
                 }
             }
             if (cur.changeStyle) {
-                var list = cur.change || (cur.change = [])
-                if(avalon.Array.ensure(list, this.update)){
-                   steps.count += 1
-                }
+                update(cur, this.update, steps, 'css')
             }
         } else {
             cur.props[name] = p

diff --git a/src/seed/config.js b/src/seed/config.js
@@ -44,5 +44,5 @@ var plugins = {
 }
 kernel.plugins = plugins
 kernel.plugins['interpolate'](['{{', '}}'])
-
+//kernel.showDiff = true
 kernel.debug = true
diff --git a/src/strategy/diff.js b/src/strategy/diff.js
@@ -27,9 +27,14 @@ function diff(current, previous, steps) {
                 }
                 break
             case 8:
-                if (cur.directive === 'for') {
-                    i = directives['for'].diff(current, previous, steps, i)
-                } else if (cur.directive) {//if widget
+                if (cur.directive === 'for' ) {
+                   if(cur.hasChange){
+                       i = directives['for'].diff(current, previous, steps, i)
+                   }else{
+                       avalon.shadowCopy(cur, previous[i])
+                       delete cur.hasChange
+                   }
+                } else if (cur.directive ) {//if widget
                     directives[cur.directive].diff(cur, pre, steps)
                 }
                 break

diff --git a/src/strategy/patch.js b/src/strategy/patch.js
@@ -22,7 +22,7 @@ function patch(nodes, vnodes, parent, steps) {
             next = node.nextSibling
         }
         if (vnode.directive === 'for') {
-            if (vnode.change) {
+            if (vnode.hasChange) {
                 if (!node) {
                     return
                 }
@@ -42,9 +42,7 @@ function patch(nodes, vnodes, parent, steps) {
                 }
                 next = vnode.endRepeat.nextSibling
             }
-
         }
-
         //ms-for, ms-if, ms-widget会返回false
         if (false === execHooks(node, vnode, parent, steps, 'change')) {
             if (vnode.repeatCount) {