Sposoby optymalizacji szybkości ładowania witryny na WordPress

1. 1. Przenoszenie treści statycznych z niezależnymi plikami cookie domeny na użytkowników.
2. 2. Ustaw czas buforowania dla zawartości statycznej.
3. 3. Zoptymalizuj bazę danych witryny WordPress
4. 4. Użyj specjalnych wtyczek do buforowania plików multimedialnych.
5. 5. Użyj CDN
6. 6. Kompresuj i łącz wszystkie pliki stylów JS i CSS w WordPress
7. 7. Kompresuj pliki obrazów, optymalizuj zdjęcia w witrynie WordPress
8. 8. Kompresja statycznej zawartości WordPress w GZIP
9. 9. Wyłączanie ETagów w WordPressie

Kiedy trzeba dodać nowy materiał lub wprowadzić zmiany w kodzie witryny WordPress, można to zrobić w prosty sposób w porównaniu z innymi systemami zarządzania treścią. Najgorsze z nich, może Drupal, i gorsze niż tylko kodowanie Bitrix.
Jednak pomimo faktu, że kod WordPress jest napisany starannie od podstaw, aby działać szybciej, nie oznacza to, że jest on zoptymalizowany dla twojego serwera natychmiast po instalacji. Pamiętaj, że jeśli nie zmienisz kilku kluczowych parametrów na początku swojego bloga lub witryny po instalacji, możesz skomplikować proces indeksowania, a szybkość otwierania stron witryny będzie mniejsza niż to możliwe. W rezultacie są to niezadowoleni użytkownicy końcowi. Ja i zespół programistów naprawdę chcemy pomóc Ci uniknąć tych negatywnych konsekwencji, dlatego przygotowaliśmy dla Ciebie kilka najlepszych sposobów, dzięki którym możesz znacząco zwiększyć szybkość swojego serwera WordPress.

1. Przenoszenie treści statycznych z niezależnymi plikami cookie domeny na użytkowników.

Około 80 do 90% czasu spędzanego przez użytkowników na pobieraniu statycznej zawartości z bloga WordPress. Oznacza to, że dużo więcej czasu poświęcamy na załadowanie strony niż na jej przeglądanie i czytanie, użytkownicy czekają na pobranie takich elementów internetowych, jak obrazy, arkusze stylów, skrypty, Flash itp. Możesz zoptymalizować tę zawartość, szybciej ją ładować, do tego możesz użyć darmowej subdomeny, która nie wysyła plików cookie, ale dystrybuuje tylko statyczne pliki WordPress, aby przyspieszyć ładowanie zawartości witryny. Działania te pomagają zredukować kilka mikrosekund czasu pobierania, co może nie wydawać się aż tak duże, ale gdy na stronie jest dużo treści i użytkowników, daje to namacalny efekt.
Ponadto implementacja w WordPress jest bardzo łatwa, wystarczy dodać dwie linie do kodu pliku WP-config.php:

