blog
user
08 042021

Zgodnie ze standardami tworzenia stron www media takie jak zdjęcia, które znajdują się poniżej linii zgięcia powinny być ładowane z opóźnieniem. Czym jest ta linia zgięcia i dlaczego zdjęcia mają być ładowane z opóźnieniem?

Linia zgięcia jest to miejsce na stronie internetowej poniżej którego treść strony www nie jest widoczna w przeglądarce. Treść ta pojawia się dopiero jak użytkownik przewinie okno przeglądarki. Zdarza się tak, że użytkownik nie przewija okna do samego dołu więc treści poniżej linii zgięcia ładują się niepotrzebnie. W efekcie transfer zużyty do załadowania strony został wykorzystany niepotrzebnie.

Zdjęcia podczas ładowania strony www zużywają najwięcej transferu dlatego przydatnym narzędziem jest biblioteka jquery lazy load autorstwa  Daniel 'Eisbehr' Kern dostępna na github:  https://github.com/dkern/jquery.lazy. Użycie biblioteki było bardzo proste. Należało dołączyć bibliotekę do kodu strony. Następnie następnie ją uruchomić:


$(document).ready(function(){
$('.lazy').lazyload();
});

Od tej pory każde zdjęcie, które ma dodatkową klasę .lazy jest ładowane z opóźnieniem. Przykład poniżej

<img src="zdjecie.jpg" alt="Zdjęcie" class="lazy" />

Od niedawna w przeglądarkach jest obsługiwany nowy parametr, który pozwala na definiowanie nowego atrybutu dla tagu <img>, który definiuje jakie zdjęcia mają być ładowane z opóźnieniem a jakie natychmiastowo. Podczas kodowania zdjęcia można dodać nowy atrybut

<img src="zdjecie.jpg" loading="eager|lazy|auto">

Wartość eadger oznacza, że zdjęcie ma zostać ładowane natychmiastowo, wartość lazy oznacza, że zdjęcie ma być ładowane z opóźnieniem a wartość auto oznacza, że przeglądarka ma zdecydować czy załadować zdjęcie z opóźnieniem czy natychmiastowo. Atrybut jest na dzień dzisiejszy wspierany przez wszystkie przeglądarki. Chrome od wersji 77.00, Edge od wersji 79.00, Firefox od wersji 75.00, Safari od wersji 12.


Nasze newsy

Śledź nasze aktualności.

blog
user
22 072021

Problem z hotspotem na Iphone 12

Tym razem wpis poświęcony będzie problemowi sprzętowemu, który od czasu do czasu trzeba rozwiązać.

blog
user
13 072021

Granice frameworka Laravel

Laravel jest rozbudowanym frameworkiem MVC pozwalającym na szybkie tworzenie aplikacji. Okazuje się jednak że czasami można osiągnąć granice jego możliwości.

blog
user
07 072021

Nowe serwery z dyskami SSD

Idąc na przeciw oczekiwaniom klientów i mając na celu utrzymanie wysokiej jakości usług wymieniliśmy na serwerze dyski z HDD na SSD.

logo

Masz pytania? Skontaktuj się