文件优化
图片优化
图片加载优化
- 不用图片，尽可能用css等去代替
- 对于移动端来说，图片用CDN加载，计算出可适配屏幕的宽度，然后去请求相应裁剪好的图片
- 小图使用base64格式
- 雪碧图的应用
- 选择正确的图片格式：
- 能用webp的尽量用webp
- 小图使用png，图标类可使用svg代替
- 照片使用jpg
其他文件优化
- css文件放在head中
- 服务端开启文件压缩功能
- 将script标签放在body底部，因为js文件执行会阻塞渲染。当然也可以把script标签放在任意位置然后加上defer，表示该文件会并行下载，但是会放到html解析完成后顺序执行。对于没有任何依赖的JS文件可以加上async，表示加载和渲染后续文档元素的过程将和JS文件的加载与执行并行无序进行
- 执行JS代码过长会卡住渲染，对于需要很多时间计算的代码可以考虑使用webWorker。webWorker可以让我们另开一个线程执行脚本而不影响渲染
CDN
静态资源尽量使用CDN加载，由于浏览器对于单个域名有并发请求上限，可以考虑使用多个CDN域名。对于CDN加载静态资源需要注意CDN域名要与主站不同，否则每次请求都会带上主站的cookie