define („WP_CONTENT_URL”, „http://static.mydomain.com”); zdefiniuj („COOKIE_DOMAIN”, „www.mydomain.com”);

Po wykonaniu tej czynności prześlij swoją zawartość statyczną do subdomeny. Wszystko jest gotowe! przejdź do drugiej metody.

2. Ustaw czas buforowania dla zawartości statycznej.

Pliki statyczne są zwykle rzadko aktualizowane, dlatego nie jest konieczne, aby za każdym razem, gdy użytkownik loguje się do witryny w celu nadania statycznej zawartości, lepiej było ją przechowywać po stronie użytkownika, w tym przypadku szybkość przeglądania stron witryny wzrasta kilka razy. Wadą tej metody jest fakt, że jeśli użytkownik po raz pierwszy trafił na twoją stronę, a pliki statyczne ważą dość dużo, załadowanie go zajęłoby dużo czasu, a do rozwiązania tego problemu najczęściej używana jest metoda opóźnionego ładowania.
Aby ustawić czas buforowania dla zawartości statycznej, otwórz plik .htaccess swojej witryny do edycji. Dodaj poniższy kod, który ustawia czas przechowywania plików statycznych w pamięci podręcznej przeglądarki po stronie klienta (odwiedzający witrynę). Po wygaśnięciu pamięci podręcznej zostanie ona automatycznie usunięta na komputerze użytkownika. Zobacz kod:

<IfModule mod_expires.c> ExpiresActive on # Być może lepiej, aby biała lista wygasła? Być może. ExpiresDefault "access plus 1 month" # cache.appcache wymaga ponownego żądania # w FF 3.6 (thx Remy ~ Wprowadzenie HTML5) ExpiresByType text / cache-manifest "dostęp plus 0 sekund" # Twój dokument html ExpiresByType tekst / html "dostęp plus 0 sekundy „# ExportsByType tekst / xml” dostęp plus 0 sekund „ExpiresByType application / xml” dostęp plus 0 sekund „ExpiresByType aplikacja / json” dostęp plus 0 sekund ”# kanał RSS ExpiresByType aplikacja / rss + xml„ dostęp plus 1 godzina ”# Favicon (nie można zmienić nazwy) ExpiresByType image / x-icon "access plus 1 tydzień" # Media: obrazy, wideo, audio ExpiresByType image / gif "dostęp plus 1 miesiąc" ExpiresByType image / png "dostęp plus 1 miesiąc" ExpiresByType image / jpg „dostęp plus 1 miesiąc” ExpiresByType image / jpeg ”dostęp plus 1 miesiąc„ ExpiresByType wideo / ogg ”dostęp plus 1 miesiąc„ ExpiresByType audio / ogg ”dostęp plus 1 miesiąc„ ExpiresByType wideo / mp4 ”dostęp plus 1 miesiąc” ExpiresByType wideo / webm „access plus 1 month” # Pliki HTC (css3pie) ExpiresByType text / x-component „dostęp plus 1 miesiąc” # Webfonts ExpiresByType czcionka / truetype ”dostęp plus 1 miesiąc„ ExpiresByType font / opentype ”dostęp plus 1 miesiąc„ ExpiresByType aplikacja / x-font-woff ”dostęp plus 1 miesiąc„ ExpiresByType image / svg + xml ”dostęp plus 1 miesiąc dostęp „ExpiresByType application / vnd.ms-fontobject” plus 1 miesiąc „Dostęp # # CSS i JavaScript ExpiresByType / css” plus 1 rok dostępu „ExpiresByType application / javascript” plus 1 rok dostępu „ExpiresByType text / javascript” plus 1 rok "<IfModule mod_headers.c> Header append Cache-Control" public "</ IfModule> </ IfModule>

Jak widać z kodu, część plików, niektóre z ich typów, umożliwiają dostęp do pamięci podręcznej plus 1 tydzień na 1 tydzień, dostęp do innych osób oraz 1 miesiąc na jeden miesiąc, dostęp do innych osób i 1 rok na 1 rok. Tam, gdzie nie potrzebujemy buforowania, zwykłego tekstu lub bloku często aktualizowanego materiału, takiego jak prognoza pogody na godzinę, ustawiamy pamięć podręczną na dostęp 0 sekund plus 0 sekund.

3. Zoptymalizuj bazę danych witryny WordPress

Innym świetnym sposobem na przyspieszenie pracy serwera i sprawienie, by witryna WordPress działała bardziej efektywnie, jest optymalizacja bazy danych. Jak można to zrobić w prosty i szybki sposób bez specjalnych umiejętności programistycznych? WordPress sprawia, że ​​jest to niezwykle łatwe dzięki wielu darmowym wtyczkom. Jednym z najlepszych w naszej opinii jest WP-Optimize , wtyczka jest łatwa w instalacji i konfiguracji, a co najważniejsze wykonuje swoje zadania wydajnie i szybko bez błędów.

WP-Optimize

Jako dodatkową metodę możesz użyć panelu kontrolnego hostingu lub phpmyadmin, aby zoptymalizować bazę danych witryny dla WordPress panelu C. W panelu sterowania phpmyadmin wybierz bazę danych swojej witryny, zaznacz tabele, które mają zostać zoptymalizowane i wybierz opcję „optymalizuj tabelę” - to proste rozwiązanie pozwala usunąć wszystkie nieużywane pliki i zoptymalizować zawartość tabel bazy danych.

4. Użyj specjalnych wtyczek do buforowania plików multimedialnych.

Istnieje wiele różnych wtyczek do buforowania stron na WordPressie, ale najlepsze z nich są w naszej opinii: WP Super Cache , Hyper Cache i W3 Total Cache . Buforowanie pozwala zaoszczędzić czas procesora hostingu, zmniejsza liczbę połączeń do bazy danych i szereg innych ważnych zalet. Mechanizm pamięci podręcznej zasadniczo zmienia żądania generowania stron dla silnika w statyczne strony, które łatwo się ładują, oszczędzając czas użytkownika, eliminując potrzebę oczekiwania na generowanie strony po stronie hosta. Gdy użytkownik lub ty sam otworzysz stronę w przeglądarce, wtyczka generuje plik HTML i zapisuje go na serwerze, po wielokrotnym dostępie wtyczka daje użytkownikowi statyczną stronę, oszczędzając czas hostingu na wygenerowanie strony. Zalecamy również użycie bufora DB do buforowania dostępu do bazy danych.

5. Użyj CDN

Aby zaoszczędzić czas ładowania witryny, możesz skorzystać z sieci witryn CDN, które umożliwiają hostowanie zawartości statycznej za darmo lub za niewielką opłatą. Gdy żądana jest strona Twojej witryny, wszystkie statyczne pliki są wysyłane do użytkownika z szybkich serwerów, a ponieważ przeglądarka może utworzyć tylko 2 połączenia z 1 serwerem, to jeśli liczba serwerów wynosi 2, witryna załaduje 4 wątki, czyli 2 razy szybciej. Używanie CDN w witrynie WordPress można porównać do technologii chmury, z tym wyjątkiem, że serwery innych firm obsługują tylko pliki statyczne, a nie całą witrynę,
Istnieje kilka darmowych wtyczek, które pozwalają szybko skonfigurować witrynę WordPress do pracy z CDN.
Alternatywne opcje serwera CDN : Amazon S3, Max CDN, Media Temple CDN i Free CDN.

6. Kompresuj i łącz wszystkie pliki stylów JS i CSS w WordPress

Kompresja wszystkich plików JS i CSS jest bardzo przydatną akcją, ponieważ zmniejsza całkowity rozmiar załadowanej strony, co również skraca czas ładowania dla użytkownika. Jeśli jednak chcesz uzyskać większy efekt optymalizacji, zdecydowanie zalecamy łączenie plików JS i CSS w jak największym stopniu. Chodzi o to, że niektóre pliki js mogą kolidować ze sobą, gdy zostaną scalone w jedną z tych samych nazw klas, tak samo może być z plikiem stylu, najlepiej scalone pliki powinny najpierw przejść wizualne i programowe sprawdzenie obecności podobnych nazw operatorów w jednym z edytorów kodu, takich jak NetBeans IDE .
Połączenie kilku plików w jeden może znacznie zmniejszyć liczbę żądań do serwera WWW, co skróci czas ładowania witryny.
Compressors JS : Closure Compiler i Minify JavaScript.
Kompresory CSS : alternatywy CSS to Minify CSS i CSS Compressor.
Ponadto możesz również użyć wtyczki WP Minify , która może łączyć pliki JS i CSS, możesz zarządzać tym procesem bezpośrednio z WordPress. Zalecamy jednak natychmiastowe użycie wtyczki i przetestowanie jej na lokalnym serwerze lub kopii witryny.
Użyj CSS Sprite, aby zmniejszyć liczbę żądań do serwera. jeśli masz dużo wolnego czasu i czujesz szczególny entuzjazm.

7. Kompresuj pliki obrazów, optymalizuj zdjęcia w witrynie WordPress

Kompresowanie obrazów w witrynie WordPress można wykonać na kilka sposobów. Pierwszy z nich znajduje się poza witryną i ma początkowo utworzyć zoptymalizowany obraz w edytorze programów. W tym celu Adobe Photoshop , Adobe Fireworks i kilka innych.
Ale co, jeśli plik obrazu jest już przesłany lub nie jest zoptymalizowany przed przesłaniem na serwer? Drugi sposób polega na zainstalowaniu specjalnej wtyczki WP Smush IT, która pozwala zoptymalizować zarówno przesłane już zdjęcia na stronie, jak i nowo przesłane zdjęcia.
Zmniejszenie rozmiaru zdjęcia na stronie Wordpress pozwala zoptymalizować szybkość pobierania strony, zmniejszając wagę strony, a także czyni ją bardziej dostępną dla szerszego grona użytkowników Internetu, ponieważ mniejszy obraz ładuje się stosunkowo szybciej niż duży plik ze zdjęciem.

8. Kompresja statycznej zawartości WordPress w GZIP

Kolejną wskazówką, aby zwiększyć szybkość ładowania witryny na WordPressie, jest kompresowanie i przenoszenie zawartości witryny na gzip. Praktycznie wszystkie nowoczesne przeglądarki obsługują transfer i rozpakowywanie gzip, jeśli chcesz, to samo archiwum. Przed wysłaniem plików witryny do klienta są one pakowane w archiwum gzip, a następnie przesyłane w postaci skompresowanej do klienta, gdzie przeglądarka rozpakowuje plik, a następnie wyświetla stronę internetową witryny w zwykłej formie.
Możesz pakować tego typu pliki w gzip: CSS, JS i pliki obrazów,
Na szczęście dla witryn WordPress istnieje niezwykle łatwy sposób włączenia gzip, w tym celu otwórz plik Htaccess w celu edycji i dodaj następujący kod:

<IfModule mod_deflate.c> # force deflate dla mangled headers # developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping/ <IfModule mod_setenvif.c> <IfModule mod_headers.c> SetEnvIfNoCase ^ ( Accept-EncodXng | Kodowanie X-cept | X {15} | ~ {15} | - {15}) $ ^ ((gzip | deflate) s * ,? S *) + | [X ~ -] { 4.13} $ HAVE_Accept-Encoding Dołącz RequestHeader dołącz Akcept-Encoding "gzip, deflate" env = HAVE_Accept-Encoding </ IfModule> </ IfModule> # HTML, TXT, CSS, JavaScript, JSON, XML, HTC: <IfModule filter_module> FilterDeclare COMPRESS FilterProvider COMPRESS DEFLATE resp = Content-Type $ text / html FilterProvider COMPRESS DEFLATE resp = Content-Type $ text / css FilterProvider COMPRESS DEFLATE resp = Content-Type $ text / plain FilterProvider COMPRESS DEFLATE resp = Content-Type $ text / xml FilterProvider COMPRESS DEFLATE resp = Content-Type $ text / x-component FilterProvider COMPRESS DEFLATE resp = Content-Type $ application / javascript FilterProvider COMPRESS DEFLATE resp = Content-Type $ application / json FilterProvider COMPRESS DEFLATE resp = Co ntent-type $ application / xml FilterProvider COMPRESS DEFLATE resp = Content-Type $ application / xhtml + xml FilterProvider COMPRESS DEFLATE resp = Content-Type $ application / rss + xml FilterProvider COMPRESS DEFLATE resp = Content-Type $ application / atom + xml FilterProvider COMPRESS DEFLATE resp = Content-Type $ application / vnd.ms-fontobject FilterProvider COMPRESS DEFLATE resp = typ zawartości $ image / svg + xml FilterProvider COMPRESS DEFLATE resp = typ treści $ application / x-font-ttf FilterProvider COMPRESS DEFLATE resp = Content-Type $ font / opentype FilterChain COMPRESS FilterProtocol COMPRESS DEFLATE change = tak; byteranges = no </ IfModule> <IfModule! Mod_filter.c> Aplikacja DEFLATE / javascript AddOutputFilterByType DEFLATE tekst / xml aplikacja / xml tekst / x-komponent AddOutputFilterByType DEFLATE aplikacja / xhtml + aplikacja xml / rss + aplikacja xml / atom + xml AddOutputFilterByType DEFLATE ima ge / svg + xml aplikacja / vnd.ms-fontobject aplikacja / x-font-ttf czcionka / opentype </ IfModule> </ IfModule>

Aby powyższy kod działał, Twój hosting musi obsługiwać lub włączać mod_deflate.c . Zazwyczaj na hostingu ten parametr jest ograniczony ze względu na fakt, że kompresja gzip jest wykonywana po stronie serwera witryny, co prowadzi do zwiększenia obciążenia tego ostatniego. Zobacz także artykuł Optymalizacja strony Wordpress z htaccess .

9. Wyłączanie ETagów w WordPressie

Wyłączenie ETagów to świetny sposób na buforowanie treści w WordPressie. Wyłączając ETag, możesz zmniejszyć rozmiar nagłówków HTTP. Zanim jednak skorzystasz z tej opcji, przeczytaj dokumentację bardziej szczegółowo, ponieważ jeśli na przykład aktywnie korzystasz z odpowiedzi Last-Modified w nagłówkach odpowiedzi serwera, taka odpowiedź stanie się niedostępna. Kod należy dodać do pliku htaccess:

Brak pliku ETag

Są to wszystkie metody optymalizacji szybkości ładowania strony na WordPressie, o czym chcieliśmy dziś rozmawiać, z udanym kodowaniem!