Jak przyspieszyć swoją witrynę WordPress za darmo?

Um, WordPress, nie wiem, jak ci to powiedzieć, ale… JESTEŚ ZA WOLNY!

Korzystam z WordPressa codziennie od ponad 7 lat i uwielbiam go, ale czasami mam wrażenie, że pcham słonia po schodach, próbując szybko załadować strony .

Kto może to winić, naprawdę? WordPress to potężny system zarządzania treścią , ale ładujemy go wtyczkami, obrazami, skryptami, kupujemy tani hosting, a potem zastanawiamy się, dlaczego ładowanie trwa wiecznie .

Ale WordPress, jest nadzieja! Wymyślając niezawodny audyt prędkości, nauczyłem się, jak przyspieszyć działanie WordPressa bez wydawania fortuny na hosting lub wtyczki.

W rzeczywistości wydałem 0 USD , a moja witryna w ciągu prawie 10 sekund przeszła od załadowania do mniej niż 1 sekundy . To 10 razy szybciej , a przed rozpoczęciem korzystałem już z pamięci podręcznej i sieci CDN.

Zanim:

Prawie 10 sekund na pełne załadowanie strony.

Później:

Strona ładuje się teraz w mniej niż 1 sekundę.

Całkiem fajnie, co?!

Chcesz przyspieszyć swoją witrynę WordPress , tak jak ja? Przeprowadzę Cię przez każdy krok, który wykonałem, aby przyspieszyć ładowanie WordPressa .

Nie musisz kupować żadnych wtyczek prędkości WordPress

W przeciwieństwie do wszystkich innych samouczków dotyczących szybkości WordPressa, które znalazłem w Internecie, przeprowadziłem ten eksperyment bez wydawania ani jednego dolara , ponieważ a) chcę, aby wyniki były przydatne dla każdego, kto ma witrynę WordPress, oraz b) jestem tani. Również c) Widziałem witryny WordPress, które wydają mnóstwo na hosting NADAL kończą powoli, więc nie jest to szybko rozwiązany problem „rzucania pieniędzy” do rozwiązania.

Jasne, niektóre z moich sztuczek szybkości można wykonać za pomocą wtyczek premium, takich jak perfmatters i WP Rocket, ale jeśli masz trochę czasu i cierpliwości, możesz osiągnąć te same wyniki za darmo dzięki darmowym wtyczkom i niewielkiej edycji kodu.

Dlaczego szybkość WordPressa ma znaczenie?

Szybkość WordPressa ma znaczenie, ponieważ Twoja witryna będzie używana przez prawdziwych ludzi, a ludzie wolą korzystać z witryn, które szybko się ładują . Prawda?

Szybka witryna WordPress zapewni Ci przewagę konkurencyjną nad innymi, wolniejszymi witrynami, ponieważ ludzie będą chcieli z niej korzystać. Google też może to zauważyć.

O tak, SEO. WordPress to świetny punkt wyjścia dla SEO na każdej stronie internetowej, ale szybkość odgrywa dużą rolę w sukcesie organicznych wyszukiwarek . W projektach, nad którymi pracowałem, poprawa szybkości witryny doprowadziła do zmniejszenia współczynnika odrzuceń i innych wskaźników, które korelują z silniejszymi rankingami.

Od 2018 r. Google używa szybkości strony jako oficjalnego czynnika rankingowego dla wyszukiwań mobilnych, co teraz oznacza wszystkie wyszukiwania, odkąd korzystały z indeksowania mobilnego od 2019 r. Google zacznie również używać swojego testu porównawczego szybkości Core Web Vitals do pozycjonowania witryn w pobliżu przyszły.

Jeśli uważasz, że płacenie za ruch do Twojej witryny z reklam Facebooka lub Google oznacza, że ​​wolno Ci się ładująca witryna ujdzie na sucho, pomyśl jeszcze raz. Płacisz za kliknięcia, które mogą się odbić!

Niezależnie od tego, czy korzystasz z WordPressa, czy innego CMS (systemu zarządzania treścią), nadal powinieneś starać się, aby Twoja witryna była jak najszybsza . Nawet skrócenie czasu ładowania o milisekundy może przynieść ogromne korzyści pod względem ruchu i konwersji, zwłaszcza na urządzeniach mobilnych.

Podsumowując, oto zalety szybszej witryny WordPress :

• lepszy UX (user experience)
• niższy współczynnik odrzuceń
• SEO (optymalizacja pod kątem wyszukiwarek)
• zoptymalizowany pod kątem wyszukiwania mobilnego i głosowego
• oszczędzaj czas za każdym razem, gdy korzystasz z panelu administracyjnego, aby aktualizować swoją witrynę!

Jak wykonać test prędkości WordPress

Zanim zaczniesz kupować wtyczki z szybką poprawką, musisz zajrzeć pod maskę swojej witryny WordPress, aby dowiedzieć się, co sprawia, że ​​jest ona tak wolna, i przeprowadzić audyt szybkości witryny .

