Lepsze obrazy progresywne ładowane za pomocą AntiModerate

Skrypt AntiModerate może nie brzmieć zbyt dużo. Ale jest to jeden z najlepszych skryptów JS, które możesz uruchomić, aby poprawić wydajność na większej stronie i utrzymać silne wrażenia użytkownika.

Z tym bezpłatna wtyczka, możesz ładować obrazy, gdy pojawią się na widoku i zmniejsz całkowity rozmiar strony.

W ten sposób załaduje się cała strona pierwszy z małymi symbolami zastępczymi dla obrazów. Następnie odwiedzający przeglądają w sposób naturalny, nie czekając na załadowanie każdego zasobu - zawsze dobrze z perspektywy użytkownika!

Oto jak to działa: dodajesz wtyczkę AntiModerate do swojej strony wraz ze skryptem StackBlur.js.

AntiModerate ściąga wymiary obrazu i zmusza wszystkie znaczniki img do ustalonego rozmiaru na stronie. Te wstępnie załadowane obrazy są przesyłane przez StackBlur.js, co drastycznie zmniejsza całkowity rozmiar pliku podglądu, tym samym wczytując stronę o wiele wcześniej.

Po umieszczeniu tych mniejszych obrazów AntiModerate ładuje pełnowymiarowe obrazy w tle. Każde rozmyte zdjęcie jest następnie zastępowane zwykłym zdjęciem po zakończeniu pobierania. Łatwy!

To oszczędza czas oczekiwania na zdjęcia i pomaga szybciej ładować stronę. To ogromna korzyść dla użytkowników, ponieważ mogą oni zacząć konsumować treści szybciej, a to przynosi korzyści w rankingach SERP, ponieważ Google bardzo dba o szybkość stron.

Możesz zainstalować bibliotekę bezpośrednio za pomocą npm lub Bower lub przeciągając skrypt przez GitHub.

Wymaga to tylko kilku linii JavaScript i z pewnością pomoże poprawić ładowanie strony. Rzuć okiem na repozytorium GitHub i przewiń w dół do przewodnika konfiguracji, aby zacząć.

Z zaledwie kilkoma liniami kodu AntiModerate nie powinno być zbyt trudne do uruchomienia na dowolnej stronie.

Nie wspominając już o tym czysty JavaScript więc nie wymaga żadnych zależności, takich jak jQuery, aby pracować.