Vue 应用如何进行性能优化？

1. 减少不必要的响应式开销

Vue 的响应式系统会为深层对象建立代理。对于不需要响应式的大型静态数据，可使用 shallowRef、shallowReactive 或 markRaw 避免深度代理，减少响应式转换的开销。同时应避免把不需要响应的大对象包裹进响应式系统。

2. 合理使用计算属性与监听

优先用 computed 表达派生状态，利用其缓存特性避免重复计算；对计算成本高的列表，可结合缓存减少重算。避免在模板或计算属性中编写复杂表达式，以免每次渲染都重复执行。

3. 列表渲染优化

为列表项设置稳定的 key，帮助 diff 算法最大化复用节点。对长列表可使用虚拟滚动等技术只渲染可视区域，减少 DOM 节点数量。

4. 组件与代码分割

通过路由懒加载和异步组件实现按需加载，把首屏所需代码控制在最小范围。对频繁切换显隐的组件，可结合 keep-alive 缓存组件实例，避免重复创建销毁。

5. 构建与运行时优化

使用 Vite 等现代构建工具，配合生产模式打包、Tree-shaking 移除未使用代码、按需引入第三方库等方式减小包体积。在更新频繁的场景中，可评估使用 Vue 3.6 引入的 Vapor Mode 以获得更优的运行时性能。