作者：柚子君 | 15年互联网营销经验 · 300+项目沉淀
用户打开你网站的那一刻，决定了他会不会留下。研究表明，页面加载超过3秒，53%的用户会选择离开。这不是危言耸听，这是真实流失的流量和商机。
优化速度的第一步不是动手改代码，而是先找准瓶颈。推荐使用 Google Lighthouse 和 Chrome DevTools Network 面板，这两个工具免费且精准。
重点关注这三个核心指标：
TTFB（Time To First Byte）：服务器响应时间，目标值 < 200ms
FCP（First Contentful Paint）：首屏内容渲染，目标值 < 1.8s
LCP（Largest Contentful Paint）：最大内容渲染，目标值 < 2.5s
打开 Chrome 按 F12，切到 Network 面板，勾选 Disable cache，清空浏览器缓存后刷新。慢的资源一目了然。
TTFB 超过 600ms？问题大概率出在服务器或网络层。
国内站点推荐阿里云、腾讯云，BGP 线路能覆盖三大运营商。如果业务面向全球，Cloudflare 或 AWS CloudFront 是首选。CDN 不只是加速静态资源，对动态请求同样有效。
HTTP/2 支持多路复用，一个 TCP 连接并行请求多个资源。Nginx 默认支持 HTTP/2，只需在配置中加一行：
server {
listen 443 ssl http2;
...
}HTTP/3 基于 QUIC 协议，进一步降低延迟。现在主流浏览器已全面支持。
一张未压缩的 3MB 轮播图，能让整站 LCP 飙升到 5 秒以上。WebP 格式比 JPEG 体积小 30%，且画质几乎无损。推荐用 TinyPNG 或 Squoosh 批量压缩。
非首屏图片必须用懒加载：
<img src="placeholder.jpg" data-src="real-image.webp" class="lazy" />
<script>
document.querySelectorAll('.lazy').forEach(img => {
if (img.dataset.src) {
img.src = img.dataset.src;
img.removeAttribute('data-src');
}
});
</script>每个 HTTP 请求都有 DNS 解析 + TCP 握手 + SSL 握手的时间成本。10 个小文件合并成 1 个，请求数从 10 降到 1，延迟减少立竿见影。
Webpack、Vite、esbuild 等构建工具都能自动完成合并压缩。CSS 放 <head>，JS 放 </body> 前，避免阻塞渲染。
强缓存（Cache-Control）和协商缓存（ETag/Last-Modified）配合使用，静态资源设置长缓存，用户第二次访问直接读本地缓存，0 请求耗时。
location ~* \.(js|css|png|jpg|jpeg|gif|ico|webp)$ {
expires 30d;
add_header Cache-Control "public, no-transform";
}版本号哈希是更新缓存的标准做法：main.a3b7c9d8.js，改代码后哈希值自动变化，用户会拉取新文件，旧缓存不受影响。
WordPress、Typecho 等动态站点，慢查询是拖垮速度的隐形杀手。用 Query Monitor 插件找出慢 SQL，添加合适的索引，查询时间能从 2 秒降到 20 毫秒。
接口层面开启 Gzip 或 Brotli 压缩，JSON 数据体积压缩 70% 很常见。Nginx 配置一行搞定：
gzip on; gzip_types application/json text/css application/javascript; gzip_min_length 1000;
Q：网站速度多少算合格？
A：根据 Core Web Vitals 标准，LCP < 2.5s、FID < 100ms、CLS < 0.1 为达标。使用 Lighthouse 评分，90 分以上为良好，80-90 分为中等需要优化。
Q：CDN 对小流量网站有必要吗？
A：有必要。CDN 不仅加速，还能扛 DDoS 攻击、降低源站压力。国内百度云加速、Cloudflare 都提供免费套餐，小站完全够用。
Q：WordPress 网站怎么快速提速？
A：三个必做：①安装 WP Super Cache 或 W3 Total Cache 开启页面缓存；②用 Imagify 或 ShortPixel 压缩所有图片；③移除不必要的插件，减少 JS 加载。
Q：移动端速度和 PC 端是分开优化的吗？
A：基础优化（服务器、CDN、缓存）两者一致，但移动端更要注意：减少重定向、启用压缩、限制首屏图片体积。用 Chrome DevTools 的 Network 面板切换 Device 模式测试。
Q：HTTPS 会影响网站速度吗？
A：HTTPS 握手会增加几十毫秒延迟，但换来的是安全性和 SEO 加分，完全值得。开启 HTTP/2 或 HTTP/3 后，多路复用和 0-RTT 技术能弥补甚至超越 HTTP/1.1 的速度。
查看更多关于网站速度优化网站打开慢页面加载速度TTFB优化CDN加速LighthouseCore Web Vitals网站性能优化网页优化的文章
额！本文竟然没有沙发！你愿意来坐坐吗？
欢迎 发表评论