一、图片：网页加载的“大头”
图片往往是页面体积最大的部分，优化图片能快速见效。
- 用对图片格式
照片用WebP格式，比JPG小30%左右； 简单图形用SVG，放大不失真且体积小； 透明背景图优先用WebP，替代PNG；
2.懒加载非首屏图片 让用户看不到的图片先不加载，滚动到附近再加载。
二、JavaScript：别让脚本拖慢页面
- 控制加载时机
非必要脚本用defer或async延迟加载； 大型库（如Chart.js）按需加载；
- 减少不必要的代码
用Webpack等工具Tree-shaking，剔除未使用的代码 压缩混淆JS文件，减小体积
三、CSS：别让样式阻塞渲染
CSS加载会阻塞页面渲染，这一点很容易被忽略。
- 拆分CSS文件 把首屏必需的CSS抽出来内嵌到HTML，其他样式异步加载。
四、缓存：让重复访问更快 第一次加载后，让浏览器记住已经下载过的文件。
- 合理设置HTTP缓存头 通过服务器配置告诉浏览器哪些文件可以缓存，缓存多久。
- 文件名加哈希，实现缓存更新 当文件内容变化时，文件名也跟着变，确保用户能获取最新版本。
