为什么Vue DOM变化的速度这么慢？
我有一个包含 2000 个输入复选框的列表。当一次选择它们时，会出现大约 2 秒的明显延迟（并且浏览器冻结）。 Vue 和 React 似乎是这种情况，但 Svelte、jQuery 或 vanilla 则不然。
有了超过 5k 个复选框，它就会成为一个非常烦人的 3-5 秒拦截器......
为什么重新渲染需要这么长时间？
如何使用 Vue.js 克服此更新延迟？
（分页或延迟加载的解决方案并没有真正解决问题；他们只是在避免问题。）
下面是 Vue 中的代码，后面是 Svelte 中的相同示例。
<script setup>
import { ref } from 'vue'
const items = ref(Array.from({length: 2000}, (v, k) => k));
let selected = ref([]);
function selectAll() {
selected.value = items.value.map(i => i);
}
</script>
<template>
<button @click="selectAll">
Select all
</button>
<button @click="selected = []">
Select none
</button>
<label v-for="n in items">
<input v-model="selected" type="checkbox" :value="n">
{{ n }}
</label>
</template>
<style>
label {
display: block;
}
</style>
Vue SFC 链接
苗条：
<script>
let items = Array.from({length: 2000}, (v, k) => k);
let selected = [];
function selectAll() {
selected = items.map(i => i);
}
</script>
<button on:click={selectAll}>
Select all
</button>
<button on:click="{() => selected = []}">
Select none
</button>
{#each items as n, i}
<label>
<input type=checkbox bind:group={selected} value={n}>
{n}
</label>
{/each}
<style>
label {
display: block;
}
</style>
Svelte REPL 链接
