Навигация по сайту

Популярные статьи

Jak zwiększyć szybkość ładowania witryny na WordPress

  1. Znaczenie optymalizacji Ostatnio coraz częściej w witrynie pobierania prędkości słuchu. I to jest...
  2. Dokładność Pagespeed Insights
  3. Twórz kopie zapasowe z wyprzedzeniem, a nie po utracie wszystkiego
  4. Pomiar prędkości pobierania WordPress za pomocą usług online
  5. Zmniejsz wagę strony
  6. Usuń dodatkowy kod
  7. Zmniejsz liczbę żądań
  8. Ustawienia po stronie serwera dla szybszego pobierania WordPressa
  9. Optymalizacja kodu WordPress i zapytań do baz danych
  10. Optymalizuj za pomocą CDN i zmniejsz obciążenie serwera
  11. Lista pomocniczych usług online i ich cel
  12. Zostaw prośbę o rozwiązanie problemów z szybkością ładowania strony

Znaczenie optymalizacji

Ostatnio coraz częściej w witrynie pobierania prędkości słuchu. I to jest naprawdę istotne z dwóch powodów.

Po pierwsze, witryny stają się bardziej funkcjonalne i ciężkie, ale jednocześnie czas reakcji użytkownika niewiele się zmienił. Nikt nie lubi wolnych stron.

Po drugie, wyszukiwarki podczas indeksowania i rankingu stron w tym wydaniu, oczywiście, starają się również pokazać użytkownikowi najlepsze wyniki.

Dlatego ważna jest nie tylko treść i wygląd, ale także optymalizacja techniczna i szybkość witryny.

Na tej stronie zebrałem wszystkie znane, przetestowane, działające techniki, aby przyspieszyć witryny WordPress. Materiał jest odpowiedni zarówno dla początkujących, jak i bardziej doświadczonych webmasterów. Zawsze znajdziesz dla siebie odpowiednie pomysły.

A jeśli zastosujesz się do sugerowanych zaleceń, możesz uzyskać wysoką ocenę w Pagespeed Insights. Ale podstawowym zadaniem jest po prostu stworzenie stron tak szybko, jak to możliwe.
do treści ↑

Proces zwiększania szybkości ładowania strony

Zanim przejdziesz do pracy, musisz zrozumieć wszystkie nadchodzące kroki lub kroki. Oto ich przegląd.

  1. Zbieranie informacji - pomiar bieżącej prędkości pobierania strony
  2. Podkreślając punkty krytyczne - te czynniki, które najbardziej spowalniają Twoją witrynę i dadzą Ci największy wynik.
  3. Etap realizacji - decydujesz się zrobić to sam lub delegować

W tym artykule i na innych stronach mojego bloga pokażę ci, że możesz przyspieszyć swoją stronę WordPress za pomocą prostych kroków .

Czy możesz osiągnąć stuprocentowy poziom wydajności i zagwarantować stabilność tego wyniku? Nie Istnieje wiele różnych czynników wpływających na szybkość ładowania witryny, z których każda może być stale udoskonalana i nieco ulepszana. Przyspieszenie witryny nie jest jednorazowym zadaniem, takim jak „wykonane i zapomniane”. Chociaż wiele technik działa na stałe, witryna nadal wymaga terminowej i zaplanowanej profilaktyki.

Od czasu do czasu (zwłaszcza po uaktualnieniu) ponownie pobierasz prędkość pobierania, a jeśli coś przestanie działać poprawnie, po prostu to naprawisz.
do treści ↑

Dokładność Pagespeed Insights

Kiedy ludzie zwracają się do mnie, aby zobaczyć i naprawić prędkość pobierania, często zwracają szczególną uwagę na Google Pagespeed.

Nie mam nic przeciwko niemu, ale musisz zrozumieć - to tylko zalecenie . Nie zawsze najbardziej optymalny lub przydatny w tej sytuacji.

Jeśli interesują Cię szczegóły, poszukaj mitów na temat Google Pagespeed Insights.

Osobiście używam usługi GTMetrix.com do pomiaru prędkości, a także konsoli przeglądarki, ponieważ pokazują rzeczywistą historię pobierania liniowego (wodospad).

To prawdziwa optymalizacja jest ważna dla Ciebie, Twoich użytkowników i promocji witryny.
do treści ↑

Twórz kopie zapasowe z wyprzedzeniem, a nie po utracie wszystkiego

