At thoughtbot, we’re working on an exciting piece of code that will someday be shared with the rest of the world. Suffice to say, its a very intensive bit of JavaScript code that stresses the boundaries of all browsers. After initially solving a lot of the performance problems by offloading a lot of the calculations to CSS instead of JavaScript (lots of the elements on the page effect the position of all the others), we were cruising along, only to hit a brick wall.
While performance in IE, Firefox on Windows, and Safari was acceptable (the performance of Safari has been running circles around the other browsers), performance on Firefox on Mac was incredibly poor. Amazingly so.
After the initial panic, I set to tracking the precise cause of the performance issues. By commenting out large sections of the code, I was able to determine that we were calling offsetHeight on some DIVs repeatedly each time an event fired (and it fires a lot).
A quick Google search indicated that yes, some people have documented performance issues with offsetHeight (here).
While I can understand why offsetHeight is slow, I don’t understand why the performance of it in Firefox on Mac (Macbook Pro) was so much worse than any other browser.
