DOM vs window betöltődés

prototypeA prototype js keretrendszer sok kellemes meglepetéssel szolgált már eddig a számomra, de most találtam valamit ami megnyerte a kellemes meglepetések 2007-es versenyét. Ez márpedig az, hogy az események namespace-szel rendelkeznek.

Oldalbetöltődési fázisok

Amikor a böngészőnk kap egy html documentumot egy webszervertől, akkor több fázison megy keresztül míg végül teljesen életre kel. Előszőr jön ugye a http fejléc aztán maga a dokumentum. Jó esetben a dokumentum fejlécben szerepelnek a JavaScript fileokra való hivatkozások. A böngésző a html dokumentumot a forrásban meglévő sorrend szerint értékel ki, tehát a dokumentumunk testének megérkezése előtt már kiértékeli a JavaScripteket. Mivel ebben a pillantban még nem létezik a DOM vagy ha létezik is teljesen üres, eddig általában a DOM-mal kapcsolatos JavaScript függvényeinket később kell kiértékelni.

Window loaded

Erre ezidáig az volt a megoldás, hogy a window objektum loaded eseményéhez kötöttünk egy eseményfigyelőt az alábbi minta szerint.

Event.observe(window, 'load', objektumom.init);

Ez a megközelítés teljesen működőképes, de nem éppen ideális. Miért? Azért mert a window objektumon akkor következik be a loaded esemény amikor a teljes dokumentum minden elemével együtt betöltődött. Ez azt jelenti, hogy az összes kép, és minden egyéb alkatrész. Ez pedig jóval azután van, hogy maga a DOM létrejön és felépül. Vagyis nekünk az lenne az ideális ha az objektumom.init metódus a DOM felépülése után közvetlenül futna le.

dom:loaded

A prototype 1.6 sok újdonsága közül számomra az volt a legelsőként használt lehetőség, hogy az események namespace-szel rendelkeznek, és a dom:loaded esemény pont arra szolgál amire szükségünk van. Így a fenti kódrészletünket egyszerűen csak az alábbira kell cserélnünk és már el is értük a kívánt hatást.

document.observe('dom:loaded',objektumom.init);

Vélemény, hozzászólás?

Az email címet nem tesszük közzé. A kötelező mezőket * karakterrel jelöljük.