图片压缩与拼接
PNG、PNG-8、PNG-24以及JPEG格式图片区别
PNG格式适合对透明度有要求的情形，PNG-8处理不了复杂色域下的渐变，PNG-24可以几乎不失真地保留渐变
图片压缩方法
使用Photoshop自带图片压缩，文件—存储为Web所用格式，一般情况下，JPEG选择输出质量为70~80%可以保证视觉上几乎没有差异。
页面体积
优化前后文件体积压缩率 = 优化后的体积÷优化前的体积
懒加载原理
什么是懒加载的定义是对于图片而言，图片资源，对于商城项目图片是很多的，页面很长的业务场景适用，减少无效资源的加载，并发加载的资源过多会阻塞js的加载。
当图片进入到我们可视区域，去请求加载资源
懒加载的效果延迟加载
预加载原理
图片等静态资源使用前提前请求，资源在使用时从缓存中加载，提高用户体验。
什么是重绘与回流的机制？
频繁重绘与回流会导致ui频繁渲染，导致JavaScript变慢。回流，当render tree中的一部分因为元素的规模尺寸，布局等改变需要重新构建，会触发回流，重绘，当render tree中的一些元素需要修改属性，这些属性不影响元素的外观，风格，布局，就叫做重绘，如修改颜色等。
所以回流一定会引起重绘，但是重绘不一定会引起回流。
掌握一些css属性
将频繁重绘回流的元素单独出来，作为一个独立的图层，那么这个元素的重绘回流就只能影响这个图层中。
把一个元素独立成独立的图层，用css属性
避免使用触发重绘，回流的css属性，重绘和回流很频繁可以独立出来。