网站打开慢是最直接影响转化的问题之一。好消息是,大多数慢的原因都很固定,按顺序查就能定位。
一、按这个顺序排查
| 顺序 | 查什么 | 常见结论 |
|---|---|---|
| ① 图片 | 单张图有多大、有没有按显示尺寸缩放 | 绝大多数网站慢在这:一张图 3MB |
| ② 服务器 | 带宽多少、是否共享主机、响应时间多少 | 小带宽 + 大图 = 必然慢 |
| ③ 脚本与样式 | 外链文件数量、有没有阻塞渲染 | 几十个 JS 文件串行加载 |
| ④ 缓存 | 有没有开启浏览器缓存、有没有用 CDN | 每次访问都重新下载全部资源 |
| ⑤ 第三方 | 统计、客服、地图、字体等外部资源 | 某个第三方接口超时拖住整页 |
二、图片:投入产出比最高的一项
- 按显示尺寸切图:在页面上显示 400px 宽的图,就不要上传 2000px 的原图
- 选对格式:照片类用 JPEG/WebP;图标、纯色图形用 PNG/SVG
- 压缩:照片质量压到 80% 左右,肉眼几乎无差别,体积能小一半以上
- 首屏图优先:首屏的大图最该优化,它直接决定用户等多久
三、服务器与带宽
带宽决定同时能服务多少人。如果网站图片多、访问量上来,先加带宽或上 CDN,比优化代码见效快。国内访问建议选境内节点。
四、脚本与缓存
- 合并与压缩 CSS / JS,减少请求数
- 静态资源加版本号或长缓存,让浏览器复用
- 非首屏内容延迟加载(图片懒加载)
- 移除不再使用的第三方脚本——它们往往是被遗忘的拖累项
五、第三方资源要单独看
统计代码、在线客服、地图、外部字体,这些都要从别人服务器上加载。任何一个超时,整页都会卡住。排查时先临时禁用全部第三方,看速度是否恢复正常,再逐个加回来。
六、给自己定个目标
| 指标 | 参考目标 |
|---|---|
| 首屏可见时间(4G 网络) | 2 秒内 |
| 整页加载完成 | 4 秒内 |
| 单页图片总大小 | 1.5MB 以内 |
| 页面请求数 | 50 个以内 |
提醒:不要凭感觉判断快慢。用手机流量、在不同时间段各打开一次,才有参考价值。办公室的宽带会掩盖真实问题。