W przeszłości korzystałem z narzędzi takich jak Google Page Speed ​​Insights i Pingdom do testowania szybkości moich witryn WordPress. Chociaż te narzędzia są w porządku, jeśli chodzi o podstawowy przegląd skuteczności Twojej witryny, to aby uzyskać bardziej przydatne informacje, będziemy potrzebować większej łodzi. Lub przynajmniej WebPageTest.

Z jakiegoś dziwnego powodu większość ludzi używa swojej strony głównej do testowania szybkości swojej witryny. Jeśli Twoja strona główna nie jest Twoją główną stroną docelową, nie przejmuj się. Zalecam przeprowadzenie testu na najważniejszych typach stron (dla mnie post na blogu), aby uzyskać reprezentatywne wyniki.

Jak używać WebPageTest do testowania wydajności WordPressa?

WebPageTest umożliwia wybranie kilku zmiennych przed uruchomieniem testu. Standardowa konfiguracja testów zaawansowanych jest odpowiednia dla większości witryn, ale zmieniam lokalizację testową na Nowy Jork, a przeglądarkę na Chrome, aby lepiej dostosować się do moich użytkowników (sprawdź Google Analytics, aby znaleźć urządzenia/lokalizacje użytkowników).

Bądź cierpliwy – test zajmie kilka minut. Czas na kawę lub sprawdź pocztę!

Przeprowadziłem test na długim poście na blogu z dużą ilością zdjęć (post na temat SEO kryptowalut).

Standardowo WebPageTest uruchomi 3 różne testy wczytywania Twojej strony, jeden po drugim. Skupiam się na teście First Run, ponieważ pokazuje on, jak strona działa dla nowych użytkowników (większość moich odbiorców). Kolejne uruchomienia pokażą, jak działa Twoja strona, gdy przeglądarka już ją odwiedziła – dobrze jest sprawdzić, jak dobrze przeglądarki buforują Twoje zasoby i ważne, jeśli Twoja witryna ma dużo odsłon na odwiedzającego (szczególnie w przypadku e-commerce).

Oto tabela danych prędkości, którą zobaczysz po zakończeniu testu:

Interesuje nas kilka kluczowych wskaźników szybkości witryny:

Czas ładowania — całkowity czas potrzebny do pełnego załadowania strony do stanu Zakończony dokument .

Mój czas wczytywania to 9,933 sekundy – inaczej znany jako naprawdę cholernie wolny. Zalecane jest poniżej 2,5 sekundy.

Pierwszy bajt – znany również jako TTFB (Time to First Byte), czas potrzebny do przesłania pierwszego bajtu danych.

Mój TTFB to 3,371 sekundy. To jest naprawdę bardzo powolne. Powinno to być mniej niż 500 ms (pół sekundy), ale Google zaleca 200 ms jako idealne. Jezu.

Bajty w — gdy strona jest w pełni załadowana/dokument jest kompletny, „Bajty w” to całkowity rozmiar strony internetowej.

Mój wpis na blogu miał 2532 KB, czyli około 2,5 MB na etapie tworzenia dokumentu. To dość duże, chciałbym mieć mniej niż 1 MB.

Requests – całkowita liczba żądań http(s). Żądania ukończenia dokumentu to liczba żądań potrzebnych do pełnego załadowania całej zawartości strony internetowej, a żądania w pełni załadowane to łączna liczba żądań, zarówno z Twojej domeny, jak i stron trzecich (takich jak skrypty Google Analytics).

Moja strona wykonała 47 żądań i 232 przy pełnym załadowaniu. Nic dziwnego, że jest powolny! Im mniejsza liczba żądań (ogólnie), tym szybciej strona się załaduje.

Klikając zakładkę „Domeny”, zobaczysz więcej statystyk:

Podział treści według domeny — liczba żądań i bajtów z każdej domeny.

Widać, że większość żądań pochodziła z Google Analytics, a około 0,5 MB danych pochodziło z zewnętrznych skryptów.

Kliknij kartę „Podział treści”, aby zobaczyć więcej:

Podział treści według typu – liczba żądań bajtów z każdego typu MIME ( Multipurpose Internet Mail Extensions ).

Moja strona jest bardzo obrazowa – obrazy składają się na 158 żądań i mają rozmiar 2,5 MB. Ale jest też mnóstwo javy. To mówi mi, że zmniejszenie rozmiaru/ładowania obrazów i łączenie/usuwanie kodu JavaScript pomoże stronie ładować się szybciej.

W zakładce „Podsumowanie” można znaleźć Widok Wodospadu – najważniejszą część audytu prędkości .

Widok wodospadu – pokazuje kolejność żądań na stronie oraz czas ich wczytywania.

Każdy element w widoku wodospadu reprezentuje żądanie. Kolor każdego paska określa typ MIME (obraz, javascript itp.), a długość paska wskazuje, ile czasu zajęło wczytanie . Wyświetlany jest również czas ładowania w milisekundach.

