Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
vue staticSubTree
<div id="counter-app">
<h1>Count: {{count}}</h1>
<h2>I will never change</h2> <!-- 这个节点是“纯静态子树”,不必更新,事实上它的确中了全等逻辑 -->
<button @click="count++">+1</button> <!-- 这个节点(看起来)也是“纯静态子树”,但它没有中全等逻辑 -->
<!-- 不过可以理解,因为它有一个event绑定(但看起来不会影响它的“纯静态”性质) -->
<!-- 另外,因为HTML标签之间的换行和空格带来的一些空文本节点也纷纷没有中全等逻辑 -->
</div>
<script>
var vm = new Vue({
el: '#counter-app',
data: {
count: 0
}
})
</script>

赞,确实可以进一步优化!
可以检测 inline statement 的事件绑定看做静态。
空文本节点可以干脆全部用同一个 vnode...

空文本节点确实提醒我了,之前专门搞了个 preserveWhitespace 选项,就是顾虑空文本节点的性能影响。现在全部用同一个 vnode 基本可以无视了...

yinheli commented May 12, 2016

赞~

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment