性能优化
WordPress 性能优化是提升用户体验和 SEO 排名的关键。本章节介绍全面的性能优化策略。
📊 性能优化路线图
mermaid
mindmap
root((性能优化))
服务器层
PHP 版本
服务器缓存
HTTPS/2
数据库层
查询优化
索引优化
持久缓存
前端层
CSS/JS 优化
图片优化
CDN 加速
WordPress 层
主题优化
插件优化
对象缓存1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
⚡ 服务器优化
PHP 版本选择
| PHP 版本 | 性能提升 | 推荐度 |
|---|---|---|
| PHP 7.4 | 基准 | ⭐⭐ |
| PHP 8.0 | +20% | ⭐⭐⭐ |
| PHP 8.1 | +30% | ⭐⭐⭐⭐ |
| PHP 8.2 | +40% | ⭐⭐⭐⭐⭐ |
| PHP 8.3 | +50% | ⭐⭐⭐⭐⭐ |
OPcache 配置
ini
; php.ini
opcache.enable=1
opcache.memory_consumption=256
opcache.max_accelerated_files=10000
opcache.revalidate_freq=2
opcache.save_comments=1
opcache.enable_cli=11
2
3
4
5
6
7
2
3
4
5
6
7
持久连接
php
// wp-config.php
define('WP_ALLOW_MULTISITE', true);
// MySQL 持久连接
define('MYSQL_CLIENT_FLAGS', MYSQL_CLIENT_FOUND_ROWS | MYSQL_CLIENT_IGNORE_SPACE | MYSQL_CLIENT_INTERACTIVE);1
2
3
4
5
2
3
4
5
🗄️ 数据库优化
查询优化
php
<?php
// 使用 select() 指定字段
$posts = $wpdb->get_results(
"SELECT ID, post_title, post_content
FROM {$wpdb->posts}
WHERE post_type = 'post'
AND post_status = 'publish'"
);
// 使用 prepare 防止 SQL 注入
$results = $wpdb->get_results(
$wpdb->prepare(
"SELECT * FROM {$wpdb->posts} WHERE post_author = %d",
$author_id
)
);
// 使用 wp_cache 减少数据库查询
$post = wp_cache_get($post_id, 'posts');
if ($post === false) {
$post = get_post($post_id);
wp_cache_set($post_id, $post, 'posts', 3600);
}1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
索引优化
sql
-- 添加常用索引
ALTER TABLE wp_posts ADD INDEX idx_post_type_status (post_type, post_status);
ALTER TABLE wp_posts ADD INDEX idx_post_date (post_date);
ALTER TABLE wp_postmeta ADD INDEX idx_post_id (post_id);
ALTER TABLE wp_postmeta ADD INDEX idx_meta_key (meta_key);
-- 添加复合索引
ALTER TABLE wp_comments ADD INDEX idx_comment_approved_date (comment_approved, comment_date);1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
🎨 前端优化
脚本优化
php
<?php
// 移除不必要的脚本
add_action('wp_enqueue_scripts', function() {
// 移除 Gutenberg 块 CSS
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
// 移除 Emoji
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('wp_print_styles', 'print_emoji_styles');
});
// 延迟加载脚本
add_filter('script_loader_tag', function($tag, $handle) {
if (!is_admin()) {
return str_replace('src', 'defer src', $tag);
}
return $tag;
}, 10, 2);
// 预加载关键资源
add_action('wp_head', function() {
echo '<link rel="preload" href="' . get_template_directory_uri() . '/fonts/main-font.woff2" as="font" type="font/woff2" crossorigin>';
});1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
图片优化
php
<?php
// 延迟加载图片
add_filter('img_lazy_load_attributes', function($attributes) {
$attributes['loading'] = 'lazy';
return $attributes;
});
// 使用 WebP 格式
add_filter('wp_image_editors', function($editors) {
array_unshift($editors, 'WP_Image_Editor_WebP');
return $editors;
});
// 自动压缩图片
add_filter('jpeg_quality', function($quality) {
return 82;
});
add_filter('wp_editor_set_quality', function($quality, $mime_type) {
if ($mime_type === 'image/jpeg') {
return 82;
}
return $quality;
}, 10, 2);1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
CSS 优化
css
/* 使用 CSS 变量 */
:root {
--primary-color: #21759b;
--font-size-base: 16px;
}
/* 合并关键 CSS */
.critical-css {
font-family: system-ui;
color: #333;
}1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
🚀 缓存策略
对象缓存
php
<?php
// 使用 Transients API
set_transient('my_data', $data, HOUR_IN_SECONDS);
$data = get_transient('my_data');
delete_transient('my_data');
// 使用 wp_cache
wp_cache_set('key', $value, 'group', 3600);
$value = wp_cache_get('key', 'group');
// 自动加载选项
add_option('my_large_option', $data, '', 'no'); // 不自动加载
update_option('my_large_option', $data);1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
页面缓存
nginx
# Nginx 快速缓存配置
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2)$ {
expires 30d;
add_header Cache-Control "public, no-transform";
}
# 缓存 HTML 页面
location ~* \.html$ {
expires -1;
add_header Cache-Control "no-store, no-cache, must-revalidate";
}1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
浏览器缓存
apache
# .htaccess
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
</IfModule>
# 启用 GZIP
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/css application/json application/javascript text/xml application/xml
</IfModule>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
🌐 CDN 配置
php
<?php
// CDN URL 重写
add_filter('wp_get_attachment_url', function($url) {
return str_replace('https://your-site.com', 'https://cdn.your-site.com', $url);
});
// 静态资源 CDN
add_filter('style_loader_src', 'cdn_filter');
add_filter('script_loader_src', 'cdn_filter');
function cdn_filter($src) {
$cdn_domain = 'cdn.your-site.com';
return str_replace($_SERVER['HTTP_HOST'], $cdn_domain, $src);
}1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
📊 性能检测工具
在线工具
| 工具 | 说明 |
|---|---|
| PageSpeed Insights | Google 性能评分 |
| GTmetrix | 详细性能分析 |
| WebPageTest | 全面性能测试 |
| Pingdom | 速度和可用性 |
WordPress 插件
| 插件 | 功能 |
|---|---|
| WP Rocket | 综合缓存 |
| W3 Total Cache | 页面/对象/数据库缓存 |
| WP Super Cache | 静态页面缓存 |
| Smush | 图片优化 |
| Autoptimize | CSS/JS/HTML 优化 |
🎯 性能优化清单
::: checklist 必做优化
- [ ] 使用 PHP 8.x
- [ ] 启用 OPcache
- [ ] 使用 HTTPS
- [ ] 启用页面缓存
- [ ] 启用浏览器缓存
- [ ] 压缩 CSS/JS
- [ ] 延迟加载图片
- [ ] 使用 CDN
- [ ] 优化数据库查询
- [ ] 清理无用插件
- [ ] 使用轻量级主题
- [ ] 启用 GZIP 压缩 :::