Ciągła niebieska pionowa linia reprezentuje etap „Dokument ukończony” – czas, w którym zawartość strony jest w pełni załadowana, ale dodatkowe skrypty (takie jak analityka) mogą nadal ładować się w tle.

Skoncentruj się na żądaniach, które pojawiają się przed niebieską linią – skrócenie czasu ładowania tych żądań przyspieszy korzystanie ze strony. Kliknij dowolne żądanie, aby wyświetlić więcej szczegółów. Zacznij od żądań, które ładują się przed niebieską linią i zajmują dużo czasu (najszersze słupki). Szczegółowy widok poinformuje Cię, skąd pochodzi żądanie.

Teraz masz wszystkie dane o tym, jak ładuje się Twoja witryna, czas zagłębić się w szczegóły i zacząć wprowadzać zmiany w WordPressie, aby przyspieszyć działanie.

Mit o zbyt wielu wtyczkach

Jeśli przeczytałeś którykolwiek z tych postów na temat „jak przyspieszyć WordPress”, będziesz wiedział, że ludzie mówią, że posiadanie zbyt wielu wtyczek spowolni działanie Twojej witryny WordPress i musisz usunąć wtyczki, aby ponownie przyspieszyć .

To po prostu źle.

Wtyczki nie zawsze spowalniają działanie witryny WordPress. Witryna z 1 wtyczką nie zawsze będzie szybsza niż witryna z 25 wtyczkami. Zwiększyłem liczbę wtyczek na tej stronie i przyspieszyłem ją 10 razy.

Wtyczki (i motywy), które są słabo zakodowane lub wykorzystują dużo mocy serwera lub zapytań MySQL, mogą spowolnić działanie Twojej witryny WordPress, dlatego przeprowadzenie dokładnego testu szybkości witryny za pomocą WebPageTest poinformuje Cię, czy jakiekolwiek wtyczki Cię obciążają.

Wtyczki, których należy unikać

Istnieje kilka popularnych wtyczek, o których wiadomo, że spowalniają witryny WordPress (zwłaszcza jeśli korzystasz z taniego hostingu współdzielonego). Do obejrzenia są powiązane wtyczki do postów, wtyczki do statystyk postów i wtyczki do tworzenia kopii zapasowych na stronie. Wtyczki, które muszą stale skanować Twoją witrynę, takie jak Broken Link Checker, są również powszechnie potępiane.

Możesz wyciągnąć lekcję od zoptymalizowanych hostów WordPress – jeśli wprost zakazują wtyczek z powodu ich negatywnego wpływu na wydajność witryny, prawdopodobnie nie chcesz ich używać samodzielnie.

Oto lista wszystkich zabronionych wtyczek od głównych hostów internetowych: WP Engine, Kinsta i Hostgator.

Jeśli masz spowalniające Cię wtyczki, możesz być w stanie przełączyć się na inną wtyczkę, aby osiągnąć ten sam wynik, lub skorzystać z usługi innej firmy, aby ją zastąpić. Na przykład, zamiast używać wtyczki Broken Link Checker, możesz przeskanować swoją witrynę w poszukiwaniu uszkodzonych linków za pomocą Screaming Frog.

Szybkie wygrane: usuń wtyczki i skrypty, których nie potrzebujesz

Najłatwiejszą, najtańszą i najszybszą rzeczą, jaką każdy może zrobić, aby przyspieszyć działanie dowolnej witryny WordPress, jest usunięcie wtyczek i skryptów, które dodają wiele bajtów lub żądań do strony.

Z mojego audytu prędkości powyżej mogłem zauważyć, że wtyczka komentarzy Disqus znacznie wydłuża czas ładowania mojej strony .

Przetestuj wpływ swoich wtyczek, wyłączając je, a następnie ponownie testując czas ładowania witryny, rozmiar w bajtach i liczbę żądań.

Oto wpływ Disqus na moją witrynę:

Przed (przy użyciu Disqus):

Po usunięciu wtyczki Disqus:

Widać, że usuwając Disqus, skróciłem czas ładowania strony o 2 sekundy oraz zmniejszyłem liczbę i rozmiar żądań.

Skrypty mogą również spowalniać WordPressa , na przykład skrypty Google Analytics i skrypty Google Fonts. Możesz zobaczyć, które skrypty są ładowane w Twojej witrynie WordPress w widoku wodospadu na WebPageTest.

Czcionki Google są ładowane na początku, przed etapem ukończenia dokumentu, więc usunięcie ich pomoże przyspieszyć działanie witryny. Obecnie używam Montserrat (czcionki Google), ale z widoku Wodospadu zobaczyłem, że moja strona ładuje również skrypt dla Lory, którego już nie używam. Usunięcie niepotrzebnego skryptu Google Font skróci czas ładowania mojej strony o 330 ms. Liczy się każdy drobiazg!

Jak zoptymalizować rozmiar obrazu i metody ładowania

