Jak wtyczki WordPress mają wpływ na czas wczytywania Twojej witryny

Czy kiedykolwiek zastanawiałeś się, jak wtyczki WordPress mają wpływ na czas wczytywania twojej witryny? Wtyczki WordPress umożliwiają dodawanie funkcji do twojej witryny, ale mogą mieć również wpływ na szybkość witryny internetowej. W tym artykule pokażemy ci, jak wtyczki WordPress mają wpływ na czas wczytywania twojej witryny i jak możesz je skuteczniej kontrolować.

Jak działają wtyczki WordPress?

Wtyczki WordPress są jak aplikacje dla twojej witryny WordPress. Możesz je zainstalować, aby dodać więcej funkcji do twojej witryny internetowej, takich jak formularze kontaktowe, galerie zdjęć lub sklep e-handel.

Gdy ktoś przejdzie na twoją witrynę internetową, WordPress najpierw wczytuje swoje pliki rdzeniowe, a następnie wszystkie włączone wtyczki.

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

Jak wtyczki mogą mieć wpływ na czas wczytywania witryny?

Każda wtyczka WordPress oferuje inną funkcjonalność i funkcje. W tym celu niektóre wtyczki wykonują wywołania bazy danych na zapleczu, podczas gdy inne wczytują zasoby na front-endzie, takie jak arkusze stylów CSS, pliki JavaScript, obrazki itp.

Wykonywanie zapytań do bazy danych i ładowanie zasobów wydłuża czas wczytywania twojej witryny. Większość wtyczek wysyła żądanie HTTP w celu wczytywania zasobów, takich jak skrypty, CSS i obrazki. Każde żądanie zwiększa czas wczytywania twojej witryny.

Jeśli jest to zrobione prawidłowo, wpływ na wydajność często nie jest zbyt powiadomienie.

Jeśli jednak używasz wielu wtyczek, które wykonują zbyt wiele żądań http w celu wczytywania plików i zasobów, będzie to miało wpływ na wydajność twojej witryny i wrażenia użytkownika.

Jak sprawdzić pliki wczytywane przez wtyczki WordPress?

Aby sprawdzić, jak wtyczki mają wpływ na czas ładowania twojej strony, musisz sprawdzić pliki wczytywane przez wtyczki WordPress.

Istnieje wiele narzędzi, których można użyć, aby to sprawdzić.

Możesz skorzystać z narzędzi deweloperskich twojej przeglądarki (Inspect w Google Chrome i Inspect Element w Firefox).

Wystarczy przejść na twoją witrynę internetową i kliknąć prawym przyciskiem myszy, aby wybrać opcję Sprawdź. Spowoduje to otwarcie panelu narzędzi programistycznych.

Należy kliknąć kartę „Sieć”, a następnie przeładować twoją witrynę internetową. Podczas przeładowywania strony będziesz mógł zobaczyć, jak twoja przeglądarka wczytuje poszczególne pliki.

W tym celu można również skorzystać z narzędzi innych firm, takich jak Pingdom i GTmetrix. Oprócz innych przydatnych informacji, narzędzia te pokazują również wszystkie pliki, które są wczytywane i ile czasu zajęło ich wczytywanie.

Ile wtyczek to za dużo?

Widząc wczytywane pliki, możesz zacząć zastanawiać się, ile wtyczek powinienem używać na mojej witrynie? Ile wtyczek to za dużo?

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

Pojedyncza zła wtyczka może wczytywać 12 plików, podczas gdy wiele dobrych wtyczek doda tylko kilka dodatkowych plików.

Wszystkie dobrze zakodowane wtyczki starają się wczytywać jak najmniej plików. Jednak nie wszyscy twórcy wtyczek są tak ostrożni. Niektóre wtyczki wczytują pliki przy każdym ładowaniu strony, nawet jeśli ich nie potrzebują.

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

Jak utrzymać wtyczki pod kontrolą?

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

Zobacz nasz przewodnik, jak znaleźć odpowiednie wtyczki WordPress.

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

Następnie musisz zacząć korzystać z pamięci podręcznej i CDN, aby jeszcze bardziej poprawić wydajność i szybkość Twojej witryny.

Kolejnym czynnikiem, który powinieneś wziąć pod uwagę, jest twój hosting witryny internetowej. Jeśli twoje serwery hostingowe nie są odpowiednio zoptymalizowane, wydłuży to czas reakcji witryny.

