DOM/DHTML prestatie verschillen

[Verwijderd]

Ik heb een enorm menu gemaakt in HTML. Het bestaat slechts uit unordered lists:

XML:

<ul>
    <li><a href="123.html">label</a></li>
</ul>

.
Submenu's gaan als volgt:

XML:

<ul>
    <li><a href="123.html">label</a>
        <ul>
            ...
        </ul>
    </li>
</ul>

De nesting is op dit moment maximaal 6 niveau's en er zijn 590 <ul>-elementen en 1500 <li>-elementen.

In de onload hang ik aan alle <a>-tags voor onclick een functie. Deze, je raadt het al, opent een onderliggende <ul> (elem.style.display = "block"). De link zelf laadt in een ander frame het document (123.html bijvoorbeeld).

Het menu draait vlot en werkt naar behoren in IE, Firefox en Opera. Maar het geheel moet op CD-ROM en dan duurt het plotseling heel lang voordat het menu toont. Dus na de klik soms wel 2 seconden. Ik kan dit niet verklaren, want mij lijkt dat de browser de menu-pagina geheel in het geheugen heeft geladen incl. javascript, en dat er niets in de weg staat om het DHTML proces net zo vlot te laten verlopen als lokaal of van de webserver.

Kan iemand dit verklaren?

[André]

Op het moment dat jij op de a klikt opent eerst de pagina "123.html" en dan pas opent de onderliggende ul. Het laden van "123.html" is de vertragende factor dus...dit wil op een cd wel vaker vertragen aangezien de cd eerst weer op moet spinnen.

[Michali]

Een mogelijkheid is om ook in die onload functie die href de waarde "javascript://" te geven en dan na het uitklappen van het menu de actie location='waarde_uit_href'; uit te voeren. Dan is je menu al uitgeklapt en wordt daarna pas de pagina geladen.

[Verwijderd]

Dat dacht ik ook. Maar de reden dat ik twijfel is omdat de functie zelf eerst het 'DHTML gebeuren' afrondt, en daarna pas:

JavaScript:

return true;

zodat de link ook daadwerkelijk de pagina laadt. Ik zou denken dat de browser niet eens weet of ie de pagina moet gaan laden voordat ie weet wat de return is van de onclick behavior.

Deze behaviour voeg ik zo toe:

JavaScript:

// binnen for loop voor elke <a>-tag:
elem.onclick = showHideMenu;

[ Voor 13% gewijzigd door Verwijderd op 28-10-2005 15:49 ]

[Michali]

Als je false returned laad de pagina niet bedoel je? Volgens mij heeft onclick geen effect op de href of wel?

[crisp]

Michali schreef op vrijdag 28 oktober 2005 @ 16:37:
Als je false returned laad de pagina niet bedoel je? Volgens mij heeft onclick geen effect op de href of wel?

Als je vanuit een DOM0 eventhandler false returned wordt de default actie (in het geval van een anchor het uitvoeren van de href) gecancelled.

[Verwijderd]

crisp schreef op vrijdag 28 oktober 2005 @ 17:32:
[...]

Als je vanuit een DOM0 eventhandler false returned wordt de default actie (in het geval van een anchor het uitvoeren van de href) gecancelled.

Precies! Dan is het toch raar dat het script langzaam wordt als het van CD draait? Want pas wanneer de functie een return waarde geeft (op het laatst) wordt de pagina geladen. Dus lijkt mij dat alle DHTML daarvoor gewoon net zo snel moet gaan??