Twórz kopie zapasowe przed dużymi zmianami!

Jeszcze lepiej, skopiuj swoją stronę na lokalny serwer lub do oddzielnej subdomeny na serwerze. Przetestuj zmiany, a następnie przenieś je.

Weź następujące artykuły, aby pomóc:

Od dłuższego czasu korzystam z wtyczek All in One WP Migration and Duplicator . Są aktualizowane i testowane przez miliony użytkowników.

do treści ↑

Pomiar prędkości pobierania WordPress za pomocą usług online

Zawsze możesz zobaczyć drzewo i historię pobierania w przeglądarce. Wymaga to jednak pewnych umiejętności pracy z narzędziami programistycznymi. Zaletą korzystania z usług jest wizualna prezentacja wizualna - tabele, wykresy i zalecenia.

Pokażę ci, jak mierzyć prędkości pobierania WordPress za pomocą trzech narzędzi online.

Ze względu na dużą zawartość musiałem umieścić w oddzielnym artykule. Przeczytaj tutaj - Narzędzia online do pomiaru prędkości.

Poniższe sekcje zawierają podstawowe zalecenia dotyczące zwiększenia szybkości ładowania witryny na WordPress.
do treści ↑

Zmniejsz wagę strony

Obecnie witryny stają się coraz bardziej dynamiczne, multimedialne i kolorowe. Ale musisz za wszystko zapłacić. Im więcej obrazów, skryptów i wtyczek, tym większy rozmiar tej strony i tym dłużej ładuje się od użytkownika . Ponadto skrypty, wtyczki i style blokują nie tylko ładowanie, ale także generowanie i wyświetlanie stron.

Dokumenty tekstowe są bardzo dobrze skompresowane , w tym HTML, CSS, JS, tj. Główne zasoby witryny, które przekazują treść, projekt, funkcjonalność. Istnieje wiele takich zasobów w witrynie WordPress, więc możesz dosłownie kilka razy zmniejszyć całkowitą wielkość strony.

Na dobrym serwerze kompresja jest domyślnie włączona. Jeśli tak nie jest, będziesz musiał napisać kilka instrukcji w pliku konfiguracyjnym serwera .htaccess.

Możesz wziąć na przykład kod z tego miejsca. włącz kompresję gzip przez .htaccess .

W przypadku hostingu nic.ru optymalizacja jest nieco inna. Oto najbardziej sensowny i działający artykuł, który udało mi się znaleźć i skutecznie z niego korzystam. Włączanie kompresji i buforowania w hostingu Ru-Center .

Opisuje, jak włączyć nie tylko kompresję, ale także dostosować czas buforowania przez przeglądarkę. Zdecydowanie polecam, jeśli korzystasz z tego hostingu.

Dalej.

  • Zmniejsz rozmiar kodu źródłowego - zmniejsz kod HTML, JS i CSS. W tym celu polecam korzystanie z wtyczki Autoptymalizuj ponieważ jest łatwy w użyciu i całkiem funkcjonalny.

A co najważniejsze, używam go nie tylko do minifikacji (w celu zmniejszenia rozmiaru), ale także do odblokowania stylów i skryptów, a także zmniejszenia liczby żądań. Przeczytaj o tym poniżej.

Cóż i.

  • „Liderami” w tworzeniu wagi na stronie są oczywiście obrazy.

Spróbuj zmniejszyć ich liczbę. Jeśli obraz nie ma żadnego znaczenia, może powinien zostać usunięty?

Maksymalna kompresja i optymalizacja wszystkich obrazów. Napisałem o tym osobny artykuł. Optymalizacja obrazu .

Możesz także użyć programu komputerowego lub usług, które wskazałem na końcu strony.

Jeśli pobrałeś już dużą liczbę plików w bibliotece multimediów, użyj wtyczek. EWWW Image Optimizer lub Robin Image Optimizer do kompresji wsadowej. Przycinaj bardzo duże rozmiary zdjęć przed przesłaniem na hosting.

Innym bardzo częstym problemem związanym z obrazami jest skalowanie przeglądarki .

Jeśli korzystasz z usługi Gtmetrix, prawdopodobnie zauważyłeś łańcuch skalowanych obrazów Serve (w tłumaczeniu dajesz skalowane obrazy).

