Jak przyspieszyć WordPress wykorzystując buforowanie przeglądarki przez .htaccess?

Opublikowany: 2017-08-04

Przyspiesz WordPress wykorzystując buforowanie przeglądarki przez .htaccess

Wykorzystaj buforowanie przeglądarki, aby przyspieszyć działanie swoich stron internetowych. Jeśli możesz wykorzystać buforowanie przeglądarki , możesz znacznie zwiększyć szybkość witryny. Ponieważ Google zaczyna rozważać szybkość witryny jako parametr SEO, webmasterzy mogą wykorzystać pamięć podręczną przeglądarki, aby poprawić szybkość witryny i uzyskać lepsze pozycje w wyszukiwarkach.

Oto kompletny plik .htaccess , który mamy w folderze głównym Crunchify.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
######### CRUNCHIFY SETTING - START  ##########
Options All - Indexes
 
# Disable ETags
< IfModule mod_headers . c >
Header unset ETag
     Header set Connection keep - alive
< / IfModule >
FileETag None
 
############## MaxCDN Fix #############
< IfModule mod_headers . c >
   < FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$" >
     Header set Access - Control - Allow - Origin "*"
   < / FilesMatch >
< / IfModule >
 
########### REDIRECT TRAFFIC TO HTTPS ############
# RewriteEngine On
# RewriteCond %{HTTPS} off
# RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
 
############ SECURITY ###########
< FilesMatch "\.(md|exe|sh|bak|inc|pot|po|mo|log|sql)$" >
Order allow , deny
Deny from all
< / FilesMatch >
 
< Files robots . txt >
Allow from all
< / Files >
 
############## CACHING-GZIP ############
< IfModule mod_expires . c >
ExpiresActive On
ExpiresDefault A2592000
 
< FilesMatch "\.(txt|xml|js)$" >
ExpiresDefault A2592000
< / FilesMatch >
 
< FilesMatch "\.(css)$" >
ExpiresDefault A2592000
< / FilesMatch >
 
< FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav|mp4|m4v|ogg|webm|aac)$" >
ExpiresDefault A2592000
< / FilesMatch >
 
< FilesMatch "\.(jpg|jpeg|png|gif|swf|webp)$" >
ExpiresDefault A2592000
< / FilesMatch >
< / IfModule >
 
< IfModule mod_headers . c >
   < FilesMatch "\.(txt|xml|js)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
 
   < FilesMatch "\.(css)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
 
   < FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav|mp4|m4v|ogg|webm|aac)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
 
   < FilesMatch "\.(jpg|jpeg|png|gif|swf|webp)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
< / IfModule >
 
< IfModule mod_deflate . c >
     < IfModule mod_setenvif . c >
         < IfModule mod_headers . c >
             SetEnvIfNoCase ^ ( Accept - EncodXng | X - cept - Encoding | X { 15 } | ~ { 15 } | - { 15 } ) $ ^ ( ( gzip | deflate ) \ s* , ? \ s* ) + | [ X ~ - ] { 4 , 13 } $ HAVE_Accept - Encoding
             RequestHeader append Accept - Encoding "gzip,deflate" env = HAVE_Accept - Encoding
         < / IfModule >
     < / IfModule >
     < IfModule mod_filter . c >
         AddOutputFilterByType DEFLATE "application/atom+xml" \
                                       "application/javascript" \
                                       "application/json" \
                                       "application/ld+json" \
                                       "application/manifest+json" \
                                       "application/rdf+xml" \
                                       "application/rss+xml" \
                                       "application/schema+json" \
                                       "application/vnd.geo+json" \
                                       "application/vnd.ms-fontobject" \
                                       "application/x-font-ttf" \
                                       "application/x-javascript" \
                                       "application/x-web-app-manifest+json" \
                                       "application/xhtml+xml" \
                                       "application/xml" \
                                       "font/eot" \
                                       "font/opentype" \
                                       "image/bmp" \
                                       "image/svg+xml" \
                                       "image/vnd.microsoft.icon" \
                                       "image/x-icon" \
                                       "text/cache-manifest" \
                                       "text/css" \
                                       "text/html" \
                                       "text/javascript" \
                                       "text/plain" \
                                       "text/vcard" \
                                       "text/vnd.rim.location.xloc" \
                                       "text/vtt" \
                                       "text/x-component" \
                                       "text/x-cross-domain-policy" \
                                       "text/xml"
 
     < / IfModule >
     < IfModule mod_mime . c >
         AddEncoding gzip               svgz
     < / IfModule >
 
