Vue.js: What is hydration in Vue SSR?

1<!-- Hydration mismatch example -->
2<template>
3    <div>{{ randomNumber }}</div>
4</template>
5
6<script setup>
7// ❌ Mismatch - random on server vs client
8const randomNumber = Math.random()
9
10// ✅ Fixed - use ref
11const randomNumber = ref(0)
12onMounted(() => {
13    randomNumber.value = Math.random()
14})
15</script>