Re: which is faster target.getElementsByTagName or target.firstChild / nextSibli

Hi Rebecca,

Ryan was right in suggesting a loop.  Still, you're results are going to
be random if you use Date.getMilliseconds() since it only returns the ms
elapsed in the current second.  The suggested Date.getDate() isn't going
to work, either (as you already determined).

Just subtract the date objects like this:

var dStart = new Date ();

for (var 1 = 0; i < 1000;  i++) {
   // do your magic here
}

var dEnd = new Date();
var nTimeDiff = dEnd - dStart;
alert('Execution time: ' + nTimeDiff + 'ms');

Regards,

-- John Hann

--- In [email protected], "Ryan Hicks" <ryan.c.hicks@...> wrote:
>
> Well, I think the Gecko timing makes sense, but I've no idea what IE
thinks
> its doing. :)  It is interesting how they execute it differently, but
it's
> even more interesting how IE is sooo much faster than Gecko.
>
> It is possible that the getElementsByTagName could take longer because
it
> needs to examine ALL child nodes of the UL, versus the child/sibling
option
> where only the immediate children are examined.  But I've always
thought
> that Gecko used more nodes for text than IE...
>
> And to Gerry's point, the child/sibling option would indeed look at
all
> children, even if they aren't LIs.  But if the markup is good what
> childnodes would we expect other than LIs under a UL?  That's not
always a
> safe presumption, I suppose.
>
> Rebecca, you may want to try Moran's excellent suggestion to iterate
through
> these 1000 times each and put the timer outside of the iteration. 
That'll
> magnify the real execution time and hide some of the randomness.
>
> Thanks for reporting your results!
>
> -ryan
>
> -----Original Message-----
> From: [email protected] [mailto:[email protected]] On
Behalf Of
> becs027
> Sent: Thursday, April 06, 2006 7:01 PM
> To: [email protected]
> Subject: [wdf-dom] Re: which is faster target.getElementsByTagName or
> target.firstChild / nextSibli
>
> Thanks. I get weird results, and had to change the timediff bit a
> little to get a result, I used:
>
> var nTimeDiff = dEnd.getMilliseconds() - dStart.getMilliseconds();
>
> In Firefox 1.5:
> getElementsByTagName took 313ms
> firstChild / nextSibling took 516ms
>
> In Internet Explorer 6:
> getElementsByTagName took 265ms
> firstChild / nextSibling took 156ms
>
> So looks like it depends on the browser. My function is only for IE
> which helps :)
>
> Cheers
> Rebecca
>
> --- In [email protected], "Ryan Hicks" ryan.c.hicks@ wrote:
> >
> > Rebecca,
> >
> >  My vote would likely be for the getElementsByTagName, simply
> because the
> > conditional in the other option would have to reference the DOM an
> > additional time for each iteration.
> >
> >  However, votes aside, you can always test the amount of time your
code
> > takes to execute by doing something like the following:
> >
> >  var dStart = new Date();
> >
> >  ...chunk of code...
> >
> >  var dEnd = new Date();
> >  var nTimeDiff = dEnd.getDate() - dStart.getDate();
> >  alert('Execution time: ' + nTimeDiff + 'ms');
> >
> >  Without having your actual DOM, I can't test these two scenarios to
> verify
> > if my vote is correct.  If you find that this technique gets you an
> answer,
> > I'd love to know which version wins out!
> >
> > -ryan
> >
> > -----Original Message-----
> > From: [email protected] [mailto:[email protected]] On
> Behalf Of
> > becs027
> > Sent: Thursday, April 06, 2006 4:44 PM
> > To: [email protected]
> > Subject: [wdf-dom] which is faster target.getElementsByTagName or
> > target.firstChild / nextSibling
> >
> > Hi all,
> >
> > I'm doing an onload script to add rollover behaviour to list items
> > (dropdown menu style) for IE, and want to check which of two ways is
> > faster.
> >
> > ------------------------------------------------
> >
> > Option 1 - add the behaviour using target.getElementsByTagName:
> >
> > if (document.getElementById('navigation')) {
> >      var target = document.getElementById('navigation');
> >      var targetbuttons = target.getElementsByTagName('li');
> >
> >      for (var i = 0; i < targetbuttons.length; i++) {
> >   targetbuttons[i].onmouseover = rollover;
> >   targetbuttons[i].onmouseout = rolloff;
> >             }
> >  }
> >
> > ------------------------------------------------
> >
> > Option 2 - add the behaviour with a while loop using firstChild,
> > nextSibling:
> >
> > if (document.getElementById('navigation')) {
> >                 var target = document.getElementById('navigation');
> >                 var targetbutton = target.firstChild;
> >
> >                 while (targetbutton) {
> >                     targetbutton.onmouseover = rollover;
> >                     targetbutton.onmouseout = rolloff;
> >                     targetbutton = targetbutton.nextSibling;
> >                 }
> >             }
> >
> > ------------------------------------------------
> >
> > Thanks :)
> > Rebecca
> >
> >
> >
> >
> >
> > Unsubscribe
> > [email protected]
> >
> > List info
> > http://www.quirksmode.org/dom/list.html
> > Yahoo! Groups Links
> >
>
>
>
>
>
>
>
> Unsubscribe
> [email protected]
>
> List info
> http://www.quirksmode.org/dom/list.html
> Yahoo! Groups Links
>



[Non-text portions of this message have been removed]



Unsubscribe
[email protected]

List info
http://www.quirksmode.org/dom/list.html 
Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/wdf-dom/

<*> To unsubscribe from this group, send an email to:
    [email protected]

<*> Your use of Yahoo! Groups is subject to:
    http://docs.yahoo.com/info/terms/