floatmargin

I am in Boston for jQuery Conference 2008 and The Ajax Experience. The jQuery Conference is one day and was yesterday, September 28. I wasn’t sure what to expect but it was pretty useful, glad they had an advanced and beginner track so we could avoid too much review, but it was inevitable that there would be some. Here is a quick review of what I found useful.

Optimizing jQuery Core - John Resig

After a state of the library intro by John Resig, the advanced track started with the session titled Optimizing jQuery Core. Most interesting to me was the discussion of the data method. I had seen it used in plugins and in jQuery UI but never realized how I could put it to use. Basically it allows you to store information in a data store associated with a particular element. I often associate information with an element by setting a class, or a rel attribute on the element. For instance if I have an expandable menu that saves state in a cookie, I might add a class of cookieopened to the menu items I opened because their id was in a cookie. That way when I go back to the item in some other function I can tell the state of the menu by checking for the cookieopened class. That seems silly now when I think about the data method. Instead now I would just do this:

jQuery(menuitem selector).data("state","cookieopened");

And when I want to check the state I would just use:

jQuery(menuitem selector).data("state");

The method stores the information in an object on the element with a unique name. jQuery also stores other information with the element. So you can use:

jQuery(menuitem selector).data("events");

To find out which events are bound to that element.

The old way to store information like this would be to create an expando on the element, but that causes memory leaks in Internet Explorer, jQuery does its own garbage collection with the data method.

I was also excited to hear about namespacing of events. When binding an event to an element you can add a dot and a string to namespace the event as follows:

jQuery("p").bind("click.foo",function(){alert('bar')});

This is useful to keep track of all events attached to elements from a particular plugin or function. That way you can call:

jQuery("p").unbind("click.foo");

And only remove the click events associated with “foo” and leave all other click events that may be bound to the element in place.

Resig also talked about ways that jQuery may be sped up soon by using a new way to find elements with the css selection engine, and a new way to manipulate the DOM which allows many elements to be inserted at once rather than one by one. On a topic which ended up being controversial on the first day of The Ajax Experience, Resig said that the goal of jQuery is to remove all browser sniffing from the library and replace it with feature sniffing.

Writing Modular jQuery Applications - Yehuda Katz

While I didn’t have as many lightbulb moments during this session, Yehuda Katz did expound on the data method and convinced me to look into some more jQuery plugins, some of which I was aware of but never felt compelled to research.

Effen is a plugin which allows you to store functions that are particular to a dom element, much like the data method, but for functions, at least that is how I understood it, I could be wrong.

Listen is a plugin which makes event delegation much easier. I had been doing my own event delegation by checking event.target but this plugin not only will make code cleaner but will handle some edge cases that could cause problems.

Live Query is a plugin which allows you to bind an event listener to an element AND to any matching elements that are ajaxed in after initial load. This should save some lines of code if it works as expected.

An In-Depth Look at jQuery UI - Paul Bakaus

I probably enjoyed this session the most even though I didn’t get as many ideas as the previous sessions. I think the presenter just did a good job of keeping our interest. He did explain the widget factory which could be useful in repackaging modifications I made to the UI slider for a project. But unfortunately I couldn’t write it all down in time, I will be looking for his slide deck. He did mention that UI 1.7 is expected in December and will include a grid. He also showed us some experimental items he is working on which were pretty cool (adding depth to web sites).

Desktop Applications with jQuery and Adobe AIR - Kevin Hoyt

I really didn’t find this very useful, for some reason whenever I see Adobe present one of their products its kind of like seeing a really funny movie trailer, only to find out that those were the only funny parts of the movie. I guess I could explain that more, but lets move on.

Using jQuery in Firefox Extensions - Aza Raskin

This session didn’t happen, for some reason Aza Raskin was still in California. Instead we got a shorter version of John Resig’s Ajax Experience session Visual Programming with JavaScript. While I can’t imagine a real world use case for me, it was great to see how easily cool animations/visualizations could be created with the right browser and Resig’s Processing.js.

Building Robust jQuery Plugins - Joern Zaefferer

This session was fine, but I would have preferred a code heavy session. We got more about best practices - plan out the architecture, build tests as you create, and what should be documented.

I enjoyed it and look forward to the possibility of attending it next year, would love to see sessions which looked at the jquery code base and explained the code. Kind of a “behind the library” session, all of the code is carefully chosen to be included in the library, would love to hear the logic behind some of those decisions.