Forbedre ytelsen til vår kode jQuery

Jeg har alltid funnet interessant artikkel, og enhver diskusjon om hvordan å gjøre koden mer effektiv.
Jeg har alltid informert hver gang at jeg fant meg selv overfor et nytt språk, før PHP, så Java og deretter med jQuery rammeverket. Det er ikke bare å optimalisere responstider, eller bare for å gjøre brukeropplevelsen raskere og mer engasjerende.
Lær hvordan å optimalisere koden gjenspeiles også på kvaliteten på selve koden, noe som jeg alltid har hatt.
Jeg tror det er nødvendig å tenke på jobb som programmerer til den av håndverker, er vårt produkt et artefakt og som sådan, kan være mer eller mindre raffinert.
Det er mange måter å oppnå samme resultat, men noen er bedre enn andre, men ikke for alle prosjekter er viktig å være oppmerksom på ytelsen, bruk alltid en god tilnærming, vil det være nyttig i tider med nød.
Det er mange online ressurser på optimalisering av jQuery, noen tips er allestedsnærværende, andre akademikere, andre synes selvmotsigende, så vi gjøre litt orden og den andre listen signerte også den direkte opplevelsen av beste praksis at vi ikke kan gi opp.

Bruk den nyeste versjonen av rammeverket

Ikke vær redd for å gå til den nye versjonen av jQuery er bakoverkompatibilitet garantert, og hver utgivelse bringer betydelige forbedringer i ytelse med omskriving av deler av kjernen og merkbare forbedringer i de mest brukte funksjonene. Bare én utgivelse til den neste for enkelte funksjoner av tiden snakker om henrettelser redusert til 50%. Ta en titt på illustrasjonen nedenfor:

Bruk snarveien til DOM Ready

I stedet for:

 



 $ (Document). Ready (funksjon () {/ * logikk * /})

 

spare noen byte ved å bruke snarveien:

 



 $ (Function () {/ * logikk * /});

 

Refererer til logikken vinduet lasten

Det er ikke nødvendig å skrive alt i dokumentet klar. Delegater av logikken å utføre lasting av vinduet. For eksempel kan binde klikke på en knapp på slutten av en lang skjema slappe av og vente på å bli definert.

 $ (Function () {



  



 / / # Logikken her







 });







 $ (Window). Load (funksjon () {



  



 $ ("ButtonID"). Klikk (funksjon () {



    



 / / # Denne logikken å binde knappen



  



 });







 });

Minificare scripts

Først foreslår jeg at du installerer på din Firefox (som addon Firebug ) og plugin på Google Chrome Speed ​​side som du finner her . Denne nyttige verktøy samt gi generelle råd for å forbedre ytelsen til siden din har en verdifull egenskap: minificata versjonen tilbyr alle scriptene som du finner inni. Den gjør det også for CSS og gir også optimaliserte versjoner av bildene, men la oss reflektere over vår tunge jQuery, legger jeg to screenshots nedenfor forklarer bedre enn tusen ord, hva du gjør:

Google side hastighet som det vises i Firebug:

Ved å klikke på lagre som minificata få versjonen av skriptet:

Minificare hver av skript på siden som du kan ta for å spare titalls KB å laste ned.

• <<
• 1
• 2
• >>