瞬间想到的

1. service worker，是一个介于浏览器和服务器的代理服务，可以把缓存拉满，可以缓存静态资源，甚至可以缓存服务器响应
2. Web Worker，在浏览器单开一个线程，缓解CPU密集的问题
3. 预解析DNS，<link rel="dns-prefetch" href="//g.alicdn.com">
4. 把一些静态和后端没有太多交互的页面切出去，使用SSR管理
5. 如果没有特别要求，可以使用HTTP2

非常规的方法，但是有奇效

性能优化包括运行时优化和开发时优化

运行时通用的常规的优化方法：

一些公共库挂CDN，如果公共前端库比较多的话，挂多个域名的CDN，因为HTTP协议的连接数会有限制，一般同时最多6个

减少不必要的请求，将多个请求合并为一个

雪碧图

打包、代码压缩、服务器运行时gzip压缩

做缓存

异步处理，懒加载；异步路由，异步组件

虚拟滚动窗格，大型虚拟列表

减少大型不可变数据的响应性开销

避免不必要的组件抽象

预加载

使用SSR、SSG

专门针对React框架的性能优化

1. 使用useMemo、useCallback、memo等避免或减少重新渲染的API
2. 使用useDeferredValue延迟更新的API
3. 使用useTransition不阻塞UI更新的API
4. 使用lazy懒加载React组件

专门针对Vue框架的性能优化

https://cn.vuejs.org/guide/best-practices/performance.html

Vue官网文档专门有一章介绍性能优化，主要分为两大块

页面加载优化（其实React和Vue都适用的）

1. 考虑使用SSR或者SSG，避免使用SPA，尽可能少JS
2. 尽量选择ES模块格式，对tree-shaking更优化；使用现代打包工具
3. 代码分割，异步组件

更新优化

1. props稳定（React和Vue都适用）
2. 使用v-once，用来渲染依赖运行时数据但无需再更新的内容。它的整个子树都会在未来的更新中被跳过。只创建，不更新。
3. v-memo，跳过不必要的更新
4. computed的稳定性

根据DevTools进行分析，哪一块耗时比较多，会具体情况，具体针对性处理，会具体看代码，优化代码，有些情况下需要做trade-off，一般情况下会用空间换时间。

具体情况，具体分析。