Lav bedre progressive billeder Indlæser med AntiModerate
AntiModerate scriptet lyder måske ikke så meget. Men det er et af de bedste JS-scripts, du kan køre for at forbedre ydeevnen på en større side og opretholde en stærk brugeroplevelse.
Med dette gratis plugin, du kan indlæse billeder, når de vises i visning og reducer din samlede sidestørrelse.
På denne måde kan hele siden indlæses først med små pladsholdere til billeder. Derefter blokerer dine besøgende naturligt uden at vente på, at hvert aktiv skal læses - altid en god ting fra brugerens perspektiv!
Sådan fungerer det: Du tilføjer AntiModerate-plugin'et til din side sammen med StackBlur.js-scriptet.
AntiModerate trækker billeddimensioner og styrker alle img-tags i en fast størrelse på siden. Disse forhåndsbelastede billeder skubbes gennem StackBlur.js, som drastisk reducerer den samlede preview filstørrelse, hvorved siden læses meget hurtigere.
Når disse mindre billeder er på plads, lægger AntiModerate billederne i fuld størrelse i baggrunden. Hvert uklart billede udskiftes derefter med det almindelige billede, når det er færdigt med at downloade. Let!
Dette sparer en masse tid på at vente på billeder og det hjælper din side med at indlæse meget hurtigere. Det er en stor fordel for brugerne, da de kan begynde at indtage indhold hurtigere, og det gavner dine SERP-rankings, da Google bekymrer sig meget om sidens hastighed.
Du kan installere biblioteket direkte med npm eller Bower, eller ved at trække scriptet gennem GitHub.
Dette kræver kun nogle få linjer med JavaScript, og det er sikkert at hjælpe med at forbedre dine sidebelastninger. Kig på GitHub repo og rul ned til installationsguiden for at komme i gang.
Med kun nogle få linjer kode, bør AntiModerate være en no-brainer for at køre på en hvilken som helst side.
For ikke at nævne dette kører på ren JavaScript så det kræver ikke nogen afhængigheder som jQuery at få arbejde.