Co to znaczy? Obiekt używa większego rozmiaru obrazu niż jest to konieczne. Jest pobierany w całości, ale jest kompresowany w przeglądarce do rozmiaru wymaganego do wyświetlenia. Dotyczy to wszystkich ekranów, nie tylko mobilnych.

Problem ze skalowaniem obrazów często występuje przy zmianie motywów. Zdarza się, że szablon rejestruje nowe rozmiary, ale jednocześnie stare, już załadowane obrazy nie są przetwarzane.

Musisz odtworzyć nowe wymiary wszystkich obrazów za pomocą prostej wtyczki Regenerate Thumbnails .

Motywy premium i niektóre wtyczki tworzą własne zestawy rozmiarów obrazów, więc zarządzanie nimi staje się trudniejsze. W takich przypadkach często korzystam z wtyczki Simple Image Sizes .

Na stronie Ustawienia -> Strona multimedialna wyświetla wszystkie zarejestrowane wymiary, umożliwia ich zmianę ( ! ), A także regenerację dla niektórych typów rekordów.

Czasami łatwiej jest zastąpić wolną lub masową funkcjonalność czymś innym. Na przykład na jednej stronie widziałem ponad 30 zarejestrowanych rozmiarów, z których 10 tworzyło wtyczkę do galerii. Ponadto ta galeria była używana tylko na kilku stronach, więc uzasadnione było jej porzucenie i zastąpienie ją wbudowaną funkcjonalnością w celu uproszczenia pracy ze stroną i jej obsługą.

Dlatego zwróć szczególną uwagę na elementy graficzne witryny - w większości przypadków decydującym czynnikiem jest prędkość pobierania.
do treści ↑

Usuń dodatkowy kod

Jestem pewien, że masz zainstalowane kilka wtyczek, których użyteczność nie jest zbyt wysoka. Też je mam. Zdarza się, że szukasz funkcjonalności, dodajesz ją przez wtyczkę, przestajesz używać jej funkcji i zapominasz o niej.

Wyświetl listę wszystkich zainstalowanych wtyczek na swojej stronie. Nawet te, które wydają ci się przydatne. Zastanów się dokładnie, jaką wartość każdy z nich ma dla Ciebie - czy możesz zastąpić ich funkcjonalność lub całkowicie odrzucić?

Nie pożałujesz spędzonego czasu. Dodatkowe wtyczki spowalniają witrynę, zmniejszają jej bezpieczeństwo i zwiększają koszty jej obsługi.
do treści ↑

Zmniejsz liczbę żądań

Jeśli wyczyściłeś niepotrzebne wtyczki, - gratulacje, już znacznie zredukowałeś liczbę żądań! Teraz masz tylko niezbędny kod i możesz go zoptymalizować.

  • Połącz skrypty i style, aby zmniejszyć liczbę żądań - wtyczka Autoptimize doskonale radzi sobie z tym zadaniem. Aby uzyskać informacje na temat konfigurowania tej wtyczki, zobacz stronę, którą specjalnie dla tego napisałem - optymalizacja ładowania skryptów i stylów .

Bardzo często konfiguracja wtyczki Autoptimize nie wymaga wiedzy technicznej w pracy witryny.

Bardzo często konfiguracja wtyczki Autoptimize nie wymaga wiedzy technicznej w pracy witryny

Jak zwiększyć szybkość ładowania witryny na WordPressie za pomocą Autoptimize

Jeśli masz szczęście, możesz po prostu zaznaczyć opcję Optymalizuj HTML, CSS i JS . Ale niestety nie zawsze tak jest. Na witrynach o dużej funkcjonalności i liczbie wtyczek, na niewłaściwie nałożonych stronach lub połączonych zasobach mogą pojawić się konflikty, więc napisz w komentarzach lub po prostu poproś o pomoc.

  • Skonfiguruj pamięć podręczną przeglądarki - ustaw czas przechowywania zasobów i dokumentów w kliencie użytkownika;

Ponownie podkreśliłem oddzielny artykuł .

Patrz wyżej ustawienia buforowania dla hostingu ru-centrum. W przypadku większości innych serwerów po prostu dodaj następujący kod do pliku .htaccess.

Przykładem jest Dodaj Expires Header do WordPress .

  • Jeśli w twoim motywie jest dużo małych obrazów - spróbuj połączyć je w Sprite'y CSS .

