Přejít k navigační liště

Zdroják » Zprávičky » Neblokující JavaScript

Neblokující JavaScript

Zprávičky JavaScript, Různé

Nálepky:

JavaScript je v prohlížečích implementován převážně jako jednovláknový interpret, což přináší některé nevýhody, z nichž nejviditelnější je nutnost čekat, pokud se někde provádí dlouhý výpočet. Starší prohlížeče navíc kdykoli narazily na <script>, tak zastavily provádění dalších operací, dokud se skript nestáhl a nevykonal. Moderní dokáží stahovat skripty paralelně a vykonat je ve správném pořadí. HTML5 přichází s atributem async, který říká prohlížeči, že má skript nahrát asynchronně, tj. podobným způsobem jako když je tag script vytvořen skriptem. Zajímavé informace k tomuto tématu jsou v článku What is a non-blocking script.

S pěkným nápadem přichází LABjs, neboli Loading and Blocking JavaScript. Tato knihovna, zjednodušeně řečeno, přidává „syntaktický cukr“ a balí nevzhledný zmatek statických elementů script a dynamicky vytvářených a nahrávaných elementů script do úhledné podoby. Namísto

<script src="framework.js"></script>
<script src="plugin.framework.js"></script>
<script src="myplugin.framework.js"></script>
<script src="init.js"></script>

tak můžeme s LABjs psát:

<script>
   $LAB
   .script("framework.js").wait()
   .script("plugin.framework.js")
   .script("myplugin.framework.js").wait()
   .script("init.js");
</script>

Výše uvedený zápis spustí neblokující nahrávání framework.js, který musí být vykonán jako první. Na něm závisí skripty plugin a myplugin, které mohou být staženy a vykonány v libovolném pořadí, nejsou na sobě závislé. A až jako poslední musí být spuštěn skript init. Vše je jasné a pochopitelné ze zápisu. LABjs nabízí i další možnosti, jako např. zavolat callback funkci poté, co jsou skripty načtené (ve funkci wait).

Komentáře

Subscribe
Upozornit na
guest
6 Komentářů
Nejstarší
Nejnovější Most Voted
Inline Feedbacks
View all comments
loki

Inu, proc to delat podle standardu(html5), kdyz to jde slozite pres uzasny framework. Vysledny kod je hnusny a nestandardni…

jos

HTML5 je už standard?

pozortucnak

jednovláknový?
A co potom tedy bude toto?

setTimeout( function(){/* ...NEJAKÁ ŠÍLENOST... */}, 0);
pozortucnak

nejaký divný, funkce setTimeout by přece NĚMĚLA zastavit provádení scriptu…

Enum a statická analýza kódu

Mám jednu univerzální radu pro začínající programátorty. V učení sice neexistují rychlé zkratky, ovšem tuhle radu můžete snadno začít používat a zrychlit tak tempo učení. Tou tajemnou ingrediencí je statická analýza kódu. Ukážeme si to na příkladu enum.