Oznacza to, że nie tylko wtyczki, ale ogólna wydajność twojej 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ć. Dokładnie przejrzyj zainstalowane wtyczki na twojej witrynie internetowej i sprawdź, czy możesz odinstalować niektóre z nich. Nie jest to idealne rozwiązanie, ponieważ będziesz musiał pójść na kompromis w kwestii funkcji na rzecz szybkości.

Ręczna optymalizacja zasobów wtyczek WordPress

Zaawansowani użytkownicy WordPressa mogą spróbować zarządzać tym, jak wtyczki WordPressa wczytują pliki na ich witrynie. Wymaga to pewnej wiedzy na temat kodowania i umiejętności debugowania.

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

Większość twórców wtyczek WordPress używa ich do wczytywania plików wtyczek. WordPress posiada również proste funkcje do wyrejestrowania tych skryptów i arkuszy stylów.

Jeśli jednak po prostu wyłączysz wczytywanie tych skryptów i arkuszy stylów, zepsuje to twoją wtyczkę i nie będzie ona działać poprawnie. Aby to poprawić, musisz skopiować i wkleić te style i skrypty do arkuszy stylów i plików JavaScript twojego motywu.

W ten sposób będziesz mógł wczytywać je wszystkie jednocześnie, minimalizując żądania http i skutecznie skracając czas ładowania twojej strony.

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

Wyłączanie arkuszy stylów wtyczek w WordPressie

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

Po znalezieniu uchwytu arkusza stylów możesz go wyrejestrować, dodając ten kod do pliku functions. php twojego motywu lub wtyczki witryny.

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

.

W ramach tej funkcji można wyrejestrować dowolną liczbę uchwytów stylów. Na przykład, jeśli masz więcej niż jedną wtyczkę do wyrejestrowania arkusza stylów, możesz to zrobić w następujący 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 będzie miało wpływ na funkcje wtyczek na twojej witrynie internetowej. Musisz skopiować treść każdego wyrejestrowanego arkusza stylów i wkleić je do arkusza stylów twojego motywu WordPress lub dodać je jako własny CSS.

Wyłączanie skryptów JavaScript wtyczek w WordPress

Podobnie jak w przypadku arkuszy stylów, będziesz musiał znaleźć uchwyt używany przez plik JavaScript, aby go wyrejestrować. Jednak nie znajdziesz uchwytu za pomocą narzędzia inspect.

W tym celu będziesz musiał zagłębić się w pliki wtyczek, aby znaleźć uchwyt używany przez wtyczkę do wczytywania skryptu.

Innym sposobem na znalezienie wszystkich uchwytów używanych przez wtyczki jest dodanie tego kodu do pliku functions.php twojego motywu.

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

.

Po dodaniu tego kodu można użyć [pluginhandles] krótki kod, aby wyświetlić listę uchwytów skryptów wtyczek.

Teraz, gdy masz już 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, jak poniżej:

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 wspomnieliśmy wcześniej, wyłączenie tych skryptów spowoduje, że twoja wtyczka przestanie działać poprawnie.

Aby tego uniknąć, będziesz musiał połączyć skrypty JavaScript razem, ale czasami nie działa to płynnie, więc musisz wiedzieć, co robisz. Możesz uczyć się metodą prób i błędów (jak wielu z nas), ale zalecamy, aby nie robić tego na żywej witrynie.

Najlepszym miejscem do testowania jest lokalna instalacja WordPress lub witryna przejściowa z zarządzanymi dostawcami hostingu WordPress.

Wczytywanie skryptów tylko na określonych stronach

Jeśli wiesz, że będziesz potrzebować skryptu wtyczki do wczytywania na określonej stronie twojej witryny internetowej, możesz zezwolić na wtyczkę na tej konkretnej stronie.

W ten sposób skrypt pozostanie wyłączony na wszystkich innych stronach twojej witryny i będzie wczytywany tylko wtedy, gdy będzie potrzebny.

Oto jak można wczytywać skrypty na określonych stronach.

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

function my_deregister_javascript() {
if ( !is_page('Contact') ) {
wp_deregister_script( 'contact-form-7' );
}
}

.

Ten kod po prostu wyłącza skrypt contact-form-7 na wszystkich stronach z wyjątkiem strony kontaktowej.

Na razie to wszystko.

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak wtyczki WordPress mają wpływ na czas wczytywania twojej witryny. Zachęcamy również do zapoznania się z naszym przewodnikiem na temat poprawy szybkości i wydajności witryny WordPress.

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube, aby zobaczyć poradniki dotyczące filmów WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.