Cum să Amânați Analiza JavaScript în WordPress
Este posibil să fi comparat viteza site-ului dvs. WordPress numai pentru a afla că trebuie să „eliminați JavaScript care blochează redarea”, „amânați analiza Javascript” sau „eliminați resursele de blocare a redării”, inclusiv fișierele legate de WordPress.
Acest lucru vă poate face să vă întrebați: „Cum pot face ca JavaScript să se încarce mai repede? Ce legătură au scripturile cu viteza site-ului meu, oricum? ”
Pe scurt, aceasta înseamnă că trebuie să modificați când fișierele Javascript se execută sau se încarcă pentru a accelera site-ul dvs. Cu alte cuvinte, trebuie să amânați analiza JavaScript.
Puteți amâna încărcarea fișierelor JavaScript, prin cod, cum ar fi cu JavaScript defer. Sau puteți utiliza un plugin precum WP Rocket pentru a rezolva problema în siguranță în câteva clicuri.
În acest articol, vom vedea mai multe detalii despre cum să amânați analiza JavaScript, precum și a încărcării amânate a JavaScript-ului și a modului de a face acest lucru cu codul, precum și cu pluginul WP Rocket. Voi răspunde și la întrebarea „Ce este amânarea JavaScript?” astfel încât să vă puteți accelera site-ul WordPress și să rezolvați avertismentele de diagnosticare.
Ce Înseamnă a Amâna Analiza JavaScript
Pentru a înțelege ce înseamnă amânarea analizei JavaScript sau amânarea încărcării JavaScript (WordPress, aplicații web și alte tipuri de site-uri web incluse) este esențial să obțineți o actualizare a ceea ce este prima analiză.
Un Memento Rapid la Analiză
Analiza este procesul de conversie a codului care poate fi citit de om, în acest caz JavaScript, într-un limbaj pe care un computer îl poate înțelege. În acest fel, funcțiile pe care ar trebui să le îndeplinească codul dvs. pot face exact asta.
De asemenea, puteți indica într-un fișier că doriți să încărcați unul sau mai multe fișiere JavaScript separate când rulează fișierul principal.
Acest lucru permite unui site obișnuit cu unele texte și imagini să aibă dintr-o dată capabilități mult mai robuste pe care le puteți codifica cu JavaScript.
Se Încarcă Mai Multe Fișiere JavaScript
Într-un fișier de site web, când setați fișiere JavaScript pentru încărcare, există două tipuri principale:
- Critice – Fișiere JavaScript care sunt esențiale pentru încărcare înainte de toate celelalte tipuri enumerate mai jos, deoarece sunt cruciale pentru funcționarea paginii.
- Non-Critic – Alte fișiere JavaScript care trebuie încărcate pe o pagină, dar care nu sunt considerate esențiale.
Există și opțiunea inline. Aceasta se referă la JavaScript care este livrat în linie într-un fișier HTML, de exemplu, în loc să aibă un fișier JavaScript separat care este apelat în fișierul principal.
Amânați Încărcarea JavaScript: WordPress și alte Site-uri Web
Când indicați în cod că doriți să încărcați fișiere JavaScript, puteți alege când fișierele sunt analizate și chiar și atunci când sunt încărcate. În acest fel, puteți alege să executați mai întâi fișiere JavaScript critice și să întârziați executarea fișierelor non-critice, pe care le puteți seta să ruleze după ce conținutul principal de pe pagină a fost afișat.
Acest proces, înseamnă amânarea analizei JavaScript, cel puțin atunci când executarea fișierelor JavaScript este întârziată.
Dacă amânați încărcarea JavaScript, WordPress și a altor tipuri de site-uri web incluse, ar însemna că întârziați încărcarea (și apoi executarea) fișierelor până după afișarea restului paginii.
Amânați Analiza JavaScript
Acest lucru poate fi confuz atunci când încercați să aflați ce înseamnă să amânați analiza JavaScript pentru site-ul dvs. WordPress. Acest lucru este valabil mai ales dacă vedeți recomandările „eliminați JavaScript care blochează redarea”, „amânați analiza JavaScript” sau ca recomandare „eliminați resursele de blocare a redării” în PageSpeed Insights, GTMetrix sau instrumente similare Google.
Vă poate ajuta să vă gândiți la site-ul dvs. ca la un tort. De obicei, are un blat de tort pe fund, apoi un strat de glazură urmat de un alt strat de blat, apoi acoperit cu glazură.
Un desert bine stratificat ca acesta poate fi văzut ca un site WordPress care încarcă conținut și JavaScript rapid și eficient, deoarece ați optat pentru amânarea analizei JavaScript.
Vă puteți gândi la glazură ca la fișiere JavaScript critice și la umplere ca la fișiere JavaScript non-critice.
Dacă ați construit tortul pentru a avea două straturi de tort direct unul peste celălalt, atunci puneți toată înghețata deasupra, în loc să fie între straturi, este nevoie de mai mult timp pentru a ajunge la partea de tort atunci când săpați în el cu o furculiță .
De asemenea, este dezechilibrat și lipsit de apetit din această cauză.
Acest lucru este similar pentru site-urile WordPress. Dacă toate fișierele JavaScript se încarcă sau se execută mai întâi, înainte ca orice altceva să încetinească viteza paginii. Se termină prin a dura mult timp ca utilizatorii să vadă mult sau orice conținut.
Acest sentiment neplăcut vine sub forma dezangajării în ceea ce privește site-ul dvs. WordPress.
În schimb, dacă mutați o parte din glazură (sau fișiere JavaScript) pentru a apărea mai târziu, tortul sau site-ul devine mult mai antrenant după aceea.
Acesta ar fi un exemplu de a arăta, de ce este bine să amânați analiza JavaScript sau pentru a amâna încărcarea fișierelor JavaScript WordPress.
Eliminați JavaScript Render-Blocking
Dacă vedeți „elimină JavaScript care blochează redarea” sau „elimină resursele care blochează redarea” ca rezultat al instrumentului PageSpeed Insights despre site-ul dvs. WordPress. Atunci trebuie să știți că trebuie să amânați analiza JavaScript sau să amânați încărcarea fișierelor JavaScript sau a fișierelor CSS în unele cazuri.
De ce Este Important să Încărcați JavaScript Mai Repede
Poate că totul este bine, dar de ce ar fi o astfel de problemă încărcarea sau executarea unei grămezi de fișiere JavaScript către începutul încărcării paginii? Motivul este că, în mod implicit, încărcarea fișierelor JavaScript va întrerupe analiza HTML.
Acest lucru face ca browserul să aștepte pentru a încărca restul paginii, cum ar fi conținut, inclusiv text și imagini.
Dacă încărcați toate fișierele JavaScript înainte de orice alt conținut sau majoritatea și nu ați amânat analiza JavaScript, este posibil ca site-ul dvs. să nu afișeze prea mult din nimic. Acest lucru ar putea continua câteva secunde, deoarece încărcarea unei pagini este întârziată.
Când vine vorba de o clasare superioară în rezultatele căutării, fiecare secundă contează.
Cu cât pagina dvs. durează mai mult să se încarce, cu atât este mai puțin probabil ca site-ul dvs. să se claseze bine.
În plus, dacă încărcați fișiere JavaScript non-critice înainte de lucruri cruciale de pe pagină, cum ar fi conținutul și concentrarea dvs. principală, cum ar fi textul, experiența utilizatorului site-ului dvs. scade și scorurile dvs. Core Web Vitals vor avea de suferit. Abordarea problemelor JavaScript este, de fapt, o modalitate bună de a optimiza First Input Delay și performanța Largest Contentful Paint.
Dacă forțezi oamenii să aștepte câteva secunde înainte să poată citi ceva util, aceștia ar putea să-și piardă interesul și să plece de pe site-ul tău.
Cercetările Google au arătat chiar că o întârziere cu o secundă a timpilor de încărcare pentru site-urile mobile poate reduce ratele de conversie cu până la 20%. Ca să nu mai vorbim că fiecare secundă suplimentară creează o altă scădere a conversiilor cu 20%.
De aceea, Google recomandă ca pagina dvs. să încarce 90% din conținutul său vizual principal în cel mult 100 ms. În caz contrar, site-ul dvs. își va pierde locul în rezultatele căutării.
De aceea, vă sugerează să amânați analiza JavaScript sau să amânați încărcarea fișierelor JavaScript pentru a rezolva problemele rezultate în urma diagnosticării site-ului WordPress și anume „eliminați resursele de blocare a redării” în PageSpeed Insights.
Cum să Amânați Analiza JavaScript și Să Faceți Fișierele JS Mai Rapide
Amânând analiza fișierelor JavaScript, veți face ca JavaScript să se încarce mai repede – ceea ce este excelent pentru a spori performanța site-ului dvs. WordPress. Există trei modalități principale de a face acest lucru în WordPress.
1.Utilizați Atributele Defer sau Async
Pentru a răspunde la întrebarea „Ce este JavaScript Defer și Async?” trebuie să apelați la HTML 5.
Când încercați să amânați analiza JavaScript, puteți utiliza atributele booleene „amânați” și „asincronizați” pentru eticheta scriptului în HTML 5. Când sunt setate într-un fișier care apelează fișiere JavaScript, acestea se vor încărca atunci când este indicat.
Care este Atributul Async?
Atributul asincron poate fi folosit pentru a încărca fișiere JavaScript în mod asincron, ceea ce înseamnă că restul paginii poate continua și se poate încărca, neîntrerupt, pe măsură ce fișierele JavaScript se execută în același timp.
Iată un exemplu despre modul în care ați utiliza atributul async boolean:
<script async src="/path/to/file/script.js"> </script>
Asigurați-vă că schimbați /path/to/file/script.js la numele real și calea fișierului dvs. JavaScript extern.
Ce este Atributul de Amânare?
Atributul de amânare, pe de altă parte, poate fi utilizat pentru a avea fișiere JavaScript executate numai după ce s-a încărcat restul documentului. Deși, aceste fișiere sunt încă încărcate asincron.
Fișierele sunt executate în aceeași ordine în care au fost apelate.
Mai jos este un exemplu de bază al atributului de amânare booleană în acțiune pentru amânarea analizei JavaScript:
<script defer src="/path/to/file/script.js"> </script>
Din nou, asigurați-vă că actualizați /path/to/file/script.js la locația fișierului dvs. real.
2.Utilizarea Unui Plugin Pentru Amânarea în Siguranță a Analizei JavaScript în WordPress
Dacă nu doriți să adăugați codul manual, aveți nevoie pentru a amâna analiza JavaScript sau pentru a amâna încărcarea fișierelor JavaScript, atunci puteți utiliza un plugin.
Trucul este că multe opțiuni de acolo vă pot distruge site-ul. Unul dintre motive este că trebuie să decideți manual ce fișiere să amânați. Puteți amâna analiza fișierelor JavaScript care sunt critice, ceea ce ar cauza erori.
De asemenea, are avantajul suplimentar de a ajuta site-ul dvs. să se încarce mai repede.
După instalarea pluginului, totul este deja configurat pentru dvs. și puteți amâna fișierele. Există o opțiune pentru a amâna încărcarea fișierelor JavaScript în loc să vă permită doar să amânați analiza JavaScript.
Accesați Setări> WP Rocket.
Apoi, în meniul WP Rocket, faceți clic pe fila Optimizare fișiere.
Sub Fișiere JavaScript, bifați caseta Încărcați JavaScript amânat. De asemenea, vă recomandăm să bifați caseta Mod sigur pentru jQuery care apare dinamic sub prima opțiune.
Dacă doriți să dezactivați modul sigur, asigurați-vă că testați modificările pe un site de test înainte de a alege opțiunea mod sigur pe un site de producție.
În cele din urmă, faceți clic pe Salvați modificările din partea de jos a paginii.
Dacă, dintr-un anumit motiv, decideți că doriți să renunțați la modificare, puteți debifa caseta Încărcare JavaScript amânată și faceți clic pe Salvare modificări. Apoi, ștergeți memoria cache a site-ului.
3.Opțiuni Alternative de Codificare Pentru Amânarea Analizei JavaScript
În afară de acestea, puteți amâna încărcarea fișierelor JavaScript sau amânarea analizei JavaScript adăugând cod cu filtrul „script_loader_tag” în fișierul function.php. Asigurați-vă că aveți o temă copil instalată și activată, mai întâi, apoi adăugați codul în fișierul functions.php al temei copil.
În acest fel, codul nu va fi șters atunci când WordPress Core sau Tema dvs. sunt actualizate.
In Concluzie
Până acum, știți răspunsurile la întrebările „Cum pot face ca JavaScript să se încarce mai repede?” și „Ce este amânarea JavaScript?”
De asemenea, știți cum să amânați analiza JavaScript sau să amânați încărcarea fișierelor JavaScript. Nu numai asta, dar puteți rezolva „eliminați JavaScript care blochează redarea” și „eliminați resursele de blocare a redării” rezultatele site-ului WordPress în instrumentele de diagnosticare pentru viteza de încărcare a paginilor.
Economisiți timp și lăsați-l pe WP Rocket să facă treaba pentru dvs.!
Ați putut amâna cu succes analiza JavaScript sau amânarea încărcării fișierelor JavaScript? Ați putut rezolva avertismentul PSI asupra site-ului WordPress „eliminați resursele de blocare a redării”? Dacă da, spuneți-ne și nouă în comentariile de mai jos!
