markRaw()
Marks an object so it is never converted into a reactive proxy.
Syntax
markRaw<T extends object>(value: T): TParameters
| Name | Type | Required | Description |
|---|---|---|---|
value | object | No | The object to permanently exclude from reactivity. |
Returns
T — The same object, flagged as raw.
Examples
<script setup lang="ts">
import { reactive, markRaw } from 'vue';
const heavy = markRaw(new ThirdPartyChart());
const state = reactive({ chart: heavy }); // chart stays non-reactive
</script>
Notes
Use markRaw for large, immutable, or external instances (class instances,
chart/editor objects) that should never be made reactive, avoiding proxy
overhead and potential interference. The flag is permanent and also prevents
the object from being wrapped when nested in reactive state.