Ako urobiť WordPress lenivé načítanie JavaScriptu, aby sa urýchlilo vykresľovanie stránok?

WordPressLenivé načítanie JavaScriptu na zrýchlenie metód vykresľovania stránok.

Čo je vlastnosť Defer JavaScriptu?

Každý sa pravdepodobne stretol s touto situáciou:

V hlave je N skriptov a keď sa skript načíta, zablokuje vykresľovanie stránky, ktoré je zvyčajne prázdne.

Samozrejme, môžeme to obísť tak, že skript vložíme do zdrojového kódu do päty.

Niektoré zložité vývojové prostredia však môžu túto jednoduchú úlohu mimoriadne skomplikovať.

V tomto bode môžeme použiť vlastnosť Defer, ktorá je v JavaScripte pomerne zriedkavá vlastnosť.

Možno ho nikdy nepoužijete, no po prečítaní tohto úvodu som si istý, že ho neopustíte.

Jeho hlavnou funkciou je nechať skript analyzovať po načítaní celej stránky namiesto analýzy pri načítaní, čo poskytuje plnú rýchlosť načítania stránky pre skripty, ktoré obsahujú iba JavaScript spúšťaný udalosťou.

Áno, ak má značka skriptu atribút odložiť, vykoná sa po analýze stránky HTML, aj keď je umiestnená v hlavičke, čo je podobné, ako keby ste skript umiestnili na spodok stránky.

Samozrejme, použitie oneskorenia je tiež obmedzené, zvyčajne venujte pozornosť 2 bodom:

1) Nevolajte príkaz document.write v bloku skriptu typu odloženého odloženia;

• Pretože document.write vytvorí priamy výstupný efekt.

2) Nepoužívajte globálne premenné alebo funkcie v skriptoch Defer, vrátane skriptov na okamžité spustenie.

Pridajte atribút Defer do skriptu používaného vo WordPress

Ako môžeme vo WordPress automaticky pridať atribút Defer do skriptov používaných WordPress?

Do súboru functions.php ▼ aktuálnej témy môžeme pridať nasledujúci kód

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

• Vyššie uvedený kód funguje iba podľaJavaScript kód zavedený WordPressombudú účinné.

注意 事项

Správa živého náhľadu môže byť prázdna:

Ak použijete vyššie uvedený kód, keď otvoríte správu náhľadov v reálnom čase (Vzhľad → Prispôsobiť), môže sa zobraziť prázdny, preto ho použite podľa potreby.

Ak je potrebná správa ukážky v reálnom čase, zakomentujte vyššie uvedený kód a po dokončení prispôsobenia vymažte komentovaný kód.

Príklad kódu komentára PHP:

/*

这里是代码 

*/