Question

I have a web page that used client side templating to update part of the page based on json obtained via an ajax call.

At the moment I’m using an unordered list where inside each Li I have markup to display information about a product.

I’m interested to know, are some tags faster when inserting into the DOM than others? That is to say should I look to either change my ul into some other tag or maybe change the tags inside the Li s?

thanks

b

Answer 1

The fastest way is to construct HTML as text and set the innerHTML property once.

Another approach is to create a document fragment and once done put it into the DOM.

There might be a difference in the speed of insertion of one tag or another, but it will be marginal and different between browsers.

The thing is that touching the DOM is a very expensive operation – if speed is what you are after – minimize that.

Have a look at Stoyan Stefanov’s performance tips.