Najlepsze wtyczki Lazy Load, które przyspieszają działanie witryny WordPress

Witryny z mnóstwem obrazów mogą ładować się w nieskończoność. Dla każdego obrazu jest to kolejne żądanie HTTP i więcej czasu użytkownicy muszą czekać z frustracją, gdy strony ładują się powoli.

Więc jakie jest rozwiązanie? Powolne ładowanie.

Kontynuuj czytanie lub przejdź dalej, korzystając z tych linków:

• Natywne leniwe ładowanie dotarło z WordPress 5,5
• Czy wtyczka jest już potrzebna?
  • Dostęp do interfejsu
  • Kompatybilność z przeglądarką
  • Dodatkowa optymalizacja
• Czy są jakieś korzyści z natywnego leniwego ładowania?
• Najlepsze wtyczki z leniwym ładowaniem
• Więcej o leniwym ładowaniu

Lazy loading może znacznie przyspieszyć witryny z dużymi obrazami i nie zajmuje dużo czasu, aby włączyć je w Twojej witrynie.

Krótko mówiąc, wymusza ładowanie obrazów tylko wtedy, gdy znajdują się „nad zakładką” – innymi słowy, załadują się tylko obrazy, które pojawią się w przeglądarce użytkownika.

Tak więc, jeśli masz stronę zawierającą 10 świeżych i bezpłatnych pełnoekranowych motywów WordPress, tylko kilka pierwszych obrazów w poście zostanie załadowanych, a pozostałe zostaną załadowane, gdy użytkownik przewinie stronę w dół.

Natywne leniwe ładowanie dotarło z WordPress 5,5

Lazy loading to wciąż stosunkowo nowa funkcja WordPressa.

Działa poprzez dodanie atrybutu „leniwy” i ustawienie wartości na „ładowanie” na twoich obrazach, które są następnie przetwarzane przez przeglądarkę na wyjściu.

Jeśli masz wtyczkę leniwego ładowania, której jesteś lojalny lub przechodzisz przez fazy, w których nie chcesz w ogóle włączać leniwego ładowania, z przyjemnością usłyszysz, że możesz ją wyłączyć.

Niektóre wtyczki robią to automatycznie, jednak jeśli musisz to zrobić ręcznie, po prostu przejdź do pliku functions.php i dodaj:

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

Spowoduje to wyłączenie funkcji leniwego ładowania WordPressa, co oznacza, że ​​będziesz mógł korzystać z wybranej wtyczki bez ryzyka konfliktu.

To tylko jedna linijka kodu, ale jeśli nie czujesz się komfortowo z dodaniem jej, możesz pobrać tę prostą wtyczkę, która zrobi to za Ciebie.

Czy wtyczka jest już potrzebna?

Być może zastanawiasz się, czy w ogóle używać wtyczki teraz, gdy WordPress oferuje natywne leniwe ładowanie.

Dobrze czytaj dalej, ponieważ jest kilka powodów, dla których możesz chcieć trzymać się wtyczki:

Dostęp do interfejsu

Dobra wtyczka do leniwego ładowania, taka jak Smush, oferuje interfejs z opcjami dostosowywania określonych ustawień, a także możliwość włączania i wyłączania leniwego ładowania za naciśnięciem jednego przycisku.

Opcje te mogą obejmować różne typy obrazów, które będą ładowane z opóźnieniem, po strony, których dotyczy ładowanie z opóźnieniem. Jeśli chcesz zmienić takie ustawienia bez wtyczki, musisz zagłębić się w kod i ręcznie dodać te wyjątki.

Kompatybilność z przeglądarką

Kolejnym wielkim pozytywem jest to, że większość wtyczek będzie działać we wszystkich przeglądarkach. Safari jest jedną z głównych przeglądarek, która nie obsługuje atrybutu ładowania, dlatego jeśli masz witrynę z dużą ilością obrazów, możesz zobaczyć odbijających się użytkowników z nieobsługiwanych przeglądarek. To jest coś, o co nie musisz się martwić podczas korzystania z wtyczki.

Dodatkowa optymalizacja

Większość wtyczek oferuje znacznie więcej niż tylko leniwe ładowanie. Wprowadzenie wtyczki do optymalizacji obrazu na swojej stronie internetowej jest prawdopodobnie jedną z najlepszych decyzji, jakie kiedykolwiek podejmiesz.

Wtyczki, takie jak Smush, mogą pomóc Ci wyprzedzić rekomendacje Google PageSpeed ​​dotyczące obrazów i przyspieszyć działanie Twojej witryny — leniwe ładowanie to dopiero początek!

Czy są jakieś korzyści z natywnego leniwego ładowania?

Na pierwszy rzut oka może się wydawać, że wtyczka zrobi wszystko, co może zrobić natywne leniwe ładowanie i nie tylko.

Chociaż jest to technicznie poprawne, główną różnicą jest to, że większość wtyczek wymaga wprowadzenia biblioteki JavaScript, od której będzie zależna Twoja witryna.

