Vue.js 2 Web Development Projects

The key special attribute

When Vue is updating a list of DOM elements in a v-for loop, it tries to minimize the number of operations applied to the DOM, such as adding or removing elements. This is a very efficient way of updating the DOM in most cases and can improve the performance.

In order to do this, it reuses elements as much as it can and patches the DOM only where it is needed to have the desired result. It means repeated elements will be patched in place and won't be moved if an item is added or removed from the list. However, this also means that they won't animate if we apply transitions on them.

The following is a schema of how this works:

In this schema, we remove the third item in the list, which is c. However, the third