Czy kiedykolwiek zastanawiałeś się, jak wtyczki WordPress wpływają na czas ładowania witryny? Wtyczki WordPress pozwalają dodawać funkcje do witryny, ale mogą również wpływać na szybkość witryny. W tym artykule pokażemy, jak wtyczki WordPress wpływają na czas ładowania witryny i jak możesz je skuteczniej kontrolować.

How WordPress plugins affect your site's load time

Jak Działają Wtyczki WordPress?

Wtyczki WordPress są jak aplikacje dla Twojej witryny WordPress. Możesz je zainstalować, aby dodać więcej funkcji do swojej witryny, takich jak formularze kontaktowe, galerie zdjęć lub sklep ecommerce.

Gdy ktoś odwiedza Twoją witrynę, WordPress najpierw ładuje jej podstawowe pliki, a następnie ładuje wszystkie aktywne wtyczki.

Aby uzyskać więcej informacji, zapoznaj się z naszym artykułem na temat Czym są wtyczki WordPress? I jak one działają?.

Jak Wtyczki Mogą Wpływać Na Czas Ładowania Witryny?

Każda Wtyczka WordPress oferuje różne funkcje i funkcje. Aby to zrobić, niektóre wtyczki wykonują połączenia z bazą danych na zapleczu, podczas gdy inne ładują zasoby na front-endzie, takie jak arkusze stylów CSS, pliki JavaScript, obrazy itp.

Wykonywanie zapytań do bazy danych i ładowanie zasobów zwiększa czas ładowania witryny. Większość wtyczek wysyła żądanie HTTP, aby załadować zasoby, takie jak skrypty, CSS i obrazy. Każde żądanie zwiększa czas ładowania strony witryny.

Po prawidłowym wykonaniu wpływ na wydajność często nie jest zbyt zauważalny.

Jeśli jednak używasz wielu wtyczek, które wykonują zbyt wiele żądań http, aby załadować pliki i zasoby, wpłynie to na wydajność witryny i komfort użytkownika.

Jak sprawdzić pliki załadowane przez wtyczki WordPress?

Aby zobaczyć, jak wtyczki wpływają na czas ładowania strony, musisz sprawdzić pliki załadowane przez wtyczki WordPress.

Istnieje wiele narzędzi, których możesz użyć, aby to rozgryźć.

Możesz korzystać z narzędzi programistycznych swojej przeglądarki (Inspect w Google Chrome i Inspect Element w Firefox).

Po prostu odwiedź swoją stronę i kliknij prawym przyciskiem myszy, aby wybrać Inspect. Spowoduje to otwarcie panelu Narzędzia programistyczne.

Musisz kliknąć kartę „Sieć”, a następnie ponownie załadować witrynę. Po przeładowaniu strony będziesz mógł zobaczyć, jak przeglądarka ładuje każdy plik.

See page load time and files loaded with inspect tool

Możesz również użyć narzędzi innych firm, takich jak Pingdom i GTmetrix, aby to zobaczyć. Wśród innych przydatnych informacji narzędzia te pokażą również wszystkie załadowane pliki i czas ładowania.

Testing page load time using Pingdom

Ile wtyczek to za dużo?

Gdy widzisz, że te pliki są ładowane, możesz zacząć się zastanawiać, ile wtyczek powinienem użyć na mojej stronie? Ile wtyczek to za dużo?

Odpowiedź naprawdę zależy od zestawu wtyczek, których używasz na swojej stronie.

Jedna zła wtyczka może załadować pliki 12, podczas gdy wiele dobrych wtyczek doda tylko kilka dodatkowych plików.

Wszystkie dobrze zakodowane wtyczki starają się ograniczyć ładowanie plików do minimum. Jednak nie wszyscy twórcy wtyczek są tak ostrożni. Niektóre wtyczki będą ładować pliki przy każdym ładowaniu strony, nawet jeśli nie potrzebują tych plików.

Jeśli używasz zbyt wielu takich wtyczek, zacznie to wpływać na wydajność witryny.

Jak zachować kontrolę nad wtyczkami?

