A memory leak
1, instructions binding event, but no unbundling event, prone to memory leaks. (I have encountered cases)
2, v-if instruction memory leak, such as v-if the deleted parent element, parent element but not deleted in the fragment dom
3, jumps to another route, but did not delete dom fragments produced. You need to log tripartite plug-in beforeDestroy () hook, the destruction of timers
Two, Vue. $ Set
1, vue 2 variations can not be detected with an array of objects: an array of length variation, the array index of the content; adding and removing the object attributes.
2, Vue $ set (target, key, value):. To the array can dynamically add and modify data objects, and updates the display of the view data
3, vue constructor new Vue to complete the binding data by the Object.defineProperty getter and setter methods when (), so a direct method by vm.arr [1] = 'aa' can not be modified to trigger value vue updated in view, we had to be changed by the method Object.defineProperty while Vue. $ set () method to encapsulate Object.defineProperty underlying js
Three, key role of virtual diff algorithms
1, the virtual diff algorithm assumes:
(1) two identical components dom produce similar structures, different components have different structures dom
(2) a set of nodes of the same level may be distinguished by a unique id
When the data page is changed, Diff algorithm will compare the same node level:
If the node types, to kill the previous node, and then create and insert a new node, it will not compare the child node of this node later.
If the same type of the node, the node will re-set the properties, thereby achieving updating node.
When a layer has many of the same node, that is, when a list of nodes, the update process Diff algorithm default is to follow the above principles. So we need to make a key that uniquely identifies each node, Diff algorithm can correctly identify this node, finding the right location area to insert a new node.
2, so the key role is efficient update virtual dom