前端网页优化方案

1. 合并、压缩、混淆html/css/js文件（webpack实现，减小资源大小）
2. Nginx开启Gzip，进一步压缩资源（减小资源大小）
3. 图片资源使用CDN加速（提高加载速度）
4. 符合条件的图标做base64处理（减小资源大小）
5. 样式表放首部，JS放尾部（JS单线程，会阻塞页面；资源加载方式）
6. 设置缓存（强缓存和协商缓存，提高加载速度）
7. link或者src添加rel属性，设置prefetch或preload可预加载资源。（加载时机）
8. 如果使用了UI组件库，采用按需加载（减小资源大小）
9. SPA项目，通过import或者require做路由按需（减小资源大小）
10. 服务端渲染SSR，加快首屏渲染，利于SEO
11. 页面使用骨架屏，提高首页加载速度（提高加载速度）
12. 使用 JPEG 2000, JPEG XR, and WebP 的图片格式来代替现有的jpeg和png，当页面图片较多时，这点作用非常明显
13. 使用图片懒加载-lazyload
14. 使用精灵图
    不足之处还请大家补充