further performance tuning for v-for re-render

Author: yyx990803

src/directives/public/for.js

@@ -164,13 +164,19 @@ const vFor = {
     // from cache)
     var removalIndex = 0
     var totalRemoved = oldFrags.length - frags.length
+    // when removing a large number of fragments, watcher removal
+    // turns out to be a perf bottleneck, so we batch the watcher
+    // removals into a single filter call!
+    this.vm._vForRemoving = true
     for (i = 0, l = oldFrags.length; i < l; i++) {
       frag = oldFrags[i]
       if (!frag.reused) {
         this.deleteCachedFrag(frag)
         this.remove(frag, removalIndex++, totalRemoved, inDocument)
       }
     }
+    this.vm._vForRemoving = false
+    this.vm._watchers = this.vm._watchers.filter(w => w.active)
 
     // Final pass, move/insert new fragments into the
     // right place.

src/instance/internal/init.js

@@ -51,7 +51,8 @@ export default function (Vue) {
     this._isDestroyed =
     this._isReady =
     this._isAttached =
-    this._isBeingDestroyed = false
+    this._isBeingDestroyed =
+    this._vForRemoving = false
     this._unlinkFn = null
 
     // context:

src/watcher.js

@@ -1,8 +1,14 @@
-import { extend, warn, isArray, isObject, nextTick } from './util/index'
 import config from './config'
 import Dep from './observer/dep'
 import { parseExpression } from './parsers/expression'
 import { pushWatcher } from './batcher'
+import {
+  extend,
+  warn,
+  isArray,
+  isObject,
+  nextTick
+} from './util/index'
 
 let uid = 0
 
@@ -299,9 +305,10 @@ Watcher.prototype.depend = function () {
 Watcher.prototype.teardown = function () {
   if (this.active) {
     // remove self from vm's watcher list
-    // we can skip this if the vm if being destroyed
-    // which can improve teardown performance.
-    if (!this.vm._isBeingDestroyed) {
+    // this is a somewhat expensive operation so we skip it
+    // if the vm is being destroyed or is performing a v-for
+    // re-render (the watcher list is then filtered by v-for).
+    if (!this.vm._isBeingDestroyed && !this.vm._vForRemoving) {
       this.vm._watchers.$remove(this)
     }
     var depIds = Object.keys(this.deps)