Thanks for updating the speed test Andrew, the test is a really useful resource. The addition of iphone results were or particular interest.
With innerHTML being quicker/more intuitive/less prone to error we seem to have that rarest of occasions a win/win situation. On Dec 24, 9:59 pm, Andrew Hedges <[email protected]> wrote: > By the way, I've updated the innerHTML versus DOM APIs speed test > using PPK's method. See the new version at the same old URL: > > http://andrew.hedges.name/e/innerhtml/ > > On Dec 25, 7:08 am, Andrew Hedges <[email protected]> wrote: > > > Hi Kevin, > > > Yes, there are problems with my innerHTML versus DOM test. However, > > using Array join() to concat the strings is actually much faster than > > using += over and over again, so that's not one of them. The test > > isn't perfect, but it has been my experience that creating a DOM > > fragment and attaching nodes to it, then attaching the whole lot to > > the DOM tree is, for all practical purposes, as fast as innerHTML. > > Personally, I almost always use innerHTML these days for the sake of > > convenience. > > > Regards, > > -Andrew > > > On Dec 23, 11:22 pm, toriaezunama <[email protected]> wrote: > > > > Having just read this > > > http://www.quirksmode.org/blog/archives/2009/08/when_to_read_ou.html > > > article and taking a look at the code from the original article I have > > > feeling that the results are incorrect. > > > > I had noticed when running the tests that although the DOM test with > > > 1000 runs reported 87ms, the time from pressing the button to start > > > the test and the results being shown was more in the order of 4 > > > seconds. I think this article explains why. > > > > Right now i don't have access to my iphone or mac so cannot verify any > > > of this but thought this might be of interest > > > Cheers > > > > On Dec 22, 4:20 pm, Kelvin Wu <[email protected]> wrote: > > > > > Sorry I must correct myself, I just took a look at its test code, the > > > > innerhtml test code is in a unusual or extreme way, it pushes strings > > > > into > > > > array, then join array. In fact, in the real world, innerHTML is moe > > > > often > > > > used to concatenate a string by something like innerHTML += "xxx"; > > > > re-write > > > > the test code by this way, the result is much much faster than DOM. > > > > > On 2009-12-23, Kelvin Wu <[email protected]> wrote: > > > > > > thanks for the link, i tested it too, on nokia e71, which is webkit > > > > > engine > > > > > too, the innerhtml crashed nokia's browser... that completely > > > > > overturned my > > > > > previous thought. > > > > > > On 2009-12-22, toriaezunama <[email protected]> wrote: > > > > > >> This site has a benchmark comparing the use of innerHTML vs DOM > > > > >> manipulation > > > > >>http://andrew.hedges.name/experiments/innerhtml/ > > > > > >> I got the following results on an iPodTouch > > > > >> # of times time ms > > > > >> innerHTML 10 32 > > > > >> 100 2090 > > > > >> 1000 Took too long to run > > > > >> DOM 10 1 > > > > >> 100 12 > > > > >> 1000 87 > > > > > >> Although the test isn't perfect - for example: every created div is > > > > >> the same. Not a very real world situation - the results do prove > > > > >> interesting. > > > > > >> Hope this helps > > > > > >> On Dec 22, 3:02 am, Kelvin Wu <[email protected]> wrote: > > > > >> > Hi, > > > > > >> > A little bit off tipoc, not related to iUI but I am thinking of the > > > > >> question > > > > >> > about Javascript performance, especially on mobile phone. > > > > > >> > To write HTML code in your Javascript, you can write DOM directly > > > > >> > such > > > > >> as: > > > > > >> > var cellTitle = document.createElement("td"); > > > > >> > cell.className = "TableCell3"; > > > > >> > var labelTitle = document.createElement("lable"); > > > > >> > labelTitle.className = "LabelTitle"; > > > > >> > labelTitle.innerHTML = title; > > > > >> > cellTitle.appendChild(labelTitle); > > > > >> > rowTitle.appendChild(cellTitle); > > > > > >> > Or simply filling in innerHTML: > > > > > >> > root.innerHTML += "<td class=TableCell3><lable class=LabelTitle>" + > > > > >> title + > > > > >> > "</lable></td>"; > > > > > >> > The above two work exactly same. The first one looks more > > > > >> > "professional" > > > > >> > while I personally feel that the second one could be much faster > > > > >> > and > > > > >> less > > > > >> > CPU usage (less battery consumption), when you have a complicated > > > > >> > HTML > > > > >> page, > > > > >> > you may need to carefully write hundreds of lines for DOM objects > > > > >> > or, > > > > >> just > > > > >> > copy and paste HTML code to innerHTML... > > > > > >> > So my question is, is that true, using innerHTML is generally > > > > >> > faster > > > > >> than > > > > >> > creating DOM? > > > > > >> > -- > > > > > >> > Sent from my mobile device. Ignore the typos unless they're funny. > > > > > >> -- > > > > > >> You received this message because you are subscribed to the Google > > > > >> Groups > > > > >> "iPhoneWebDev" group. > > > > >> To post to this group, send email to [email protected]. > > > > >> To unsubscribe from this group, send email to > > > > >> [email protected]<iphonewebdev%2bunsubscr...@google > > > > >> groups.com> > > > > >> . > > > > >> For more options, visit this group at > > > > >>http://groups.google.com/group/iphonewebdev?hl=en. > > > > > > -- > > > > > > Sent from my mobile device. Ignore the typos unless they're funny. > > > > > -- > > > > > Sent from my mobile device. Ignore the typos unless they're funny. -- You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