Najważniejszą rzeczą, którą możesz zrobić w swojej witrynie WordPress, jest używanie tylko wtyczek, które są dobrze zakodowane, mają dobre recenzje i są zalecane przez zaufane źródła.

Zobacz nasz przewodnik, jak znaleźć wtyczki WordPress.

Jeśli okaże się, że wtyczka WordPress wpływa na obciążenie witryny, poszukaj lepszej wtyczki, która wykonuje tę samą pracę, ale lepiej.

Następnie musisz zacząć używać buforowania i CDN, aby jeszcze bardziej poprawić wydajność i szybkość witryny.

Innym czynnikiem, który należy wziąć pod uwagę, jest hosting witryny. Jeśli twoje serwery hostingowe nie są odpowiednio zoptymalizowane, zwiększy to czas reakcji witryny.

Oznacza to, że nie tylko wtyczki, ale ogólna wydajność witryny będzie wolniejsza. Upewnij się, że korzystasz z jednej z najlepszych firm hostingowych WordPress.

W ostateczności możesz odinstalować wtyczki, bez których możesz żyć. Uważnie przejrzyj zainstalowane wtyczki na swojej stronie internetowej i sprawdź,czy możesz odinstalować niektóre z nich. Nie jest to idealne rozwiązanie, ponieważ będziesz musiał iść na kompromis w kwestii funkcji dla szybkości.

Ręcznie Zoptymalizuj Zasoby Wtyczki WordPress

Zaawansowani użytkownicy WordPress mogą próbować zarządzać tym, jak wtyczki WordPress ładują pliki na swojej stronie. Wymaga to pewnej wiedzy na temat kodowania i umiejętności debugowania.

Właściwym sposobem ładowania skryptów i arkuszy stylów w WordPress jest użycie wp_enqueue_style oraz wp_enqueue_script funkcje.

Większość programistów wtyczek WordPress używa ich do ładowania plików wtyczek. WordPress posiada również łatwe funkcje do wyrejestrowania tych skryptów i arkuszy stylów.

Jeśli jednak wyłączysz Ładowanie tych skryptów i arkuszy stylów, spowoduje to uszkodzenie wtyczek i nie będą one działać poprawnie. Aby to naprawić, musisz skopiować i wkleić te style i skrypty do arkusza stylów motywu i plików JavaScript.

W ten sposób będziesz mógł załadować je wszystkie na raz, minimalizując żądania http i skutecznie skracając czas ładowania strony.

Zobaczmy, jak łatwo wyrejestrować arkusze stylów i pliki JavaScript w WordPress.

Wyłącz arkusze stylów wtyczek w WordPress

Najpierw musisz znaleźć nazwę lub uchwyt arkusza stylów, który chcesz wyrejestrować. Możesz go zlokalizować za pomocą narzędzia inspect w przeglądarce.

Finding a style name

Po znalezieniu uchwytu arkusza stylów możesz go wyrejestrować, dodając ten kod do funkcji szablonu.plik php lub wtyczka specyficzna dla witryny.

add_action ('wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles () {
wp_deregister_style ('gdwpm_styles-css' );
}

Możesz wyrejestrować dowolną liczbę uchwytów stylowych w ramach tej funkcji. Na przykład, jeśli masz więcej niż jedną wtyczkę do wyrejestrowania arkusza stylów, zrobisz to w ten sposób:


add_action ('wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles () {
wp_deregister_style ('gdwpm_styles-css' );
wp_deregister_style ('BFA-font-awesome-css' );
wp_deregister_style ('some-other-stylesheet-handle' );
}

Pamiętaj, że wyrejestrowanie tych arkuszy stylów wpłynie na funkcje wtyczek w Twojej witrynie. Musisz skopiować zawartość każdego wyrejestrowanego arkusza stylów i wkleić je do arkusza stylów motywu WordPress lub dodać je jako niestandardowy CSS.

Wyłącz Plugin JavaScripts w WordPress

Podobnie jak arkusze stylów, musisz znaleźć uchwyt używany przez plik JavaScript do wyrejestrowania ich. Jednak nie znajdziesz uchwytu za pomocą narzędzia inspect.