< / IfModule >
######### CRUNCHIFY SETTING END ############
 
# BEGIN WordPress
< IfModule mod_rewrite . c >
RewriteEngine On
RewriteBase /
RewriteRule ^ index \ . php $ - [ L ]
RewriteCond % { REQUEST_FILENAME } ! - f
RewriteCond % { REQUEST_FILENAME } ! - d
RewriteRule . / index . php [ L ]
< / IfModule >
 
# END WordPress

UWAGA : Usuń blokadę przekierowania do HTTPS, jeśli nie korzystasz z HTTPS :). Jednak już to skomentowałem. Jeśli włączyłeś HTTPS już na stronie i nadal pozwalasz użytkownikom odwiedzać witrynę przez HTTP, to jesteś dobry.

Rozumiemy każdą sekcję pliku .htaccess:

Krok-1 Pozbywanie się ETag

Przede wszystkim musimy disable ETag header ponieważ zamierzamy używać czasu wygaśnięcia. Technologia ETag jest znana jako powolna i problematyczna – narzekają na nią nawet inne najlepsze witryny.

Dodaj do .htaccess : (znajduje się w katalogu głównym bloga)

.htaccess
1
2
3
4
5
6
# Disable ETags
< IfModule mod_headers . c >
Header unset ETag
         Header set Connection keep - alive
< / IfModule >
FileETag None

Utrzymujemy również połączenie keep-alive . Nazywa się to persistent connection . Jeśli nowe połączenie musi być otwarte dla każdego żądania lub pliku, może to zająć znacznie więcej czasu.

Inni muszą przeczytać:

  • 5 przydatnych sztuczek, aby przyspieszyć WordPress i zwiększyć wydajność
  • 9 podstawowych zasobów WordPressa, które mogłeś przegapić

Krok 2 Włącz buforowanie przeglądarki

Jeśli ustawisz datę wygaśnięcia lub maksymalny wiek w nagłówkach HTTP dla zasobów statycznych, nowoczesne przeglądarki będą ładować wcześniej pobrane zasoby statyczne, takie jak obrazy, css, javascript, pdf, swf itp. z dysków lokalnych, a nie przez sieć.

Jeśli więc skonfigurujesz swój serwer sieciowy, aby ustawić nagłówki pamięci podręcznej i zastosować je do wszystkich zasobów statycznych, które można przechowywać w pamięci podręcznej, Twoja witryna będzie się ładować znacznie szybciej. Dodaj poniżej do .htaccess

.htaccess file
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
< IfModule mod_expires . c >
ExpiresActive On
ExpiresDefault A2592000
 
< FilesMatch "\.(txt|xml|js)$" >
ExpiresDefault A2592000
< / FilesMatch >
 
< FilesMatch "\.(css)$" >
ExpiresDefault A2592000
< / FilesMatch >
 
< FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav|mp4|m4v|ogg|webm|aac)$" >
ExpiresDefault A2592000
< / FilesMatch >
 
< FilesMatch "\.(jpg|jpeg|png|gif|swf|webp)$" >
ExpiresDefault A2592000
< / FilesMatch >
< / IfModule >
 
< IfModule mod_headers . c >
   < FilesMatch "\.(txt|xml|js)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
 
   < FilesMatch "\.(css)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
 
   < FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav|mp4|m4v|ogg|webm|aac)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
 
   < FilesMatch "\.(jpg|jpeg|png|gif|swf|webp)$" >
   Header set Cache - Control "max-age=2592000"
   < / FilesMatch >