W przypadku większości witryn WordPress obrazy będą jednymi z największych plików, które należy załadować na każdej stronie.

Jest kilka rzeczy, które musisz zrobić, aby zoptymalizować obrazy na WordPressie, aby ładowały się tak szybko, jak to możliwe:

1. Skompresuj obrazy, aby były jak najmniejsze (w bajtach)

Im mniejszy obrazek (w bajtach), tym szybciej się ładuje. Jeśli przesyłasz obrazy do WordPress, zmień ich rozmiar przed przesłaniem, aby nie były większe niż potrzebujesz. Konwertuj obrazy PNG na JPEG, aby uzyskać lepszą kompresję.

Jeśli masz istniejącą bibliotekę obrazów, użyj wtyczki graficznej, takiej jak Smush (bezpłatnie), aby skompresować istniejące i nowe obrazy po przesłaniu. Używam Smush od lat, więc moje obrazy są już dość małe – dla mnie niewiele miejsca na ulepszenia, ale warto to zrobić, jeśli jeszcze nie jesteś.

Ostatnio przerzuciłem się na używanie ShortPixel do kompresji obrazów i serwowania ich w formacie WebP. Pliki WebP są o 25-34% mniejsze niż porównywalne obrazy JPEG i są zalecane przez Google. Oto samouczek dotyczący korzystania z obrazów WebP z WordPress.

ShortPixel daje Ci 100 kredytów na obrazy za darmo każdego miesiąca, które wystarczą na początek większości małych stron internetowych. Jeśli masz dużą bibliotekę obrazów lub przesyłasz dużo treści, możesz kupić tanie dodatkowe kredyty na obrazy. Wtyczka ShortPixel WordPress pomoże Ci to wszystko skonfigurować.

2. Lazy ładuje obrazy na długich stronach

Lazy loading to proces odraczania ładowania obrazu do momentu przewinięcia strony w dół.

Na przykład mój wpis na blogu Cryptocurrency SEO zawiera 23 obrazy. Te obrazy mają łączny rozmiar 2,5 MB. To długa strona (ponad 3000 słów), więc dotarcie do obrazów znajdujących się w dalszej części strony zajmuje czytelnikowi trochę czasu. Ale co najważniejsze, użytkownik musi poczekać na załadowanie wszystkich obrazów, zanim cokolwiek przeczyta .

Co za strata czasu!

Zamiast zmuszać użytkowników do czekania na wczytanie wszystkich obrazów, leniwe wczytywanie umożliwia wczytanie innych zasobów strony przed obrazami w części strony widocznej po przewinięciu (niewidoczną częścią strony). Gdy użytkownik przewinie, obrazy zostaną załadowane i wyświetlone.

Aby ustawić leniwe ładowanie, zainstalowałem wtyczkę BJ Lazy Load (bezpłatną), która używa JavaScript do opóźniania ładowania obrazu. Tak, to dodatkowy skrypt do Twojej witryny WordPress, ale warto, ponieważ obrazy stanowią tak dużą część rozmiaru strony.

Oto jak szybko mój wpis na blogu został załadowany z włączonym leniwym ładowaniem:

Uwaga: Jeśli używasz leniwego ładowania, czasy ukończenia dokumentu i pełnego załadowania nie będą uwzględniać obrazów znajdujących się w dalszej części strony.

Przed użyciem leniwego ładowania strona ładowała się prawie 10 sekund – leniwe ładowanie powodowało, że moja strona ładowała się 2x szybciej .

Możesz zobaczyć dlaczego, patrząc na podział treści w WebPageTest:

Przy włączonym leniwym ładowaniu liczba żądań obrazów zmniejsza się ze 158 do 134. Rozmiar obrazu zmniejsza się z 2 523 665 bajtów (2,5 MB) do zaledwie 116 319 bajtów (0,12 MB).

Wtyczka BJ Lazy Load dodała do witryny kilka dodatkowych skryptów JavaScript i innych, ale wydaje się, że nie mają one wpływu na czas ładowania.

Możesz także leniwie ładować obrazy, korzystając z bezpłatnej wtyczki Autoptimize, która wykona również szereg innych optymalizacji prędkości omówionych w tym artykule. Przejdź do Pulpit > Ustawienia > Autooptymalizacja > Obrazy i zaznacz opcję „Lazy-load images” .

Nie polegaj wyłącznie na leniwym ładowaniu za pomocą JavaScript w celu optymalizacji szybkości, ponieważ jeśli użytkownicy blokują Javę, nie otrzymają leniwego ładowania; upewnij się, że Twoje obrazy są również skompresowane, aby uzyskać maksymalne korzyści.

Jedna ważna rzecz do zapamiętania: możesz również dodać klasy obrazów, aby upewnić się, że podstawowe obrazy są ładowane natychmiast (jak wszystko, co znajduje się nad zakładką). Po prostu skonfiguruj tag, taki jak „not-lazy=”1″ w BJ Lazy Load i dodaj do dowolnego obrazu, aby pominąć leniwe ładowanie. Autooptymalizacja pozwala dodawać leniwe wykluczenia obciążenia.

