Hvordan få WordPress til å laste JavaScript lat for å øke hastigheten på sidegjengivelsen?

WordPressLat lasting av JavaScript for å øke hastigheten på sidegjengivelsesmetoder.

Hva er JavaScripts Defer-egenskap?

Alle har sikkert vært borti denne situasjonen:

Det er N skript i hodet, og når skriptene er lastet, blokkeres sidegjengivelsen, som vanligvis er tom.

Selvfølgelig kan vi komme rundt dette ved å sette skriptet i kildekoden i bunnteksten.

Noen komplekse utviklingsmiljøer kan imidlertid gjøre denne enkle oppgaven spesielt kompleks.

På dette tidspunktet kan vi bruke Defer-egenskapen, som er en relativt sjelden egenskap i JavaScript.

Du vil kanskje aldri bruke den, men etter å ha lest denne introduksjonen, er jeg sikker på at du ikke vil forlate den.

Hovedfunksjonen er å la skriptet analysere etter at hele siden er lastet, i stedet for å analysere det ved lasting, noe som gir full sidelasthastighet for skript som kun inneholder hendelsesutløst JavaScript.

Ja, hvis script-taggen har et defer-attributt, vil den bli utført etter parsing av HTML-siden selv om den er plassert i hodet, noe som ligner på å sette skriptet nederst på siden.

Selvfølgelig er bruken av forsinkelse også begrenset, vær vanligvis oppmerksom på 2 punkter:

1) Ikke kall opp document.write-kommandoen i en skriptblokk av deferred defer type;

• Fordi document.write vil produsere direkte utdataeffekt.

2) Ikke bruk globale variabler eller funksjoner i Defer-skript, inkludert skript for umiddelbar utførelse.

Legg til Defer-attributtet til skriptet som brukes i WordPress

Hvordan kan vi automatisk legge til Defer-attributtet i WordPress i skriptene som brukes av WordPress?

Vi kan legge til følgende kode i det gjeldende temaets functions.php-fil ▼

add_filter( 'clean_url', 'wpcwl_defer_script',11,1);
function wpcwl_defer_script( $url ){
if(strpos($url, '.js') === false){
return $url;
}

return "$url' defer='defer";
};

• Ovennevnte kode fungerer kun, ihtJavaScript-kode introdusert av WordPressvil være effektive.

forholdsregler

Direkte forhåndsvisningsadministrasjon kan vises tomt:

Hvis du bruker koden ovenfor, når du åpner forhåndsvisningsadministrasjonen i sanntid (Utseende → Tilpass), kan den vises tom, så bruk den etter behov.

Når forhåndsvisning i sanntid er nødvendig, kommenter koden ovenfor og slett den kommenterte koden etter at tilpasningen er fullført.

Eksempel på PHP-kommentarkode:

/*

这里是代码 

*/