Hvordan får man WordPress til at lade JavaScript til doven for at fremskynde sidegengivelsen?

WordPressDoven indlæsning af JavaScript for at fremskynde sidegengivelsesmetoder.

Hvad er JavaScripts Defer-egenskab?

Alle har sikkert stødt på denne situation:

Der er N scripts i hovedet, og når scriptet er indlæst, vil det blokere for sidegengivelsen, som normalt er tom.

Selvfølgelig kan vi komme uden om dette ved at sætte scriptet i kildekoden i sidefoden.

Nogle komplekse udviklingsmiljøer kan dog gøre denne simple opgave særlig kompleks.

På dette tidspunkt kan vi bruge egenskaben Defer, som er en relativt sjælden egenskab i JavaScript.

Du bruger det måske aldrig, men efter at have læst denne introduktion, er jeg sikker på, at du ikke vil forlade den.

Dens hovedfunktion er at lade scriptet parse, efter at hele siden er indlæst, i stedet for at parse det ved indlæsning, hvilket giver fuld sideindlæsningshastighed for scripts, der kun indeholder hændelsesudløst JavaScript.

Ja, hvis script-tagget har en defer-attribut, vil det blive udført efter parsing af HTML-siden, selvom det er placeret i hovedet, hvilket svarer til at placere scriptet nederst på siden.

Selvfølgelig er brugen af ​​forsinkelse også begrænset, vær normalt opmærksom på 2 punkter:

1) Kald ikke document.write-kommandoen i en scriptblok af deferred defer type;

• Fordi document.write vil producere direkte output-effekt.

2) Brug ikke globale variabler eller funktioner i Defer-scripts, inklusive scripts til øjeblikkelig eksekvering.

Tilføj attributten Defer til det script, der bruges i WordPress

Hvordan kan vi automatisk tilføje Defer-attributten i WordPress til de scripts, der bruges af WordPress?

Vi kan tilføje følgende kode til det aktuelle temas 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";
};

• Ovenstående kode virker kun iflgJavaScript-kode introduceret af WordPressvil være effektiv.

注意 事项

Live Preview Management vises muligvis tomt:

Hvis du bruger ovenstående kode, når du åbner forhåndsvisningsstyringen i realtid (Udseende → Tilpas), vises den muligvis tom, så brug den efter behov.

Når forhåndsvisning i realtid er påkrævet, skal du kommentere ovenstående kode og slette den kommenterede kode, efter tilpasningen er fuldført.

PHP kommentar kode eksempel:

/*

这里是代码 

*/