web优化笔记：资源的压缩与合并

减少请求数量 减小请求大小

html压缩

图片优化

图片格式

jpg:色彩好，压缩失真，边缘锯齿（压缩图片工具：imgmini）
png:细节好 体积大，常用于图标（压缩工具：imagemin-pngquant）

图片大小

压缩

懒加载

浏览器支持 img loading="lazy"
插件懒加载
渐进式图片（可使用工具）
响应式图片 srcset sizes

字体优化

FOIT 和 FOUT

字体未下载完成时 浏览器隐藏或自动降级 导致字体闪烁

解决方案 font-display