如何处理打包出来的项目(首屏)加载过慢的问题

admin • 2023年11月30日 am4:07 • 性能优化 • 阅读 70

SPA应用: 单页应用程序, 所有的功能, 都在一个页面中, 如果第一次将所有的路由资源, 组件都加载了, 就会很慢!

加载过慢 => 一次性加载了过多的资源, 一次性加载了过大的资源

- 加载过多 => 路由懒加载, 访问到路由, 再加载该路由相关的组件内容
- 加载过大 => 图片压缩, 文件压缩合并处理, 开启gzip压缩等

比如:

1. 配置异步组件, 路由懒加载

js
const login = () => import('../pages/login.vue')

2. 图片压缩: 使用 webp 格式的图片, 提升首页加载的速度

3. CDN加速: 配置CDN加速, 加快资源的加载效率 (花钱)

4. 开启 gzip 压缩 (一般默认服务器开启的, 如果没开, 确实可能会很慢, 可以让后台开一下)

发布者：admin，如若转载，请注明出处：https://ai1024.vip/39246.html

如何处理 打包出来的项目(首屏)加载过慢的问题