上一篇
WordPress首屏加载优化技巧是通过减少首屏渲染所需的请求数量、压缩资源体积、缓存动态页面以及延迟非关键脚本加载，来缩短用户看到主要内容的时间，以下直接列出具体优化方法。
启用页面缓存与对象缓存
页面缓存可将动态生成的HTML保存为静态文件,访客再次访问时直接返回静态内容，避免重复执行PHP与数据库查询，可使用WP Rocket、LiteSpeed Cache或W3 Total Cache等插件开启页面缓存，并设置较长的缓存过期时间，对象缓存则用于缓存数据库查询结果、选项数据和用户元数据，减少数据库压力，配合Redis或Memcached对象缓存后端，能进一步降低首屏响应时间，对于高并发网站，页面缓存配合CDN边缘缓存可让首屏HTML在离用户最近的节点直接返回，显著缩短首字节时间。
压缩HTML、CSS和JavaScript文件
移除HTML、CSS和JavaScript中的多余空格、换行、注释以及冗余代码，可减小文件体积，使用Autoptimize、Fast Velocity Minify等插件可自动合并与压缩前端资源，开启Gzip或Brotli压缩后，文本类资源在传输时可再减少60%到80%的体积，Brotli比Gzip压缩率更高，适合现代浏览器，压缩后的资源加载更快，浏览器解析所需时间也相应缩短，注意不要将过大的第三方库合并到单一文件中，应保留必要的异步加载入口，避免阻塞首屏渲染。
分发网络加速静态资源
CDN将图片、CSS、JavaScript、字体等静态文件分发到全球边缘节点，用户请求时从最近的节点响应，减少物理距离带来的延迟，WordPress站点可通过Cloudflare、KeyCDN、StackPath等服务接入CDN，插件如CDN Enabler可替换静态资源URL，CDN还可配置HTTP/2或HTTP/3传输，多路复用请求，避免队头阻塞，首屏需要加载的CSS和关键图片如果从CDN边缘节点返回，加载时间可降低30%以上，CDN缓存静态资源的同时也能缓存完整HTML页面，配合页面缓存插件实现边缘全页缓存。
图片懒加载与格式优化
首屏图片是占用带宽和请求数的主要资源,为所有非首屏图片添加loading="lazy"属性，浏览器会在图片接近视口时才发送请求，首屏图片则应使用fetchpriority="high"主动提升加载优先级，将图片格式转换为WebP或AVIF，可在同等画质下减少30%到50%的体积，使用ShortPixel、Imagify或Converter for Media插件自动生成WebP版本，响应式图片通过srcset按设备宽度加载合适尺寸，避免手机加载桌面大图，首屏Logo或关键背景图应压缩到最小可用尺寸，并显式设置宽高属性，防止布局偏移和额外回流。
延迟加载非关键JavaScript
JavaScript会阻塞HTML解析,首屏渲染时常因执行第三方脚本而延迟，将非关键脚本添加defer或async属性，使其不阻塞DOM构建。defer保持执行顺序并在DOM构建完成后运行，async下载完成后立即执行，适合无依赖的统计或广告脚本，使用Flying Scripts、WP Rocket的延迟JavaScript功能可将所有非必要的脚本推迟到用户交互后再加载，对于首屏必需的脚本，应内联关键JS或将其置于文档头部异步加载，移除页面中未使用的JavaScript库，尤其是前端框架和轮播图脚本，能直接减少脚本解析时间。
移除未使用的插件与脚本
每个启用插件都可能在前端加载样式和脚本,增加HTTP请求和解析负担，定期审计插件列表，停用并删除不再使用的插件，使用Query Monitor或WP Hive检查插件加载的资源，找出在首页加载多余CSS和JS的插件，可通过wp_dequeue_style和wp_dequeue_script函数在主题functions.php中按页面条件移除不需要的样式和脚本，Contact Form 7默认在所有页面加载表单脚本，可在非联系页面移除，Elementor、Divi等页面构建器会加载大量基础样式，仅在确需的页面保留资源，或使用性能更好的轻量主题。
优化Web字体加载
Web字体文件体积较大且可能阻塞文字渲染,首屏标题和正文使用的字体应控制字体家族数量，并仅加载实际用到的字重，使用font-display: swap让浏览器先显示回退字体，字体加载完成后再替换，避免不可见文字，对中文字体，仅提取首屏所需字符生成子集字体，而非加载完整字形，使用preload提示浏览器提前加载首屏关键字体文件，减少文字显示延迟，Google Fonts等外部字体服务可通过本地化字体文件或使用media="print" onload="this.media='all'"异步加载方法，防止字体CSS阻塞渲染。
使用HTTP/2或HTTP/3协议
HTTP/2支持多路复用、头部压缩和服务器推送，允许多个请求在同一条连接上并行传输，减少连接建立和排队时间，HTTP/3基于QUIC协议，在弱网环境下连接建立更快，减少首屏资源加载延迟，确保服务器或CDN启用HTTP/2或HTTP/3，并配置TLS证书，多数现代CDN默认开启HTTP/2，HTTP/3可在Cloudflare等服务中一键启用，多路复用可减轻以往合并CSS和JS的必要性，改为合理拆分资源反而能利用并行加载提升首屏速度。
数据库优化与清理
数据库查询慢会直接拖慢首屏HTML生成,定期清理文章修订版本、垃圾评论、过期瞬态选项和自动草稿，可使用WP-Optimize或Advanced Database Cleaner插件，为数据库表添加索引，优化postmeta和options表查询，禁用或减少wp-cron在每次页面加载时执行，将其改为服务器级定时任务，使用持久对象缓存减少重复查询，数据库响应时间降低后，首屏动态内容生成更快，首字节时间也随之缩短。
预加载关键资源与DNS预解析
通过<link rel="preload">提前加载首屏渲染必需的CSS、字体、Logo或首屏大图，让浏览器在解析HTML阶段就开始下载，通过<link rel="preconnect">提前建立与外部域名的连接，如CDN、字体服务、统计服务，减少DNS解析和TCP握手时间。dns-prefetch可进一步提前解析第三方域名的IP，在WordPress中，可将这些标签添加到主题header.php的<head>区域，或使用Perfmatters、WP Rocket的预加载功能，注意只预加载首屏关键资源，过度预加载会抢占带宽，反而拖慢主要内容显示。