Lazy loading natywne jest prostsze i nie wymaga dużo dodatkowego kodu.

Nasza wtyczka do optymalizacji obrazu, Smush, faktycznie oferuje własną wersję natywnego leniwego ładowania.

Działa na tej samej zasadzie co WordPress, ale obsługuje wszystkie te same formaty obrazów, które robi Smush.

Natywne leniwe ładowanie jest być może czymś, co można wykorzystać jako podstawę do innych zmian w przyszłości, ale przynajmniej na razie wtyczki są odpowiednie dla większości witryn.

Jeśli wolisz pomysł wtyczki, aby rozwiązać swoje potrzeby związane z leniwym ładowaniem, przygotowaliśmy kolekcję bezpłatnych wtyczek z leniwym ładowaniem.

• Smush Optymalizacja obrazu

  

  Nie bez powodu Smush jest najpopularniejszą wtyczką do optymalizacji obrazu typu „wszystko w jednym”. Zawieramy wszystko, czego potrzebujesz, aby Twoje obrazy ładowały się szybciej.

  

  Lazy loading jest dostępne zarówno w bezpłatnej wersji Smush, jak i w turbodoładowanym Smush Pro, który jest dostarczany wraz ze Smush Pro CDN i w przeciwieństwie do natywnego lazy loading jest kompatybilny ze wszystkimi przeglądarkami.

  Aby aktywować leniwe ładowanie za pomocą Smush, uprościliśmy ten proces. Wszystko, co musisz zrobić, to przejść do sekcji Lazy Loading w Smush i nacisnąć przycisk Aktywuj . Otóż ​​to.

  Możesz dalej dostosowywać swoje ustawienia po aktywowaniu lazy loading, ale nie jest to konieczne. Domyślne ustawienia Smush i Smush Pro to wszystko, czego potrzebujesz, aby zobaczyć znaczną poprawę wydajności.

• a3 Leniwe obciążenie

  

  A3 Lazy load to popularna wtyczka do leniwego ładowania obrazów, ramek iframe, filmów i innych elementów w Twojej witrynie.

  Ma wiele ustawień, dzięki czemu możesz dostosować sposób ładowania zasobów w witrynie.

  Jest również testowany pod kątem 100% zgodności z popularnymi wtyczkami, takimi jak WooCommerce, Advanced Custom Fields i różnymi CDN.

• Szalony leniwy

  

  Oto kolejna wtyczka ultra Leniwego ładowania, która po prostu działa. Nie jest wymagana skomplikowana konfiguracja.

  W zależności od motywu lub użycia jQuery, Crazy Lazy opcjonalnie użyje zmodyfikowanej wersji wtyczki jQuery Unveil.js lub natywnej biblioteki JavaScript lazyload.js.

• Lazy Load for Videos

  

  Nie wszystkie wtyczki do leniwego ładowania działają z wideo, co jest wstydem, ponieważ filmy mogą zwiększyć rozmiar pliku strony internetowej niż obrazy.

  Lazy Load for Videos może pomóc w leniwym ładowaniu filmów hostowanych na Vimeo lub YouTube. Wczytuje obraz zastępczy i ładuje pełne wideo i odtwarzacz wideo tylko wtedy, gdy użytkownik go kliknie.

  Jest to niezbędne, jeśli Twoja witryna zawiera dużo filmów i wybierasz lekką wtyczkę, która nie obejmuje leniwego ładowania wideo.

Więcej o leniwym ładowaniu

Korzystanie z wtyczki to najprostszy sposób na dodanie leniwego ładowania do Twojej witryny, ale nie jest to jedyny sposób. Możesz także użyć JavaScript w swojej witrynie, jeśli potrzebujesz szczuplejszego rozwiązania.

Jeśli chcesz dowiedzieć się więcej, zapoznaj się z artykułem Jak odroczyć obrazy poza ekranem w WordPress z leniwym ładowaniem, aby dowiedzieć się, jak działa leniwe ładowanie i jak odtworzyć technikę w swojej witrynie.

Jeśli chcesz dowiedzieć się więcej o własnej funkcji leniwego ładowania WordPressa, zapoznaj się z ogłoszeniem.

Najłatwiejszym sposobem na rozpoczęcie leniwego ładowania jest użycie Smush free lub Smush Pro.

Smush Pro dodaje inne funkcje, które mogą pomóc w korzystaniu z innych możliwości Google PageSpeed ​​Insights. Może pomóc w serwowaniu obrazów w formatach nowej generacji, konwertując je do plików WebP i odpowiednio dopasowując je do rozmiaru , skalując je za pomocą Smush Pro CDN. Smush Pro jest nawet kompatybilny z popularną wtyczką WP Retina 2x, więc możesz leniwie ładować te ogromne obrazy Retina bez spowalniania WordPressa.

Wypróbuj Smush Pro za darmo i przekonaj się, jak wiele może zmienić Twoja witryna.

• obrazy