Wéi maachen ech WordPress lazy Laden JavaScript fir Säit Rendering ze beschleunegen?

WordPressLazy Luede vu JavaScript fir Säit Rendering Methoden ze beschleunegen.

Wat ass JavaScript's Defer Property?

Jiddereen huet wahrscheinlech dës Situatioun begéint:

Et gi N Scripten am Kapp, a wann d'Skripte gelueden sinn, gëtt d'Säitrendering blockéiert, wat normalerweis eidel ass.

Natierlech kënne mir dëst ëmgoen andeems Dir de Skript am Quellcode an de Fousszeil setzt.

Wéi och ëmmer, e puer komplex Entwécklungsëmfeld kënnen dës einfach Aufgab besonnesch komplex maachen.

Zu dësem Zäitpunkt kënne mir d'Defer Eegeschafte benotzen, wat eng relativ rar Immobilie a JavaScript ass.

Dir kënnt et ni benotzen, mee no dëser Aféierung liesen, Ech sécher Dir wäert et net verloossen.

Seng Haaptfunktioun ass de Skript ze parséieren nodeems d'ganz Säit gelueden ass, anstatt se beim Laascht ze parséieren, wat eng voll Säit Luedegeschwindegkeet fir Skripte ubitt, déi nëmmen Event-ausléist JavaScript enthalen.

Jo, wann de Skript-Tag en Defer-Attribut huet, gëtt et nom Parsing vun der HTML-Säit ausgefouert, och wann et an de Kapp gesat gëtt, wat ähnlech ass wéi de Skript um Enn vun der Säit ze setzen.

Natierlech ass d'Benotzung vu Verzögerung och limitéiert, normalerweis oppassen op 2 Punkten:

1) Do not call the document.write command in a deferred defer type script block;

• Well document.write wäert direkten Ausgangseffekt produzéieren.

2) Benotzt keng global Variablen oder Funktiounen an Defer Scripten, inklusiv all direkt Ausféierungs Scripten.

Füügt den Defer Attribut un de Skript, deen a WordPress benotzt gëtt

A WordPress, wéi kënne mir automatesch den Defer Attribut op d'Skripte vun WordPress addéieren?

Mir kënnen de folgende Code fir d'aktuell Thema's functions.php Datei ▼

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";
};

• Den uewe genannte Code funktionnéiert nëmme, lautJavaScript Code agefouert vu WordPresswäert effektiv sinn.

Precautiounen

Live Preview Management kann eidel weisen:

Wann Dir den uewe genannte Code benotzt, wann Dir d'Echtzäit Virschauverwaltung opmaacht (Ausgesinn → Customize), kann et eidel weisen, also benotzt se w.e.g. wéi passend.

Wann Echtzäit Virschau Gestioun erfuerderlech ass, kommentéiert den uewe genannte Code eraus a läscht de kommentéierte Code nodeems d'Personaliséierung fäerdeg ass.

PHP Kommentar Code Beispill:

/*

这里是代码 

*/