< / IfModule >

To, co robi, to dodawanie nagłówka wygasających w przyszłości (upewnij się, że mod_expires jest załadowany w konfiguracji Apache, jeśli masz problemy) do zawartości statycznej (obrazy, js, css itp.).

Dwie rzeczy tutaj:

  • ExpiresDefault A2592000 = 1 miesiąc w przyszłości
  • Kontrola pamięci podręcznej „maks. wiek=2592000” = 1 miesiąc

Jeśli chcesz, możesz również ustawić wartość na 1 rok = 31536000

Krok 3 Dodaj gzip i opróżnij nagłówki kompresji

Kompresja zawsze kończy się zmniejszeniem ich rozmiaru i szybszym ładowaniem, więc zaimplementowanie jakiejś formy kompresji na komponentach jest koniecznością.

Ten krok optymalizacji może nie zadziałać, jeśli Twój serwer nie ma zainstalowanego mod_deflate ani mod_gzip jako części Apache.

Zasadniczo kompresujemy większość zasobów, więc te obciążenia mają mniejszą przepustowość i są bardzo szybkie.

mod_gzip setting in .htaccess
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
< IfModule mod_deflate . c >
     < IfModule mod_setenvif . c >
         < IfModule mod_headers . c >
             SetEnvIfNoCase ^ ( Accept - EncodXng | X - cept - Encoding | X { 15 } | ~ { 15 } | - { 15 } ) $ ^ ( ( gzip | deflate ) \ s* , ? \ s* ) + | [ X ~ - ] { 4 , 13 } $ HAVE_Accept - Encoding
             RequestHeader append Accept - Encoding "gzip,deflate" env = HAVE_Accept - Encoding
         < / IfModule >
     < / IfModule >
     < IfModule mod_filter . c >
         AddOutputFilterByType DEFLATE "application/atom+xml" \
                                       "application/javascript" \
                                       "application/json" \
                                       "application/ld+json" \
                                       "application/manifest+json" \
                                       "application/rdf+xml" \
                                       "application/rss+xml" \
                                       "application/schema+json" \
                                       "application/vnd.geo+json" \
                                       "application/vnd.ms-fontobject" \
                                       "application/x-font-ttf" \
                                       "application/x-javascript" \
                                       "application/x-web-app-manifest+json" \
                                       "application/xhtml+xml" \
                                       "application/xml" \
                                       "font/eot" \
                                       "font/opentype" \
                                       "image/bmp" \
                                       "image/svg+xml" \
                                       "image/vnd.microsoft.icon" \
                                       "image/x-icon" \
                                       "text/cache-manifest" \
                                       "text/css" \
                                       "text/html" \
                                       "text/javascript" \
                                       "text/plain" \
                                       "text/vcard" \
                                       "text/vnd.rim.location.xloc" \
                                       "text/vtt" \
                                       "text/x-component" \
                                       "text/x-cross-domain-policy" \
                                       "text/xml"
 
     < / IfModule >
     < IfModule mod_mime . c >
         AddEncoding gzip               svgz
     < / IfModule >
 
< / IfModule >

Krok 4 Sprawdź, czy ustawienia działają poprawnie

Zamówienie poniżej zrzutu ekranu. Powinieneś zobaczyć wszystkie parametry ustawione w nagłówku odpowiedzi twojego pliku.

Nagłówek maksymalnego wieku i wygaśnięcia pamięci podręcznej dla zasobów WordPress

Sprawdź zasady htaccess dla procesu przyspieszania WordPressa

Pytanie otwarte: Czy mogę zmienić datę ważności niektórych zasobów, takich jak skrypt Google Adsense lub skrypt Google Analytics?

  • https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js
  • https://www.google-analytics.com/analytics.js

Answer is NO . Możesz ustawić tylko wartość wygaśnięcia zasobów, które ładują się z Twojej witryny.