v-once — renders once. v-memo — memoizes with dependencies.
v-once:
1<template>2 <!-- Never re-renders -->3 <div v-once>{{ message }}</div>45 <!-- Static content -->6 <div v-once>7 <h1>Title</h1>8 <p>Static content</p>9 </div>10</template>
v-memo (Vue 3.2+):
1<template>2 <!-- Re-renders only when dependencies change -->3 <div v-memo="[item.id, item.selected]">4 {{ item.name }}5 </div>67 <!-- With v-for -->8 <div v-for="item in list" :key="item.id" v-memo="[item.selected]">9 {{ item.name }}10 </div>11</template>