I'm in a bad place. I have over 8,000 lines of Javascript here that control a cool AJAX-heavy application. These 8,000-some-odd lines don't perform so hot. In IE6, some silent memory leak causes the application to get slower and slower until it stops performing altogether. Worse, my code only constitutes about 600 of those lines, so I'm not completely confident in my plans to refactor it.
After going all through it and reading
everyone's lists of
tips on increasing performance, there still weren't a lot of apparent problem areas. The main issues I saw were:
- 8,000+ lines of code
- People keep opening the site in IE6
Neither of those are things I can really correct. Especially the latter, for reasons I can't discuss lest my head explode.
One reason there's so much code in this application is that numerous DOM elements are added and wired up dynamically. Modern browsers seem to handle this well, so I don't want to imply it's excessive, but it is the thing I can control that'll offer the biggest performance boost if I change it. In most cases, these elements are added dynamically so the code doesn't have to go looking for them later to toggle their CSS classes or attach event listeners. Because of a custom templating system that provides the meat of the frontend, adding unique IDs to have a handy reference to these elements isn't an option.
What I'm considering right now is what can be moved inline. This is hard to consider because of the voices in my head screaming that we don't put things inline anymore, not CSS and especially not calls to Javascript functions. The truth is, though, that if I moved a lot of the event code into functions accessible from outside the objects that call it right now, moved properties that are being saved on Javascript objects into unglamorous innerHTML, and simply set the styles of elements inline rather than using YUI methods, I'd probably save a bunch of code.
Since I started using Javascript libraries I've been imagining a coming utopia where we'd never worry about cross-browser compatibility and our frontends would be as complex as we wanted. Now I'm wondering where the tipping point is. It's uncomfortable to think we may have to throttle back usage of the wide variety of impressive tools the past few years have provided because what we're doing with them is more than the average machine can handle.