Lazy loading a imaginilor cu jQuery

O caracteristica foarte importanta a unui site web este cu siguranta viteza de încărcare a paginilor. În ciuda un site lent, care durează prea mult timp pentru a ne arăta ceea ce vrem, de fapt, majoritatea utilizatorilor se închide pagina de trecerea la un site alternativ sau concurent. Internetul nu este un instrument pentru pacient oameni ;-)

Tehnica de lazy loading (tradus în "lazy loading") de imagini este tocmai pentru a evita lung aşteaptă şi inutile în cadrul unei pagini web. Această tehnică de programare nu este, în fapt, se referă la imagini, ci se referă la toate resursele "inutil" atunci când se încarcă, riorse că va fi, desigur, preluate "la cerere", atunci când este nevoie.

Ne vom confrunta cu discursul de imagini în care acestea sunt în esenţă, cele mai grele parte a unei pagini web. Utilizator începe o pagină nu este în mod necesar toate vor vizualiza imaginile, probabil, deoarece acestea sunt ascunse sau pur şi simplu pentru că au pus în partea de jos sau într-o zonă îndepărtată de unde utilizatorul doreşte accesul la informaţii.
Astfel de situaţii apar mai ales pentru paginile foarte mari, cum sunt cele de la blog-ul (care, în acuzaţia de multe comentarii, poate fi foarte lungă). În astfel de situaţii în care acest lucru nu are sens sa se incarce toate imaginile de la pornire, în special cele situate în partea de jos, deoarece nu ar putea niciodată fi vizualizate!

Pentru a pune în aplicare tehnica lazy loading pot fi puse în aplicare în moduri diferite.
Cele mai evidente care vine în minte este de a elimina imaginile de pe acoperi de la DOM folosind JavaScript. Dar acest lucru ar fi, de asemenea, greşită, deoarece modul cel mai browsere inca nu au transmis cererea de imagine şi v-ar obtine efectul deplin dorit.
O tehnică bună, a subliniat în articol de Paul Hammond Speed ​​Up site-ul dvs. cu conţinut întârziată este, în schimb, de a utiliza atribute personalizate în HTML5. Să vedem cum.

• <<
• 1
• 2
• 3
• >>