Loading...
Loading...
Compare original and translation side by side
| Metric | Good | Needs Improvement | Poor |
|---|---|---|---|
| LCP (Largest Contentful Paint) | ≤2.5s | 2.5-4s | >4s |
| INP (Interaction to Next Paint) | ≤200ms | 200-500ms | >500ms |
| CLS (Cumulative Layout Shift) | ≤0.1 | 0.1-0.25 | >0.25 |
| 指标 | 优秀 | 待改进 | 较差 |
|---|---|---|---|
| LCP (Largest Contentful Paint) | ≤2.5s | 2.5-4s | >4s |
| INP (Interaction to Next Paint) | ≤200ms | 200-500ms | >500ms |
| CLS (Cumulative Layout Shift) | ≤0.1 | 0.1-0.25 | >0.25 |
// Recommended EWWW settings via wp-config.php or plugin settings
// Enable WebP conversion
define('EWWW_IMAGE_OPTIMIZER_WEBP', true);
// Set maximum dimensions
define('EWWW_IMAGE_OPTIMIZER_MAX_WIDTH', 2560);
define('EWWW_IMAGE_OPTIMIZER_MAX_HEIGHT', 2560);
// Enable lazy loading
define('EWWW_IMAGE_OPTIMIZER_LAZY_LOAD', true);// Recommended EWWW settings via wp-config.php or plugin settings
// Enable WebP conversion
define('EWWW_IMAGE_OPTIMIZER_WEBP', true);
// Set maximum dimensions
define('EWWW_IMAGE_OPTIMIZER_MAX_WIDTH', 2560);
define('EWWW_IMAGE_OPTIMIZER_MAX_HEIGHT', 2560);
// Enable lazy loading
define('EWWW_IMAGE_OPTIMIZER_LAZY_LOAD', true);| Use Case | Format | Max Width | Quality |
|---|---|---|---|
| Hero images | WebP (fallback JPG) | 1920px | 80-85% |
| Content images | WebP (fallback JPG) | 1200px | 80% |
| Thumbnails | WebP | 600px | 75% |
| Icons/logos | SVG or PNG | As needed | Lossless |
| Photos with transparency | WebP or PNG | As needed | 85% |
| 使用场景 | 格式 | 最大宽度 | 质量 |
|---|---|---|---|
| 首页横幅图 | WebP(降级兼容JPG) | 1920px | 80-85% |
| 内容配图 | WebP(降级兼容JPG) | 1200px | 80% |
| 缩略图 | WebP | 600px | 75% |
| 图标/Logo | SVG或PNG | 按需设置 | 无损 |
| 带透明度的图片 | WebP或PNG | 按需设置 | 85% |
// Add custom image sizes
function theme_custom_image_sizes() {
add_image_size('hero', 1920, 1080, true);
add_image_size('hero-tablet', 1024, 768, true);
add_image_size('hero-mobile', 768, 1024, true);
add_image_size('card', 600, 400, true);
add_image_size('thumb-square', 300, 300, true);
}
add_action('after_setup_theme', 'theme_custom_image_sizes');// Add custom image sizes
function theme_custom_image_sizes() {
add_image_size('hero', 1920, 1080, true);
add_image_size('hero-tablet', 1024, 768, true);
add_image_size('hero-mobile', 768, 1024, true);
add_image_size('card', 600, 400, true);
add_image_size('thumb-square', 300, 300, true);
}
add_action('after_setup_theme', 'theme_custom_image_sizes');// Preload LCP image
function theme_preload_hero() {
if (is_front_page()) {
$hero_url = get_theme_file_uri('/assets/images/hero.webp');
echo '<link rel="preload" as="image" href="' . esc_url($hero_url) . '">';
}
}
add_action('wp_head', 'theme_preload_hero', 1);// Preload LCP image
function theme_preload_hero() {
if (is_front_page()) {
$hero_url = get_theme_file_uri('/assets/images/hero.webp');
echo '<link rel="preload" as="image" href="' . esc_url($hero_url) . '">';
}
}
add_action('wp_head', 'theme_preload_hero', 1);undefinedundefined
3. **HTML with fallbacks**
```html
<video autoplay muted loop playsinline poster="poster.jpg">
<source src="video.webm" type="video/webm">
<source src="video.mp4" type="video/mp4">
</video>
3. **带降级兼容的HTML代码**
```html
<video autoplay muted loop playsinline poster="poster.jpg">
<source src="video.webm" type="video/webm">
<source src="video.mp4" type="video/mp4">
</video>// Lazy load video on scroll
const videoObserver = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
const video = entry.target;
video.src = video.dataset.src;
video.load();
videoObserver.unobserve(video);
}
});
});
document.querySelectorAll('video[data-src]').forEach(video => {
videoObserver.observe(video);
});// Lazy load video on scroll
const videoObserver = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
const video = entry.target;
video.src = video.dataset.src;
video.load();
videoObserver.unobserve(video);
}
});
});
document.querySelectorAll('video[data-src]').forEach(video => {
videoObserver.observe(video);
});// wp-config.php settings
define('LITESPEED_ON', true);
define('LITESPEED_CACHE_DIR', WP_CONTENT_DIR . '/cache/litespeed/');| Setting | Value |
|---|---|
| Enable Cache | On |
| Cache Logged-in Users | Off (unless needed) |
| Cache Mobile | On |
| TTL | 604800 (7 days) |
| Browser Cache | On |
| Browser Cache TTL | 31557600 (1 year) |
| Minify CSS | On |
| Minify JS | On |
| Combine CSS | Test carefully |
| Combine JS | Test carefully |
| HTTP/2 Push | CSS, JS |
| Lazy Load Images | On |
| WebP Replacement | On (if EWWW handles it, disable here) |
// wp-config.php settings
define('LITESPEED_ON', true);
define('LITESPEED_CACHE_DIR', WP_CONTENT_DIR . '/cache/litespeed/');| 设置项 | 取值 |
|---|---|
| 启用缓存 | 开启 |
| 缓存已登录用户 | 关闭(除非有需求) |
| 缓存移动端 | 开启 |
| TTL | 604800(7天) |
| 浏览器缓存 | 开启 |
| 浏览器缓存TTL | 31557600(1年) |
| 压缩CSS | 开启 |
| 压缩JS | 开启 |
| 合并CSS | 谨慎测试后启用 |
| 合并JS | 谨慎测试后启用 |
| HTTP/2 推送 | CSS、JS |
| 图片懒加载 | 开启 |
| WebP 替换 | 开启(若EWWW已处理则关闭) |
// wp-config.php
define('WP_REDIS_HOST', '127.0.0.1');
define('WP_REDIS_PORT', 6379);
define('WP_REDIS_DATABASE', 0);
define('WP_CACHE', true);
// Install Redis Object Cache plugin// wp-config.php
define('WP_REDIS_HOST', '127.0.0.1');
define('WP_REDIS_PORT', 6379);
define('WP_REDIS_DATABASE', 0);
define('WP_CACHE', true);
// Install Redis Object Cache plugin// Cache expensive queries
function get_featured_properties() {
$cache_key = 'featured_properties';
$properties = get_transient($cache_key);
if (false === $properties) {
$properties = new WP_Query([
'post_type' => 'property',
'posts_per_page' => 6,
'meta_key' => '_featured',
'meta_value' => '1'
]);
set_transient($cache_key, $properties, HOUR_IN_SECONDS);
}
return $properties;
}
// Clear cache on update
function clear_property_cache($post_id) {
if ('property' === get_post_type($post_id)) {
delete_transient('featured_properties');
}
}
add_action('save_post', 'clear_property_cache');// Cache expensive queries
function get_featured_properties() {
$cache_key = 'featured_properties';
$properties = get_transient($cache_key);
if (false === $properties) {
$properties = new WP_Query([
'post_type' => 'property',
'posts_per_page' => 6,
'meta_key' => '_featured',
'meta_value' => '1'
]);
set_transient($cache_key, $properties, HOUR_IN_SECONDS);
}
return $properties;
}
// Clear cache on update
function clear_property_cache($post_id) {
if ('property' === get_post_type($post_id)) {
delete_transient('featured_properties');
}
}
add_action('save_post', 'clear_property_cache');// Remove unused block styles
function theme_remove_block_styles() {
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
wp_dequeue_style('global-styles');
}
add_action('wp_enqueue_scripts', 'theme_remove_block_styles', 100);
// Defer non-critical CSS
function theme_defer_styles($html, $handle, $href, $media) {
$defer_handles = ['theme-animations', 'font-awesome'];
if (in_array($handle, $defer_handles)) {
return '<link rel="preload" as="style" href="' . $href . '" onload="this.onload=null;this.rel=\'stylesheet\'">' .
'<noscript><link rel="stylesheet" href="' . $href . '"></noscript>';
}
return $html;
}
add_filter('style_loader_tag', 'theme_defer_styles', 10, 4);// Remove unused block styles
function theme_remove_block_styles() {
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
wp_dequeue_style('global-styles');
}
add_action('wp_enqueue_scripts', 'theme_remove_block_styles', 100);
// Defer non-critical CSS
function theme_defer_styles($html, $handle, $href, $media) {
$defer_handles = ['theme-animations', 'font-awesome'];
if (in_array($handle, $defer_handles)) {
return '<link rel="preload" as="style" href="' . $href . '" onload="this.onload=null;this.rel=\'stylesheet\'">' .
'<noscript><link rel="stylesheet" href="' . $href . '"></noscript>';
}
return $html;
}
add_filter('style_loader_tag', 'theme_defer_styles', 10, 4);// Defer scripts
function theme_defer_scripts($tag, $handle, $src) {
$defer_scripts = ['theme-main', 'gsap', 'gsap-scrolltrigger'];
if (in_array($handle, $defer_scripts)) {
return str_replace(' src', ' defer src', $tag);
}
return $tag;
}
add_filter('script_loader_tag', 'theme_defer_scripts', 10, 3);
// Remove jQuery if not needed
function theme_remove_jquery() {
if (!is_admin()) {
wp_deregister_script('jquery');
wp_deregister_script('jquery-migrate');
}
}
add_action('wp_enqueue_scripts', 'theme_remove_jquery');// Defer scripts
function theme_defer_scripts($tag, $handle, $src) {
$defer_scripts = ['theme-main', 'gsap', 'gsap-scrolltrigger'];
if (in_array($handle, $defer_scripts)) {
return str_replace(' src', ' defer src', $tag);
}
return $tag;
}
add_filter('script_loader_tag', 'theme_defer_scripts', 10, 3);
// Remove jQuery if not needed
function theme_remove_jquery() {
if (!is_admin()) {
wp_deregister_script('jquery');
wp_deregister_script('jquery-migrate');
}
}
add_action('wp_enqueue_scripts', 'theme_remove_jquery');// Preload fonts
function theme_preload_fonts() {
$fonts = [
'/assets/fonts/inter-var.woff2',
'/assets/fonts/playfair-display.woff2'
];
foreach ($fonts as $font) {
echo '<link rel="preload" href="' . get_theme_file_uri($font) . '" as="font" type="font/woff2" crossorigin>';
}
}
add_action('wp_head', 'theme_preload_fonts', 1);/* Use font-display: swap */
@font-face {
font-family: 'Inter';
src: url('fonts/inter-var.woff2') format('woff2');
font-weight: 100 900;
font-display: swap;
}// Preload fonts
function theme_preload_fonts() {
$fonts = [
'/assets/fonts/inter-var.woff2',
'/assets/fonts/playfair-display.woff2'
];
foreach ($fonts as $font) {
echo '<link rel="preload" href="' . get_theme_file_uri($font) . '" as="font" type="font/woff2" crossorigin>';
}
}
add_action('wp_head', 'theme_preload_fonts', 1);/* Use font-display: swap */
@font-face {
font-family: 'Inter';
src: url('fonts/inter-var.woff2') format('woff2');
font-weight: 100 900;
font-display: swap;
}-- Delete old revisions (keep last 5)
DELETE FROM wp_posts WHERE post_type = 'revision'
AND ID NOT IN (
SELECT * FROM (
SELECT ID FROM wp_posts WHERE post_type = 'revision'
ORDER BY post_date DESC LIMIT 5
) AS t
);
-- Delete expired transients
DELETE FROM wp_options WHERE option_name LIKE '%_transient_%'
AND option_value < UNIX_TIMESTAMP();
-- Delete orphaned postmeta
DELETE pm FROM wp_postmeta pm
LEFT JOIN wp_posts p ON pm.post_id = p.ID
WHERE p.ID IS NULL;
-- Optimize tables
OPTIMIZE TABLE wp_posts, wp_postmeta, wp_options, wp_comments, wp_commentmeta;-- Delete old revisions (keep last 5)
DELETE FROM wp_posts WHERE post_type = 'revision'
AND ID NOT IN (
SELECT * FROM (
SELECT ID FROM wp_posts WHERE post_type = 'revision'
ORDER BY post_date DESC LIMIT 5
) AS t
);
-- Delete expired transients
DELETE FROM wp_options WHERE option_name LIKE '%_transient_%'
AND option_value < UNIX_TIMESTAMP();
-- Delete orphaned postmeta
DELETE pm FROM wp_postmeta pm
LEFT JOIN wp_posts p ON pm.post_id = p.ID
WHERE p.ID IS NULL;
-- Optimize tables
OPTIMIZE TABLE wp_posts, wp_postmeta, wp_options, wp_comments, wp_commentmeta;undefinedundefinedundefinedundefined// wp-config.php
define('WP_POST_REVISIONS', 5);
// Or disable completely
define('WP_POST_REVISIONS', false);// wp-config.php
define('WP_POST_REVISIONS', 5);
// Or disable completely
define('WP_POST_REVISIONS', false);| Setting | Value |
|---|---|
| SSL/TLS | Full (Strict) |
| Always Use HTTPS | On |
| Auto Minify | CSS, JS (test first) |
| Brotli | On |
| Browser Cache TTL | 4 hours to 1 year |
| Rocket Loader | Off (conflicts with GSAP) |
| Mirage | On (mobile image optimization) |
| Polish | Lossy (image optimization) |
| WebP | On |
| 设置项 | 取值 |
|---|---|
| SSL/TLS | 完全(严格) |
| 始终使用HTTPS | 开启 |
| 自动压缩 | CSS、JS(先测试) |
| Brotli压缩 | 开启 |
| 浏览器缓存TTL | 4小时至1年 |
| Rocket Loader | 关闭(与GSAP冲突) |
| Mirage | 开启(移动端图片优化) |
| Polish | 有损压缩(图片优化) |
| WebP | 开启 |
undefinedundefinedundefinedundefinedundefined#!/usr/bin/env python3
"""
Speed test automation using PageSpeed Insights API
"""
import requests
import json
def test_pagespeed(url, api_key=None):
endpoint = 'https://www.googleapis.com/pagespeedonline/v5/runPagespeed'
params = {
'url': url,
'strategy': 'mobile',
'category': ['performance', 'accessibility', 'best-practices', 'seo']
}
if api_key:
params['key'] = api_key
response = requests.get(endpoint, params=params)
data = response.json()
lighthouse = data['lighthouseResult']
categories = lighthouse['categories']
return {
'performance': int(categories['performance']['score'] * 100),
'accessibility': int(categories['accessibility']['score'] * 100),
'best_practices': int(categories['best-practices']['score'] * 100),
'seo': int(categories['seo']['score'] * 100),
'lcp': lighthouse['audits']['largest-contentful-paint']['displayValue'],
'cls': lighthouse['audits']['cumulative-layout-shift']['displayValue'],
'fcp': lighthouse['audits']['first-contentful-paint']['displayValue']
}
if __name__ == '__main__':
result = test_pagespeed('https://example.com')
print(json.dumps(result, indent=2))#!/usr/bin/env python3
"""
Speed test automation using PageSpeed Insights API
"""
import requests
import json
def test_pagespeed(url, api_key=None):
endpoint = 'https://www.googleapis.com/pagespeedonline/v5/runPagespeed'
params = {
'url': url,
'strategy': 'mobile',
'category': ['performance', 'accessibility', 'best-practices', 'seo']
}
if api_key:
params['key'] = api_key
response = requests.get(endpoint, params=params)
data = response.json()
lighthouse = data['lighthouseResult']
categories = lighthouse['categories']
return {
'performance': int(categories['performance']['score'] * 100),
'accessibility': int(categories['accessibility']['score'] * 100),
'best_practices': int(categories['best-practices']['score'] * 100),
'seo': int(categories['seo']['score'] * 100),
'lcp': lighthouse['audits']['largest-contentful-paint']['displayValue'],
'cls': lighthouse['audits']['cumulative-layout-shift']['displayValue'],
'fcp': lighthouse['audits']['first-contentful-paint']['displayValue']
}
if __name__ == '__main__':
result = test_pagespeed('https://example.com')
print(json.dumps(result, indent=2))