W tym celu musisz zagłębić się w Pliki Wtyczek, aby dowiedzieć się, jaki uchwyt jest używany przez wtyczkę do załadowania skryptu.

Innym sposobem na sprawdzenie wszystkich uchwytów używanych przez wtyczki jest dodanie tego kodu do funkcji motywu.plik php.

function wpb_display_pluginhandles () { 
$wp_scripts = wp_scripts(); 
$handlename .= "<ul>",; 
    foreach ($wp_scripts - >Kolejka jako $ uchwyt ) :
      $handlename .= "<li>". $ uchwyt ."</li>";
    endforeach;
$handlename .= "</ul>",;
return $handlename; 
}
add_shortcode ('pluginhandles', 'wpb_display_pluginhandles'); 

Po dodaniu tego kodu możesz użyć [pluginhandles] shortcode do wyświetlenia listy uchwytów skryptu wtyczki.

Display a list of plugin script handles in WordPress

Teraz, gdy posiadasz uchwyty skryptów, możesz je łatwo wyrejestrować za pomocą poniższego kodu:

add_action ('wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript () {
wp_deregister_script ('contact-form-7' );
}

Możesz również użyć tego kodu, aby wyłączyć wiele skryptów, takich jak ten:

add_action ('wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript () {
wp_deregister_script ('contact-form-7' );
wp_deregister_script ('gdwpm_lightbox-script' );
wp_deregister_script ('another-plugin-script' );
}

Teraz, jak już wspomnieliśmy wcześniej, że wyłączenie tych skryptów zatrzyma wtyczki do prawidłowego działania.

Aby tego uniknąć, musisz połączyć JavaScript razem, ale czasami nie działa to płynnie, więc musisz wiedzieć, co robisz. Możesz uczyć się na próbach i błędach (jak wielu z nas), ale zalecamy, abyś nie robił tego NA ŻYWO.

Najlepszym miejscem do przetestowania jest lokalna instalacja WordPress lub witryna postojowa z zarządzanymi dostawcami hostingu WordPress.

Wczytywanie skryptów tylko na określonych stronach

Jeśli wiesz, że będziesz potrzebował skryptu wtyczki, aby załadować konkretną stronę na swojej stronie, możesz zezwolić na wtyczkę na tej konkretnej stronie.

W ten sposób skrypt pozostaje wyłączony na wszystkich innych stronach witryny i jest ładowany tylko wtedy, gdy jest to potrzebne.

Oto jak można ładować Skrypty na określonych stronach.

add_action ('wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript () {
jeśli ( !is_page ('kontakt')) {
wp_deregister_script ('contact-form-7' );
}
}

Ten kod po prostu wyłącza skrypt contact-form-7 na wszystkich stronach poza stroną kontaktową.

Na razie to wszystko.

Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak wtyczki WordPress wpływają na czas ładowania witryny. Możesz również zobaczyć nasz najlepszy przewodnik, aby poprawić szybkość WordPress i wydajność witryny.

Jeśli podoba Ci się ten artykuł, zasubskrybuj nasz kanał YouTube dla samouczków wideo WordPress. Znajdziesz nas również na Twitterze i Facebooku.

You May Also Like

Jak naprawić nieprawidłowy błąd JSON w WordPress (Przewodnik dla początkujących)

W artykule: Co powoduje błąd „nieprawidłowa odpowiedź JSON” w WordPress?1. Sprawdź adresy…

Jak zmienić kolor linku w WordPress (poradnik dla początkujących)

W artykule: Dlaczego Linki Są Ważne?Jak dodawać linki w postach i stronach…

Jak naprawić błąd krytyczny w WordPress (krok po kroku)

W artykule: Co To jest błąd krytyczny w WordPress?Co powoduje krytyczny błąd…

Jak zainstalować WordPress lokalnie na komputerze Mac za pomocą MAMP

W artykule: Jak zainstalować MAMP na komputerze MacInstalacja WordPress na komputerze MacWypróbowanie…