Javascript is required
·
0 min read

Vue Tip: Memoize a Sub-Tree of the Template Using v-memo

Vue Tip: Memoize a Sub-Tree of the Template Using v-memo Image

The v-memo directive is like a computed prop for the template and be used on both elements and components:

1<template>
2  <div v-memo="[valueA, valueB]">
3    <!-- ... -->
4  </div>
5</template>

The v-memo directive expects a fixed-length array of dependency values to compare for the memoization.

If every value in the array was the same as last render, then updates for the entire sub-tree will be skipped.

If you liked this Vue tip, follow me on X to get notified about new tips, blog posts, and more. Alternatively (or additionally), you can subscribe to my weekly Vue & Nuxt newsletter:

I will never share any of your personal data. You can unsubscribe at any time.