Performance Tip #3: Setting Styles

A common task to do in JavaScript is to change the appearance of elements dynamically. There’s a couple of ways of doing that: 1. Setting style properties in the DOM divTest.style.backgroundColor = "red"; divTest.style.fontWeight = "bold"; 2. Setting the style property to a CSS string divTest.style.cssText = "background-color: red; font-weight: bold; margin: 0px 0px 0px…


Performance Tip #2: Iterating Over Node Collections

It’s fairly common in JavaScript to get a list of nodes from a DOM element and then iterate over them to perform some function such as setting a class name. Typically this is done with something like: var list = document.getElementById("itemList"); // ul containing 100 li elements for (var i = 0; i < list.childNodes.length;…

1

Performance Tip #1: Variables in the DOM

In this blog I’m going to talk about a simple rule for speeding up JavaScript. Plenty of other folk have commented on this but it’s worth saying again and again :). Advice in a nutshell: Try to declare all your functionality within closures and avoid declaring variables in the global scope or any part on…


A New Start IV

Well it’s been a long time since I’ve blogged a long time indeed. But I thought it was about time I got back in to it. Luckily after Popfly myself and a few ex-popfliers moved to a new team the browser tools team over in DevDiv. Where we get to work on tools that make…