Uwaga: WordPress pracuje nad dodaniem leniwego ładowania do WordPress Core, co oznacza, że ​​w przyszłości będzie można z niego korzystać bez dodatkowego kodu lub wtyczek.

Nie zakładaj, że CDN przyspieszy ładowanie obrazów

Czytałem wiele porad dotyczących szybkości WordPressa, a większość z nich zaleca skorzystanie z płatnej usługi CDN, takiej jak KeyCDN (którą testowałem) lub StackPath (dawniej MaxCDN), aby hostować Twoje obrazy.

W przypadku korzystania z sieci CDN obrazów żądania wysyłane podczas wczytywania strony internetowej będą pochodzić z adresu URL, takiego jak cdn.nazwa-domeny.com/nazwa-obrazu zamiast adresu nazwa-domeny.com/nazwa-obrazu . Oznacza to, że żądanie pochodzi z innego serwera niż reszta zawartości Twojej witryny, ale nie oznacza to, że będzie szybsze.

Na przykład spójrz na czasy ładowania losowej strony w witrynie WordPress WPBeginner:

Obrazy z CDN (używa MaxCDN) ładują się długo i nie są nawet duże. Powyższy panel szczegółów pokazuje obraz o rozmiarze 9,3 KB, który ładuje się w prawie trzy czwarte sekundy. To leniwe tempo!

CDN nie zawsze sprawi, że Twoje obrazy ładują się szybko. Dobra kompresja obrazu i leniwe ładowanie to znacznie bardziej niezawodny sposób na szybsze ładowanie stron.

Załaduj JavaScript asynchronicznie

Chociaż skrypty mogą spowalniać nasze witryny, potrzebujemy ich również i ich funkcji. Na przykład lubię korzystać z Google Analytics, więc nie chcę go usuwać tylko po to, aby przyspieszyć moją witrynę. Istnieje jednak sposób na szybsze ładowanie Analytics i innych skryptów — ładowanie asynchroniczne .

Asynchroniczny JavaScript ładuje wiele skryptów jednocześnie – przeciwieństwo ładowania synchronicznego, co oznacza ładowanie skryptów w kolejności, po jednym na raz.

Ładując wszystkie skrypty w tym samym czasie, powinny one ładować się znacznie szybciej, ponieważ nie ma czasu oczekiwania. Dzieje się tak szczególnie w przypadku, gdy Twoja witryna WordPress wywołuje JavaScript z wielu różnych zewnętrznych źródeł, takich jak Google Analytics lub Google Fonts.

Jeśli uruchomiłeś test szybkości witryny w Google Page Speed ​​Insights, prawdopodobnie wiesz, że musisz „ wyeliminować blokujący renderowanie JavaScript ”.

Usunięcie kodu JavaScript blokującego renderowanie umożliwi wczytanie zawartości strony widocznej na ekranie (takiej jak obrazy i tekst) bez oczekiwania na kod JavaScript. Jeśli Twoja witryna WordPress potrzebuje JavaScript do załadowania, zanim będzie mogła działać, to blokujący renderowanie JavaScript jest w porządku. Ale jeśli, tak jak ja, Twoja witryna używa tylko JavaScript do dodatkowych funkcji, blokowanie kodu Java blokującego renderowanie jest świetnym sposobem na przyspieszenie Twojej witryny.

Użyłem darmowej wtyczki Async JavaScript, aby łatwo zoptymalizować mój JavaScript. Wybierz szybkie ustawienie „Zastosuj asynchronię”:

Aby uzyskać dodatkowe punkty za szybkość, możesz również zmienić kod śledzenia Google Analytics na wersję asynchroniczną, która według stanu Google pomoże przyspieszyć działanie witryny:

Poniższy alternatywny fragment kodu śledzenia asynchronicznego dodaje obsługę wstępnego ładowania, co zapewni niewielki wzrost wydajności w nowoczesnych przeglądarkach.

 <!-- Google Analytics -->
<skrypt>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(argumenty)};ga.l=+new Data;
ga('utwórz', ' UA-XXXXX-Y ', 'auto');
ga('wyślij', 'odsłona');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- Zakończ Google Analytics -->

Włącz kompresję gzip

Kompresja Gzip to bezstratna metoda kompresji, która zmniejsza pliki i pomaga im szybciej się ładować ze względu na ich mniejszy rozmiar.

Tekst, HTML, JavaScript i CSS można skompresować za pomocą kompresji gzip.

Możesz użyć różnych wtyczek WordPress, aby zastosować kompresję gzip. Usługi takie jak CloudFlare mogą również zrobić to za Ciebie. Jeśli to możliwe, lubię stosować kompresję bezpośrednio na serwerze .

