虽然标题是vue项目的首屏优化策略，但是里面绝大部分的方法，对于其他语言写成的单页应用同样适用
首屏进入时，直接加载和首屏相关路由，其他全部路由组件实现懒加载，即打开该路由时再去加载；
在首屏加载组件时会将所有组件一起加载，不是在首屏就显示的组件请使用异步引入的原则；
不用第一眼就引入眼帘的首屏组件，可以用延迟加载的方法，比如人工等个1s后再加载；
俗称CDN加速，使得用户访问资源会找离自己物理距离最近的站点去获取资源；
用一些压缩工具压缩资源
相同质量下，webp格式的图片体积比JPEG格式图像减小40%，大大减少请求图片时间；
在服务器端就已经获取好数据并组装好HTML了，首屏渲染速度肯定会快于客户端渲染（在客户端需要运行js后再去拿数据）；
渲染DOM是需要消耗GPU计算的，越复杂的DOM渲染越慢；
不然会导致图片宽高数据涌来时，图片的高度变化带来的重排重绘；
将多个需要请求的图片合成一张图片来请求
在首屏等待的时候，手动添加loading提示/骨架屏/进度条，从感知上减少用户等待时长；
启用Gzip压缩功能, 可以使网站的css、js 、xml、html 等静态资源在传输时进行压缩,经过Gzip压缩后资源可以变为原来的30%甚至更小
图片太多不用一起请求，用户看到哪儿就请求哪儿的图片，没看到的地方不请求，放个占位图；
一个页面最多同时处理6个请求，超过6个请求后就会排队等候，导致页面卡顿；
Original: https://blog.csdn.net/u010463466/article/details/128310991
Author: 虾十一
Title: vue项目的首屏优化策略
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/756961/
转载文章受原作者版权保护。转载请注明原作者出处！