Lazy lasting av bilder med jQuery

Et svært viktig trekk ved et nettsted er definitivt lasting hastigheten på sine sider. Til tross for en treg side, det tar for lang tid å vise oss hva vi ønsker, faktisk, stenger de fleste av brukerne på siden, bytte til et alternativt område eller konkurrent. Internett er ikke et verktøy for pasient folk ;-)

Teknikken av Lazy Loading (oversatt til "lat lasting") av bilder er nettopp å unngå lang ventetid og unødvendige innenfor en nettside. Denne programmeringen teknikken er ikke, faktisk, med henvisning til bilder, men dekker alle ressursene "ubrukelig" når det lastes inn, riorse som vil, selvfølgelig, hentet "on demand" når det er behov.

Vi vil møte diskurs av bilder som de er i hovedsak de tyngste delen av en web-side. Brukeren starter en side ikke nødvendigvis vil vise alle bildene, kanskje fordi de er skjult eller rett og slett fordi den plasseres nederst eller i et område fjernt fra der brukeren ønsker å få tilgang til informasjon.
Slike situasjoner oppstår spesielt for meget store sider, hvordan kan de være de av bloggen (som i beskyldning om mange kommentarer, kan være veldig lang). I tilfeller som dette gir ingen mening å laste alle bildene ved oppstart, særlig de som ligger nederst fordi det aldri kan sees!

Å implementere lat lasting teknikken kan implementeres på forskjellige måter.
Den mest opplagte som kommer til hjernen er å fjerne bildene på fly fra DOM bruker JavaScript. Men dette vil også være feil fordi måten de fleste nettlesere, men har sendt inn søknaden, og ikke det bildet du vil få full effekt du ønsker.
En god teknikk, fremhevet i artikkelen av Paul Hammond Speed ​​Up Your Site med Forsinket innhold er i stedet å bruke egendefinerte attributter i HTML5. La oss se hvordan.

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