Entries Tagged 'JavaScript' ↓

I’ve recently started working with Dojo, a javascript framework that has a lot to offer if you’re planning on building a large, complex web app. The only other framework I’ve used is jQuery, which I like a lot. However, jQuery doesn’t lend itself well to managing lots of javascript code. I’m not sure how much of that is a function of jQuery and how much is a function of my coding practices, but there is at least one other person out there who agrees with me. In fact, I stumbled onto this post of Addy’s after having an “ugh, there’s got to be a better way to do this” moment shortly after starting a large project using jQuery. That post led me to take a look at Dojo.

So after a couple of weeks wrestling with Dojo, here are some pros and cons.

Pros

• Dojo does it all. OK. Maybe not, but Dojo handles natively what you would end up needing several plug-ins or custom code to accomplish in jQuery.
• Dojo only loads the code you need. You have complete control over which libraries are loaded and when.
• Built in parser. This is perhaps one of the nicest features of Dojo. One of the biggest headaches with jQuery is making sure code loaded via Ajax is initialized properly. live() will only get you so far. Takes care of that for you.
• Use HTML to define everything if you want. Don’t want to write a bunch of JavaScript code to instantiate everything. You don’t have to. Dojo’s parser looks for parameters in the HTML tags and does it for you. This would end up in the cons list if you’re a stickler for validated HTML code. If you are, you can put it all in JavaScript.
• Excellent form widgets. Yes, jQueryUI has form widgets but Dojo has a more complete set and I prefer the functionality of Dojo over jQueryUI. My “Yes!” moment was when I discovered Dojo’s calendar input doesn’t disable the textfield like all the jQuery plug-ins I have tried. You want to just type in your birthdate instead of clicking *mumble mumble* times to finally get back to your year? Go right ahead.

Cons

• Learning curve. One thing jQuery has going for it is it is dead simple. I know I looked at Dojo back when I was first looking at JavaScript frameworks to spice up user interaction. I’m pretty sure I went with jQuery because it was so easy to pick up and get started with. Dojo not so much, particularly if you get into the Dijit (Dojo widet) libraries.
• Documentation. Like most open source projects documentation leaves much to be desired. Add to that that many tutorials and hints you can find on the web refer to older versions of Dojo and usually don’t apply any more. Even Dojo’s documentation has outdated information or links to pages that are missing. The Dojo folks know this is a huge shortcoming and are working on it, but in the meantime, this only exacerbates the learning curve.

So far I really like what Dojo can do, but the documentation issue has been a big one. I’ve wasted hours looking for answers to my questions only to find them when searching for something unrelated. So, I’ll try and document my adventures with Dojo here to hopefully save others from the headaches I’ve dealt with. As of this writing Dojo is on version 1.6.

So I figured it was time actually do some work on my site. I haven’t touched it since 2005. Honestly, I haven’t really needed to. I’ve been keeping busy enough that marketing myself wasn’t really necessary. But then I’ve never tried to survive a depression either.

One of the things I wanted to do was use jQuery on the site, mostly to demonstrate that I could. I stumbled onto some web pages talking about jFlow, probably in one of the blogs I follow. Other examples of this effect are the Coda website (a code editor for Mac) and the Giant Creative web site.

So I downloaded jFlow and tried it. First impression: buggy. It doesn’t always animate . . . forward anyway. With my initial implementation, slide 1 to 2 jumps. No nice scrolling. I see that behavior between the second to last and last slide as well. Things work peachy going backwards from 2 to 1, though. Go figure. I didn’t really want to spend time digging into the code to see if I had done something wrong or to fix it so I went looking for another solution.

Enter Coda Slider 2.0. First impression: meh. Looks like it has lots of features, but the documentation leaves much to be desired. It’s not clear in the example HTML which CSS is required for the plugin to work and which is just layout. Perhaps the most off-putting aspect of Coda Slider is it seems to dictate (and thus limit) your layout. Again, with more time I could probably have figured out a way around these alleged limitations, but that isn’t how I wanted to spend my time. So, I kept looking.

After a very short search, I found this tutorial over at jQuery for Designers. While it doesn’t have the advantage of a single plugin, in fact it takes three, it provides all the functionality of either jFlow or Coda Slider and then some. As an added bonus, it is extremely flexible: put your navigation anywhere you want, anyway you like and it works. The final cherry on top? It worked the first try. Check it out.

Of course, now that I have it fully implemented, I’m questioning the choice, but that’s okay. That’s what we call agile development. If you don’t like the way it’s working, change direction.