feat(weex): support batch update styles and attributes (#7046)

* feat(weex): support batch update styles * feat(weex): support batch update attributes
vuejs · Nov 13, 2017 · 7cf188e · 7cf188e
1 parent c2b1cfe
commit 7cf188e
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 9 deletions.
diff --git a/src/platforms/weex/runtime/modules/attrs.js b/src/platforms/weex/runtime/modules/attrs.js
@@ -15,18 +15,27 @@ function updateAttrs (oldVnode: VNodeWithData, vnode: VNodeWithData) {
     attrs = vnode.data.attrs = extend({}, attrs)
   }
 
+  const supportBatchUpdate = typeof elm.setAttrs === 'function'
+  const batchedAttrs = {}
   for (key in attrs) {
     cur = attrs[key]
     old = oldAttrs[key]
     if (old !== cur) {
-      elm.setAttr(key, cur)
+      supportBatchUpdate
+        ? (batchedAttrs[key] = cur)
+        : elm.setAttr(key, cur)
     }
   }
   for (key in oldAttrs) {
     if (attrs[key] == null) {
-      elm.setAttr(key)
+      supportBatchUpdate
+        ? (batchedAttrs[key] = undefined)
+        : elm.setAttr(key)
     }
   }
+  if (supportBatchUpdate) {
+    elm.setAttrs(batchedAttrs)
+  }
 }
 
 export default {

diff --git a/src/platforms/weex/runtime/modules/class.js b/src/platforms/weex/runtime/modules/class.js
@@ -36,8 +36,12 @@ function updateClass (oldVnode: VNodeWithData, vnode: VNodeWithData) {
   }
 
   const style = getStyle(oldClassList, classList, ctx)
-  for (const key in style) {
-    el.setStyle(key, style[key])
+  if (typeof el.setStyles === 'function') {
+    el.setStyles(style)
+  } else {
+    for (const key in style) {
+      el.setStyle(key, style[key])
+    }
   }
 }
 

diff --git a/src/platforms/weex/runtime/modules/style.js b/src/platforms/weex/runtime/modules/style.js
@@ -11,11 +11,18 @@ function createStyle (oldVnode: VNodeWithData, vnode: VNodeWithData) {
   }
   const elm = vnode.elm
   const staticStyle = vnode.data.staticStyle
+  const supportBatchUpdate = typeof elm.setStyles === 'function'
+  const batchedStyles = {}
   for (const name in staticStyle) {
     if (staticStyle[name]) {
-      elm.setStyle(normalize(name), staticStyle[name])
+      supportBatchUpdate
+        ? (batchedStyles[normalize(name)] = staticStyle[name])
+        : elm.setStyle(normalize(name), staticStyle[name])
     }
   }
+  if (supportBatchUpdate) {
+    elm.setStyles(batchedStyles)
+  }
   updateStyle(oldVnode, vnode)
 }
 
@@ -41,14 +48,23 @@ function updateStyle (oldVnode: VNodeWithData, vnode: VNodeWithData) {
     style = vnode.data.style = extend({}, style)
   }
 
+  const supportBatchUpdate = typeof elm.setStyles === 'function'
+  const batchedStyles = {}
   for (name in oldStyle) {
     if (!style[name]) {
-      elm.setStyle(normalize(name), '')
+      supportBatchUpdate
+        ? (batchedStyles[normalize(name)] = '')
+        : elm.setStyle(normalize(name), '')
     }
   }
   for (name in style) {
     cur = style[name]
-    elm.setStyle(normalize(name), cur)
+    supportBatchUpdate
+      ? (batchedStyles[normalize(name)] = cur)
+      : elm.setStyle(normalize(name), cur)
+  }
+  if (supportBatchUpdate) {
+    elm.setStyles(batchedStyles)
   }
 }
 

diff --git a/src/platforms/weex/runtime/modules/transition.js b/src/platforms/weex/runtime/modules/transition.js
@@ -119,8 +119,12 @@ function enter (_, vnode) {
   beforeEnterHook && beforeEnterHook(el)
 
   if (startState) {
-    for (const key in startState) {
-      el.setStyle(key, startState[key])
+    if (typeof el.setStyles === 'function') {
+      el.setStyles(startState)
+    } else {
+      for (const key in startState) {
+        el.setStyle(key, startState[key])
+      }
     }
   }