Przy ogólnym użyciu czcionek ikon w motywach problem ten nie jest tak pilny. Ale ona się spotyka. A jeśli jest obecny na twojej stronie, nie ma sensu go ignorować.

Z powodzeniem korzystałem z bezpłatnej usługi online do generowania obrazów sprite wraz ze stylami - Generator Sprites CSS .
do treści ↑

Ustawienia po stronie serwera dla szybszego pobierania WordPressa

Bardzo ważne jest, aby nie skąpić na jakości hostingu. Zapewni to dobry czas reakcji, stabilność i stały czas pracy, wysoki poziom ochrony i szybkie wsparcie techniczne.

  • Nie zapomnij zaktualizować kodu swojej witryny.

WordPress aktywnie się rozwija. Twórcy wtyczek i autorzy dokonują stałych optymalizacji i zamykają znalezione dziury. Upewnij się, że masz najnowsze wersje.

Powiem szczerze, że jest to najczęstsza przyczyna zepsutych stron. Wtyczka uległa awarii, strona na serwerze była generowana przez długi czas, a cała optymalizacja odeszła.

Dlatego po raz kolejny podkreślam.

To ważne! Aktualizuj kod witryny.

  • Włącz i skonfiguruj buforowanie na serwerze, tworzenie statycznych stron - możesz użyć popularnej i prostej wtyczki WP Super Cache lub inne alternatywy.

Chciałbym usłyszeć twoje doświadczenia na temat wtyczek buforujących, napisz w komentarzach.
do treści ↑

Optymalizacja kodu WordPress i zapytań do baz danych

Wtyczki uruchomione w witrynie uruchamiają ich funkcje, przechwytują, pobierają bazę danych, piszą do niej, czytają opcje - a dzieje się tak nawet wtedy, gdy jej nie widać.

Na szczęście istnieją wygodne sposoby wyświetlania informacji o debugowaniu. Na przykład za pomocą popularnego Query Monitor możesz łatwo wyszukiwać wolne zapytania i ich źródło.

Więcej szczegółowe profilowanie kodu Jest poręczne polecenie profilu wp-cli, które pomaga znaleźć powolny kod na różnych etapach ładowania.
do treści ↑

Optymalizuj za pomocą CDN i zmniejsz obciążenie serwera

Korzystam z bezpłatnego planu Cloudflare na mojej stronie.

Sieci CDN zwiększają dostępność geograficzną witryny, skracają czas odpowiedzi do pierwszego bajtu i generalnie obciążenie serwera, przekazując zasoby przez siebie.

Popularne CDN oferują wiele funkcji do kontrolowania ruchu, ochrony i zwiększania wydajności.

Lista pomocniczych usług online i ich cel

Różne narzędzia online, które przydadzą się w procesie przyspieszania witryny.

  • Przeanalizuj szybkość swojej witryny.
  • Kompresuj, edytuj, przycinaj i konwertuj zdjęcia
    • Kraken.io Web Interface - kompresja obrazu
    • Compressor.io - inne bezstratne narzędzie do kompresji
    • PicResize - kadrowanie, obracanie i zmiana rozmiaru obrazów
    • WebResizer - Zmień rozmiar online
  • CSS, HTML, JS Minifier
    • HTML Minifier - Zmniejszenie rozmiaru kodu HTML, w tym stylów i skryptów obecnych w znacznikach.
    • CSS Minifier - Zredukowany styl kaskadowy
    • JSCompress - Kompresuj skrypty i pliki js
    • UnMinify - proces odwrotny, sprowadzający skompresowany kod do czytelnej postaci.

do treści ↑

Zostaw prośbę o rozwiązanie problemów z szybkością ładowania strony

Jeśli z jakiegoś powodu nie możesz samodzielnie wykonać powyższych czynności, ale chcesz przyspieszyć swoją witrynę, możesz zostawić mi prośbę o wysoką jakość.

Życzę powodzenia w przyspieszaniu witryny!
Podobał mi się artykuł, zaznacz, udostępnij i zostaw komentarze.

Podobny

Czy możesz osiągnąć stuprocentowy poziom wydajności i zagwarantować stabilność tego wyniku?
Jeśli obraz nie ma żadnego znaczenia, może powinien zostać usunięty?
Co to znaczy?
Zastanów się dokładnie, jaką wartość każdy z nich ma dla Ciebie - czy możesz zastąpić ich funkcjonalność lub całkowicie odrzucić?