In my previous life I spent time quite a bit of time both learning and teaching JavaScript. Whenever I used it, I wrote the code from scratch to make it do whatever I needed. That included everything from adding simple visual effects to webpages, to more complex DOM (Document Object Model) manipulations.  I was always of the opinion that I could write whatever was needed faster than it would take to crawl up the learning curve of one of the many available JavaScript frameworks . After a few months using jQuery, it seems like I was wrong!

I try to regularly spend some time looking at new developments in web design & development. When I was evaluating the various frameworks (such as jQuery, Prototype, Scriptalicious) I found that jQuery best met my needs, so I jumped in.  It allows you to do everything from add animations to pages, to integrate AJAX within your site.

Their blurb:

jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. jQuery is designed to change the way that you write JavaScript.

Some of my initial impressions were:

1. There was an active community around it. This meant that the documentation was well maintained, there where lots of tutorials & resources available to learn from, and the support seemed to be good in the user forums….all important considerations when learning something new.
2. The framework itself was small (16kb when minified & gzipped). Its small size means less impact on the performance of pages while the file downloads, again, something I would rate quite highly.
3. It is cross-browser compliant, meaning that it will run on all the major browsers without any problems. Again, allowing you to know your users won’t run into problems when looking at your sites.
4. I liked that it allowed you to write unobtrusive JavaScript, something I was always less likely to do when writing the code from scratch.

After reading the documentation for a couple of hours, it was extremely easy to jump in and develop something in a few lines of code that would have been a big job were you to write it all from scratch.

Plugins

A huge strength of JQuery is its use of plugins. The framework is easily extensible, meaning that if you need something that isn’t included in its core, you can either search the Plugin Library or, if you find nothing suitable, extend it yourself.  Using this approach keeps the framework small, by ensuring your not including things you don’t need, while giving you the flexibility to add functionality specific to your site.

There was a bit more of a learning curve when it came to writing plugins. There are some great guides out there for this (in particular, Learning jQuery: A plugin Development Pattern). One thing that I had problems with was realising the difference between Action & Utility plugins – after much searching the web (not knowing what I was looking for!), I found a good explanation of why you would use either in this blog post. That saved me a world of pain!

Resources

I do think that a good understanding of JavaScript is needed to make full use of any of the frameworks.  But, if you decide on jQuery, there are lots of resources out on the web for learning more. Google will help, but the ones I found most helpful when starting out were:

• jQuery Documentation
• jQuery Forums on Nabble
• Learning jQuery
• 51jQuery Tutorials & Examples
• Webdesigner Wall – jQuery Tutorials for Designers

There’s a simple example of jQuery in use over on the Portfolio page of this site. It’s jQuery that is handling the animations to change the screenshots when you click on the names of each of the clients. It’s also unobtrusive on this page; meaning that if a user has JavaScript disabled, the page will still be displayed, but without the fancy effects.