So basically a good knowledge of Prototype would be enough for this project right? Well, that’s wrong. My biggest JS development was a “plugin” to control dependencies over questions and group of questions of a form, and all of those questions and dependencies were dynamic. The challenge was awesome.
After some good days of work I had around 400 lines of JS and 60 unit tests to validate that. It was all working great, until I had the idea to put a profile to see how long it takes for it to parse the dependencies and show, hide the questions and its dependencies.
The result was 3 seconds on Firefox and about 11 seconds on IE6! And of course that was totally unacceptable. That’s where my knowledge of Prototype was useless, if I wasn’t able to understand what was going on behind the scenes I would never be able to reduce the loading time.
I don’t want to stick to the details because this article is not about JS optimization. But after changing some selectors, trying to work more with ids than with classes and much more, the result was: 300ms on FireFox and 900ms on IE6. And that was acceptable.
I wouldn’t be able to resolve this issue if I didn’t have a good JS knowledge, if I didn’t know what was going behind Prototype. I’m not saying I know everything Prototype or jQuery does behind the scenes, but you can know, for an example, that a class selector is slower than an ID selector.
If you’re a designer and your JS needs are collapsing sections on click, or creating a simple slideshow: Focus on jQuery and learn how to play an instrument in your free time!