jQuery Mobile Alpha was released yesterday and it’s very good for an alpha. I think John Resig and team have a long way to go but the project itself is very ambitious. A full mobile framework for iOS, Android, Blackberry, webOS, MeeGo and more is nothing to sneeze at.

For example, after a few minutes on Android, I noticed that the persistent footer nav doesn’t always stick to the bottom of the screen. Since most mobile browser do not have css fixed positioning this ui paradigm is one of the hardest problems to solve. Notice that toolbars simply disappears on touch and reappear.

I look forward to the the next release, at the moment I wouldn’t say it’s ready for a production deploy. It is an alpha after all.

Yesterday, the jQuery team released their jQuery UI library which brings much needed UI components to an already stellar AJAX framework. Many developers love jQuery because of it’s simplicity and ability to get shit done quickly. It’s not an overly bloated library (read: Dojo 0.4) and it’s wick fast. So why would you want to use jQuery UI over say other frameworks like Ext JS or script.aculo.us? Well here’s my top 5 reasons to use this new framework, plus 3 reasons to avoid it.

5 Reasons to Use jQuery UI

1. Stick with One Library
   The obvious reason for using jQuery UI is that you’re already using jQuery. Now you won’t have to bring in another library to satisfy your UI needs. You can take advantage of all the widgets and interaction tools that jQuery UI supports without having to maintain and learn another library. Not that mixing libraries is a bad thing, you can definitely use multiple libraries in one project and cherry picking the best components out of each.
2. Excellent Documentation
   I’ve always liked jQuery for the excellent documentation they provide. Not only is it up to date but it’s also cleanly organized. Each function/component has a full explanation and an example + source code. The most frustrating thing when using a library is not being able to find information. The whole point to use a library is to make development easier and good documentation definitely helps.

   Just compare the jQuery docs to Dojo docs (which is actually down as of this writing) to script.aculo.us docs to mootools to mochikit. (Don’t look at YUI or Ext JS, their docs are great!)

3. Magnifier
   
   Not a new effect, but definitely the easiest way to get this effect on your page. See the example here. In one line of javascript you have your very own OS X dock widget!
4. Selectables
   
   I haven’t used them all, but I’ve seen very few libraries that have a component that lets you select items like this in javascript. Check out the demo here. Draw a box around the list items to select them. Now more impressively hit control and select items while skipping others. Awesome.
5. Themes
   One part of AJAX is beautifying the web and with the upcoming themes competition for jQuery, there should be plenty of themes available. My one knock against most libraries is that there’s not enough variation in the way the widgets look so one Dojo or Ext JS site starts looks like every other. Redoing themes requires a lot of resources (and talents that AJAX developers usually do not have) so most developers end up picking one of the existing themes.

3 Reasons to Avoid jQuery UI

1. Doesn’t Support All Browsers Yet
   Granted this is a brand new project and they warn you ahead of time in their launch announcement, but so far I’ve tested Safari, IE6, IE7, and Konquerer. There are various bug in each and on different components. For example the gallery demo doesn’t render properly in Safari or Konquerer.

   The Shadow demo fails in IE6. There have been reported issues with the tablesorter in IE7. The point of using an AJAX library is to abstract the browser layer, but if certain components don’t work on certain browsers, there’s a problem.

2. Missing Widgets, Ranged Calendar Date Picker
   I know I’m being picky, but the calendar widget doesn’t do date ranges. You can get around this, but at first glance I don’t see an option where I can set a min/max date. Compared to the YUI calendar widget, the options are sparse here. If you’ve ever done any decent amount of web work, you’ll know that a good calendaring widget is essential.

   Update: Okay, I missed the plethora of options available in the Calendaring widget. Thanks to Marc Grabanski, calendaring widget developer, for pointing me to a more robust demo which shows that it’s configurable than I had first thought. It definitely does do date ranges.

   My original point was that jQuery is still missing a few UI widgets; common ones such as a tree widget and a menu widget and lesser used ones such as a WYSIWYG or autocomplete. I don’t doubt that these things will come as the library matures but they’re not in the current release.

3. Inconsistency in the API
   jQuery was done by a team of contributors, each doing their own components and it shows. For example, the accordion control is essentially the same thing functionally to the tab control. Yet the activate a tab programmatically the call is tabsClick() while the accordion control is activate(). The tab control also has many more hooks such as disable, remove, add, etc… the accordion control has none of this functionality.

The jQuery UI library definitely has some high points, but I think it was launched a bit too early. The depth of existing AJAX frameworks simply outshines it. However, as it matures, I’m positive the team will keep up the high quality that has made jQuery massively popular.