㈠ 前端网站常规优化方案
1、减少请求次数
2、减小资源大小
3、提高响应和加载速度
4、优化资源加载时机
5、优化加载方式
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
㈡ 前端开发中，对图片的优化技巧有哪些
阶段一、图片从PS中出来的时候：
1、大图jpg，保存为连续模式。可以有模糊渐显的效果。普通的是扫描打印效果。
2、小图icon，http1.x服务器的话整在一起导出。http2.0服务器就无所谓了，可单个保存。
3、部分不适合与2切在一起的小图片，使用base64编码字符串代替。
阶段二、图片在代码中使用的时候：
1、图片保存在额外CDN服务器。可节省代码服务器空间，加快图片访问。
2.1、在图片即将进入到视野范围内时再加载，可节省流量，加快首屏展示。
2.2、在网络空闲的时候预加载后续的图片可以让用户等待时间更少。
3、考虑SEO的话，非内容的图片使用背景代替？
4、好的图片CDN自带图像处理功能，诸如裁剪压缩之类的功能，可以上传一张大图，使用带有不同参数的url来在不同的场景中使用图片。
阶段三、项目上线
1、尽量不要让图片链接失效好了