Google Groups Home
Help | Sign in
Faster then innerHTML
There are currently too many topics in this group that display first. To make this topic appear first, remove this option from another topic.
There was an error processing your request. Please try again.
flag
  5 messages - Collapse all
The group you are posting to is a Usenet group. Messages posted to this group will make your email address visible to anyone on the Internet.
Your reply message has not been sent.
Your post was successful
Felix Geisendörfer  
View profile
 More options Sep 12 2007, 2:52 pm
From: Felix Geisendörfer <haimu...@gmail.com>
Date: Wed, 12 Sep 2007 14:52:27 -0400
Local: Wed, Sep 12 2007 2:52 pm
Subject: Faster then innerHTML

Here is an interesting blog post that I came across:

http://blog.stevenlevithan.com/archives/faster-than-innerhtml

The synopsis basically is that one can gain dramatic speed improvements
on setting innerHTML when removing items that are going to be
overwritten using DOM methods before inserting stuff via innerHTML.

I could see how this would be a need addition to jQuery.

-- Felix
PS: If you like regex make sure to subscribe to this guys blog, he has
some mad skills going on.
--------------------------
My Blog: http://www.thinkingphp.org
My Business: http://www.fg-webdesign.de


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Sean Catchpole  
View profile
 More options Sep 12 2007, 3:11 pm
From: "Sean Catchpole" <littlecoold...@gmail.com>
Date: Wed, 12 Sep 2007 14:11:06 -0500
Local: Wed, Sep 12 2007 3:11 pm
Subject: Re: [jQuery] Faster then innerHTML

Excellent, I'll look into this.

~Sean

On 9/12/07, Felix Geisendörfer <haimu...@gmail.com> wrote:


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
John Resig  
View profile
 More options Sep 12 2007, 3:16 pm
From: "John Resig" <jere...@gmail.com>
Date: Wed, 12 Sep 2007 15:16:15 -0400
Local: Wed, Sep 12 2007 3:16 pm
Subject: Re: [jQuery] Faster then innerHTML
You're in luck! jQuery already pre-empties an element inside .html().
Calling .html() actually does:
  .empty().append("html string");

Although, there's a lot of other issues at play inside .append() in
order to make it work cross browser, so those innerHTML benefits have
probably be nullified in the meantime.

--John

On 9/12/07, Felix Geisendörfer <haimu...@gmail.com> wrote:


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Steve L.  
View profile
 More options Sep 12 2007, 10:41 pm
From: "Steve L." <steve...@gmail.com>
Date: Wed, 12 Sep 2007 19:41:02 -0700
Local: Wed, Sep 12 2007 10:41 pm
Subject: Re: Faster then innerHTML
John, I slapped this modified version of my test page together in a
couple minutes:

http://stevenlevithan.com/demo/replaceHtml_jQuery.html

jQuery.html() seems to perform pretty terribly, to be honest. The
15,000 element "destroy & create" test in IE7, for example, is over
500 times slower than replaceHtml (around 104141ms vs. 203ms). Am I
doing something wrong? (I've never used jQuery before, so I apologize
if I'm making some stupid mistake.)

--Steven Levithan

On Sep 12, 3:16 pm, "John Resig" <jere...@gmail.com> wrote:


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Brandon Aaron  
View profile
 More options Sep 13 2007, 8:54 am
From: "Brandon Aaron" <brandon.aa...@gmail.com>
Date: Thu, 13 Sep 2007 07:54:54 -0500
Local: Thurs, Sep 13 2007 8:54 am
Subject: Re: [jQuery] Re: Faster then innerHTML

Yeah it isn't a very fair comparison. There is a lot that goes on to solve
cross-browser issues and memory leaks. For example, jQuery removes each
child node and its events. The replaceHtml function is a really nice
optimization and could easily be made into a plugin if desired. (untested
but should get the desired result)

$.fn.replaceHtml = function( val ) {
    var stack = [];
    return this.each( function(i, el) {
        var oldEl = el;
        /*@cc_on // Pure innerHTML is slightly faster in IE
        oldEl.innerHTML = html;
        return oldEl;
        @*/
        var newEl = oldEl.cloneNode(false);
        newEl.innerHTML = html;
        oldEl.parentNode.replaceChild(newEl, oldEl);
        /* Since we just removed the old element from the DOM, return a
reference
        to the new element, which can be used to restore variable
references. */
        stack.push( newEl );
    }).pushStack( stack );

};

--
Brandon Aaron

On 9/12/07, Steve L. <steve...@gmail.com> wrote:


    Reply to author    Forward  
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
End of messages
« Back to Discussions « Newer topic     Older topic »

Create a group - Google Groups - Google Home - Terms of Service - Privacy Policy
©2008 Google