What does the v-memo directive do?

VueJunior~1 min read

v-memo is an optimization directive in Vue 3.3+ that tells the framework:

"Do not re-render this template fragment until a specific set of dependencies changes."

In other words, this is a conditional skip of updates (memoization), similar to React.memo.

In simple terms

v-memo lets you cache part of the template. If the dependencies have not changed, Vue skips:

updating the virtual DOM
comparing nodes (diffing)
re-rendering the component

This can significantly speed up an application with heavy components, tables, lists, and so on.

Syntax

html

<div v-memo="[id, name]">
  <!-- content that Vue will not update until id and name change -->
</div>

The array is the list of dependencies.

Example

html

<div v-memo="[user.id]">
  <h3>{{ user.name }}</h3>
  <p>{{ user.email }}</p>
</div>

If user.name or user.email changes but user.id does not:

This fragment will not update.
Vue will skip it during diffing.

In other words, you have a frozen piece of the template until user.id changes.

Where this is useful

1. Large lists

For example, a table with thousands of rows:

html

<tr v-for="row in rows" :key="row.id" v-memo="[row.id]">
  <td>{{ row.value1 }}</td>
  <td>{{ row.value2 }}</td>
  <td>{{ computeHeavy(row) }}</td>
</tr>

If the row object updates without row.id changing, Vue skips the row's re-render.

2. Heavy computations in the template

html

<div v-memo="[item.version]">
  {{ heavyComputation(item.data) }}
</div>

3. Partially freezing the UI

You can avoid unnecessary updates of widgets, banners, static blocks.

Important points

v-memo only works on updates, the first render always runs.
If any dependency changes → the entire fragment updates fully.
This is a manual optimization, worth applying only when there is a problem.

Do not confuse with:

`v-once`

renders once, then never updates
rigidly static

`v-memo`

updates only when dependencies change
more flexible and controllable

Short Answer

Interview ready

Premium

A concise answer to help you respond confidently on this topic during an interview.