This is the first of a long series of articles about jQuery. Here, I introduce general ideas about what it is and why jQuery seems to be the most appropriate option for VisionFriendly.com as compared to other Javascript frameworks.

What is a “Javascript framework”?

From a practical standpoint, this term means that jQuery provides a set of objects and methods that make writing Javascript easier. Some of the problems that Javascript frameworks look to solve include:

  • Deficiencies in the core language. Javascript is missing the ability to search through an array, for example.
  • Quick access to DOM (Document Object Model) elements and their properties (such as CSS, for example).
  • Cross-browser DOM manipulation.
  • Implementation of user interface elements and behaviors, such as tabs, accordions, and drag-drop.
  • AJAX (Asynchronous JavaScript and XML). Rolling your own implementation of AJAX is not a simple matter for the intermediate web developer. To me, AJAX and DOM manipulation are critical skills to have as our clients grow to have higher expectations.

What Frameworks are Out There?

There are a number of popular frameworks available, and choosing one for the Development department to focus on was not straightforward. The main contenders were jQuery + jQuery UI, Prototype + Scriptaculous, and MooTools. Other frameworks, such as Yahoo User Interface (YUI) library, Google Web Toolkit (GWT), and Dojo, seemed to be a poor match for the team because they seem to be geared towards large RIA’s (Rich Internet Applications).

Spry was interesting because it ships with Dreamweaver CS3, but was too drag-and-drop for my tastes. Just like my experience with canned Dreamweaver Server Behaviors, Spry is huge and doesn’t seem to encourage a better understanding of programming. Plus, the online demos did not work in Firefox at the time I was evaluating frameworks!

Why jQuery in Particular?

There were many features that made jQuery more attractive than Prototype and Mootools:

  • Use of CSS selectors to access the DOM. CSS syntax is built into the heart of jQuery, and so your comfort with CSS (and HTML!) will improve. (FYI, Prototype now has this.)
  • Minimal language design – The framework is not crammed with features that I feel would distract beginner-intermediate developers.
  • jQuery is the most popular, used by 40-65% of developers that use a Javascript framework vs Prototype’s 20-40%. jQuery has a better open source “ecosystem” than others (Prototype bound to Rails, MooTools is too small, Spry integrates with Adobe and does not seem to be used elsewhere)
  • It ships with Visual Studio 2008, with Intellisense support. This fits in with my overall goal for the Development team, which is that I hope that we will someday primarily be a C# / ASP.NET shop.

How jQuery Will Change Your Code
Some final thoughts about why I think jQuery is so exciting.

jQuery really does change the way I think about Javascript. In particular, I feel much more comfortable with the idea of functions as a data type, event handling, the DOM, CSS, and AJAX. Instead of being a painful or a daunting task, client-side scripting fits more comfortably with the HTML on your page and makes a new level of user interaction practical.

That’s it for now! Next time we will talk about prerequisites: What should you know to get the most out of this series?

Meanwhile, here are some references:

Essentials
Adoption statistics
Comparisons