Jeśli Twój pakiet hostingowy zapewnia dostęp do panelu cPanel, możesz dodać kompresję gzip bezpośrednio do serwera. Przejdź do ikony „Optymalizuj witrynę” ze strony głównej cPanel. Wybierz „Kompresuj całą zawartość” i kliknij „Aktualizuj ustawienia”.

Aby sprawdzić, czy kompresja gzip jest aktywna w Twojej witrynie, przeprowadź prosty test.

Usuń ciągi zapytań

Niektóre pliki CSS mają na końcu numer wersji, np. „css/screen.min.css?ver=1.7” . Kawałek po „?” oznacza, że ​​plik nie zostanie zbuforowany, więc będzie ładowany na każdej stronie. Oznacza to, że czas ładowania pozostanie spowolniony, nawet jeśli użytkownik odwiedzi wiele stron w Twojej witrynie.

Dodanie tego kodu na końcu pliku functions.php motywu WordPress spowoduje usunięcie ciągu zapytania. Możesz to zrobić za pomocą Menedżera plików w cPanel lub za pośrednictwem klienta FTP, takiego jak FileZilla.

 /**Usuń ciągi zapytań

funkcja rb_remove_script_version( $src ){
$części = rozbij( '?', $src );
zwróć $części[0];
}
add_filter( 'script_loader_src', 'rb_remove_script_version', 15, 1 );
add_filter( 'style_loader_src', 'rb_remove_script_version', 15, 1 );

Dzięki 99robotom za ten fragment kodu.

Uwaga: Zawsze wykonaj kopię zapasową, zanim zaczniesz bawić się plikami systemowymi!

Zwiększ pamięć WordPress

WordPress ma domyślny limit pamięci 32 MB, co może dławić Twoją witrynę.

Dodaj następujący kod do pliku wp-config.php .

 /** Zwiększ pamięć WordPressa

zdefiniuj( 'WP_MEMORY_LIMIT', '128M' );

Możesz użyć tej bezpłatnej wtyczki, aby sprawdzić, ile pamięci używa Twoja witryna WordPress.

Dodaj wstępne pobieranie DNS

DNS to serwer nazw domen. Chociaż znamy domeny (inaczej strony internetowe) po nazwach słownych, takich jak Google.com, komputery znają domeny jako liczby zwane adresami IP (np. 12.345.678). Aby pobrać zasoby z domeny, musi nastąpić wyszukiwanie DNS, które tłumaczy słowo nazwę na adres IP. To wymaga czasu.

Wstępne pobieranie DNS próbuje rozwiązać wyszukiwanie domeny i przetłumaczyć nazwę słowa na adres IP przed kliknięciem łącza lub załadowaniem zasobów.

Dodanie wstępnego pobierania DNS dla popularnych skryptów w witrynie WordPress, takich jak Google Analytics lub czcionki, skróci czas ładowania o kilka milisekund.

Uruchom test na WebPageTest i zobacz, które zasoby zewnętrzne musisz pobrać z wyprzedzeniem.

Dodaj ten kod do pliku functions.php w swoim motywie WordPress

 //* Dodawanie wstępnego pobierania DNS

funkcja dns_prefetching() {echo ' ';}add_action('wp_head', 'dns_prefetching', 0);

Przejdź do zakładki „Domeny” w WebPageTest, aby dowiedzieć się, które domeny zewnętrzne należy pobrać z wyprzedzeniem.

Cache przeglądarki dźwigni

Za każdym razem, gdy przeglądarka (np. Chrome, Firefox itp.) ładuje stronę internetową, musi pobrać każdy plik (np. HTML, CSS, JavaScript, obrazy itp.) na stronie. Bez buforowania przeglądarki, jeśli osoba ponownie odwiedzi tę samą stronę internetową w ciągu godziny, ponownie pobierze wszystkie zasoby strony.

Buforowanie przeglądarki przechowuje zasoby witryny w przeglądarce użytkownika przez określony czas, co powinno przyspieszyć wczytywanie stron w miarę kontynuowania przeglądania.

Dodaj poniższy kod do pliku .htaccess , aby wykorzystać buforowanie przeglądarki.

 ## Rozpocznij CACHOWANIE PRZEGLĄDARKI LEVERAGE ##

WygasaAktywny wł.
ExpiresByType image/jpg „dostęp 1 rok”
ExpiresByType image/jpeg „dostęp 1 rok”
ExpiresByType image/gif „dostęp 1 rok”
ExpiresByType image/png „dostęp 1 rok”
ExpiresByType text/css „dostęp 1 miesiąc”
ExpiresByType text/html "dostęp 1 miesiąc"
ExpiresByType application/pdf "dostęp 1 miesiąc"
ExpiresByType text/x-javascript „dostęp 1 miesiąc”
Aplikacja ExpiresByType/x-shockwave-flash „dostęp 1 miesiąc”
ExpiresByType obraz/x-icon „dostęp 1 rok”
ExpiresDefault „dostęp 1 miesiąc”

Zakończ CACHOWANIE PRZEGLĄDARKI Z DŹWIGNIĄ ##

Użyj pamięci podręcznej i sieci CDN, aby przyspieszyć ładowanie

Buforowanie to szybka metoda przechowywania danych , która przechowuje wersje HTML stron witryny w pamięci RAM serwera, dzięki czemu można je szybko udostępnić odwiedzającym.

Bez buforowania za każdym razem, gdy odwiedzający uzyskuje dostęp do strony w witrynie, serwer musi utworzyć nową wersję HTML, co zajmuje trochę czasu.

Dobrą wiadomością jest to, że istnieje wiele darmowych wtyczek do buforowania WordPress, które mogą Ci pomóc.

Używam WP Super Cache, ponieważ został stworzony przez Automattic, firmę stojącą za WordPressem.

CDN (sieć dostarczania treści) to sieć serwerów w różnych globalnych lokalizacjach, które przechowują wersje Twojej witryny. Gdy odwiedzający uzyskuje dostęp do strony w Twojej witrynie, pobiera ją z najbliższej lokalizacji CDN, która prawdopodobnie będzie bliżej niż Twoja fizyczna lokalizacja serwera. Sieci CDN zmniejszają również obciążenie serwera, przechowując wersje obrazów witryny i duże pliki w celu szybkiego wyszukiwania.

Bez CDN serwer znajduje się tylko w jednej lokalizacji, a dane muszą być ładowane i przesyłane z tego serwera do użytkownika za każdym razem.

Istnieje wiele sieci CDN, takich jak KeyCDN, StackPath (dawniej MaxCDN) i Cloudflare. Polecam używanie Cloudflare, jeśli jesteś nowy w CDN, ponieważ jest bezpłatny i łatwy w konfiguracji.

Napraw uszkodzone żądania

Widok wodospadu na stronie WebPageTest podświetli (na żółto) wszelkie błędy żądań lub przekierowania. Są one podawane przy użyciu standardowych kodów stanu http (takich jak 301, 404 itp.) i pomagają wykryć problemy.

Najpierw poszukaj błędów 404 . Moja witryna próbowała załadować brakujący zasób obrazu jako część motywu. Usunąłem go i skróciłem o kilka milisekund czas ładowania. Łatwo.

Wyłącz funkcje WordPress, których nie używasz

WordPress to bardzo potężny i wszechstronny CMS, używany na wielu różnych rodzajach stron internetowych. Prawdopodobnie Twoja własna witryna nie korzysta z niektórych funkcji WordPressa, ale nadal ładuje je wszystkie.

Oto kilka często niedostatecznie używanych funkcji WordPress, które można wyłączyć:

• Emoji
• REST API
• Łącze RSD
• Dashicony
• jQuery Migracja
• Krótki link
• XML-RPC
• Interfejs API pulsu

Możesz użyć Clearfy (darmowej wtyczki), aby łatwo usunąć niepotrzebne wzdęcia WordPress ze swojej witryny.

Załaduj skrypty/wtyczki tylko na określonych stronach

WordPress spróbuje załadować wszystkie wtyczki i skrypty, które masz na każdej stronie Twojej witryny. Ale prawdopodobnie nie używasz ich wszystkich na każdej stronie. Typowym przykładem są wtyczki formularza kontaktowego – jeśli korzystasz z formularza kontaktowego, to prawdopodobnie tylko na Twojej stronie kontaktowej, ale skrypt wtyczki zostanie załadowany na każdej stronie, marnując zasoby.

I oczywiście, jak na ironię, istnieje wtyczka, która pomoże Ci rozwiązać problem z przeciążeniem wtyczek!

Zoptymalizuj bazę danych MySQL

Niezależnie od tego, czy używasz MySQL, czy MariaDB jako bazy danych WordPress, musisz ją zoptymalizować, aby utrzymać szybkie ładowanie witryny. Za każdym razem, gdy podejmujesz działanie w witrynie WordPress, zapisywany jest rekord bazy danych. Może stać się duży!

Zoptymalizuj swoją bazę danych WordPress, aby usunąć wzdęcia, takie jak:

• stare wersje postów
• usunięte tabele wtyczek
• usunięte posty, strony i komentarze

Jeśli korzystasz z pulpitu zarządzania WordPress, takiego jak ManageWP (bezpłatny), możesz zoptymalizować bazę danych WordPress jednym kliknięciem. Możesz także użyć bezpłatnej wtyczki do optymalizacji bazy danych, takiej jak WP DB Manager lub czyszczenia za pośrednictwem phpMyAdmin w cPanel lub z hosta witryny.

Jak sprawdzić, czy Twój motyw WordPress jest wolny?

Nie wszystkie motywy WordPress są sobie równe.

W zależności od tego, jak dobrze są zakodowane i zoptymalizowane pod kątem szybkości, Twój motyw WordPress może być dość szybki lub przeciągać Cię w dół. Jeśli chcesz dowiedzieć się więcej, przeczytaj nasz pełny test najszybszych motywów WordPress.

Możesz to sprawdzić, patrząc na wyniki audytu prędkości WebPageTest.

Spójrz na widok Wodospad i kliknij wszystkie wyniki przed ciągłą niebieską linią Document Complete, które wydają się być opóźnione (wolniejsze elementy będą miały dłuższe paski). Sprawdź adresy URL — wszystko, co zaczyna się od /wp-content/themes/theme-name-tutaj, jest plikiem motywu.

Znalazłem jeden irytujący plik motywu, który powodował ponad 1 sekundę opóźnienia. To brakujący obraz tekstury tła .png z motywu Eleven40. Aby być uczciwym wobec Genesis, dostałem motyw lata temu i od tego czasu go modyfikuję, więc myślę, że kiepskie kodowanie jest moje, a nie motyw potomny. Tak czy inaczej, to mnie spowalnia. Mógłbym spojrzeć na motyw mojego kodu i wprowadzić kilka poprawek lub spróbować przełączyć się na nowy motyw (zobacz porównanie szybkości motywu poniżej). Aby rozwiązać problem, spojrzałem na arkusz stylów style.css motywu i znalazłem problemowy plik .png i zmieniłem kod, aby zamiast tego pobierał biały kolor z polecenia CSS.

Ta prosta poprawka CSS sprawiła, że ​​WordPress ładuje się jeszcze szybciej, a czas ładowania nie przekracza 1 sekundy!

W końcu przełączyłem się na motyw GeneratePress, który jest najszybszym motywem, jaki udało mi się znaleźć (zobacz poniżej, dlaczego!).

Testowanie prędkości Popularne motywy WordPress

W duchu eksperymentów przetestowałem 10 popularnych motywów, aby sprawdzić, czy mogę uzyskać poprawę szybkości. Pełne wyniki możesz przeczytać tutaj.

TL; DR : GeneratePress Premium to najszybszy motyw WordPress, który możesz teraz kupić. Od tego czasu przeniosłem tę stronę na GeneratePress.

Oto zaktualizowany test prędkości, dzięki któremu możesz zobaczyć, jak szybko jest. Wyniki dotyczą mojej strony z recenzjami perfmatters:

To łączny czas wczytywania poniżej 1 sekundy i wynik szybkości na urządzeniach mobilnych wynoszący 91/100 w PageSpeed ​​Insights.

Strona przechodzi również test Google Core Web Vitals na komputerze:

Jak rozpoznać problemy z powolnym hostingiem

Nie wszystkie problemy z szybkością witryny WordPressa można magicznie poprawić, zmieniając hosty lub uaktualniając do szybszego pakietu hostingowego, ale możesz użyć WebPageTest, aby dokładnie określić, jak bardzo Twój hosting Cię spowalnia.

Spróbuj hostować prosty plik index.html i sprawdzić czasy ładowania. Jeśli nie możesz uzyskać szybkiego TTFB na prostej stronie html, Twój hosting bardzo Cię spowalnia.

Przesłałem prostą stronę HTML z obrazami i uzyskałem TTFB 0,221 sekundy , co jest dobre dla taniego hostingu! Więc mój dostawca hostingu nie jest wolny, ale moja witryna WordPress na pewno tak! Teraz wiem, że nie ma sensu wydawać więcej pieniędzy na hosting, dopóki nie zoptymalizuję WordPressa.

Od tego czasu przeniosłem moją witrynę WordPress do Cloudways, która kosztuje 10 USD miesięcznie, ale oferuje fantastyczne prędkości. Otrzymuję teraz TTFB 0,092 sekundy , co jest bardzo szybkie. Możesz przeczytać moją recenzję Cloudways, aby uzyskać więcej informacji.

Wtyczki prędkości WordPress

Po tym, jak spędziłem wieki badając ulepszenia prędkości WordPressa i metody testowania na moich stronach internetowych, odkryłem, że wtyczka perfmatters (recenzja tutaj) wykonuje za Ciebie dużo pracy. Za mniej niż 25 USD jest to proste rozwiązanie.

Jest też WP Rocket (recenzja tutaj), który świetnie sprawdzi się w przyspieszeniu witryny WordPress.

Ponadto, jeśli nie jesteś zainteresowany samodzielnym poprawianiem ustawień serwera i cPanel, możesz również użyć zarządzanego hostingu WordPress, takiego jak Kinsta, i zlecić im pracę. Będzie to kosztować znacznie więcej niż tani hosting, ale przynajmniej możesz o tym zapomnieć i zostawić to ekspertom.

Osobiście lubię pracować samodzielnie i myślę, że ważne jest, aby zrozumieć, co spowalnia witrynę WordPress. That said, I do recommend using third party services to clients, less tech-savvy WordPress users or those who value their time.

If you want a quick fix to a slow WordPress website, I recommend using the following plugins and services:

• Perfmatters
• WP Rocket

I've also heard good things about Nitropack, but I haven't tested it out yet.