Love Jquery, Hate the Jquery UI

by Matt Garvin, published 2011

UI Problems

In a nutshell, here are the problems with the Jquery UI. It is too bloated, it is too complicated, and worst of all, it is very, very far from being W3C compliant.  And that drives me crazy. (Just how many "zoom" errors can one piece of software pile on?)  It is, in so many ways, the opposite of what spartan, you-take-control, Jquery is.  And while I think it is an amazing piece of engineering, it does not inspire me.  It frustrates me.

When I get put on a project that uses the Jquery UI, the first thing I ask is "Can we just use Jquery, and stand alone plugins or make our own widgets for the things that you would have use the UI?"  No? Ok.  But Why not?  Oh, because it makes accordion widgets so easy, and it has the tabs with rounded corners.  Ok.  But did you know that I can use HTML and CSS and Jquery to make a custom widget that is exactly like the accordion widget, but without all of the bloat and calls to unused CSS?  And the same goes for the tabs, too?  (And maybe those rounded corners aren't such a great idea, anyway!)  I mean, all tabs need to be is an unordered list -- the tabs themselves -- and a bunch of divs, displayed one at a time according to what list item you click, right?  10 lines of code.

I can code my own tabs or accordion widgets that have the same effect as the JQ UI -- and look better! -- with literally about 1% of the code.

Even more complicated widgets, like the datepicker, which I would not want to try coding by hand (and would not be a mere 10 lines of code) exist as stand alone widgets.  Download them, plug them in.  No need to plug in the whole JQ UI though.  Let's have some surgical precision here. 

Good For Some, Not For All

I think the UI might be a good thing for people that do not know how to code the HTML/CSS/JS themselves, but it is not the answer for me.  Like I said, all of the non-standard code the UI uses is reason enough.  I don't like it when there are literally dozens (hundreds?) of CSS errors before I have even done a lick of code.  But here is the thing.  Frequently, I am on a team with .Net guys or Java guys, where I am the sole Front Ender.  And because the other guys don't understand HTML/CSS like me, they look at all of the "free" stuff that the JQ UI comes with, and think "Yes! Here are all of these gorgeous widgets that are already made for us!  A cornucupia of HTML goodness ready-to-go!"  And they are correct.  IF you don't care about the widgetry looking the way a graphic designer made the mockups you are working towards.  And IF you don't care about the extra overhead of calling huge libraries for mostly unused funcitons and classes.  And IF you are willing to study up and learn how to actually use the now built-in properties and methods of the fancy Dialogs you are going to use (or whatever the widgets of choice are).

The worst part is, in my experience, because the people that choose to put the UI in place don't really know how to use it (and just think it is a good idea),  and certainly don't know how to style it, then they leave it to me to "put lipstick on a pig" and get it to look acceptable. (Getting it to look like what a Graphc Designer wanted is not even possible.  Unless of course, the mockups were designed with the JQ UI widetry in mind!  Maybe the graphics guys at Jquery central do that, but the rest of the creative world has their own ideas, in my experience.)

In summary, count me in as a fan of Jquery, but a rejector of the Jquery UI.  I say, if you have the skills,  "just do it yourself."  Not in terms of hand-coding every widget from scratch, but hand-coding some, and plugging in the more complicated ones on an as-needed basis.  And if you don't know how to do it yourself, get someone who does. :)