There’s some pretty exciting new features / bug fixes on the horizon for IE 8, so I thought a quick post might be in order. I must confess, this is the first release of IE that I’m fairly excited about! Normally they just induce a deep, dark sense of foreboding… The following list isn’t exhaustive: it just contains the features that are of most immediate practical use to JS developers like myself. Stuff like ARIA, “activities” and other features aren’t discussed. Check out Microsoft’s “IE8 Readiness Toolkit” page for those.

• First off, the old workhorse function document.getElementById now, finally, only returns elements by id. Woo-hoo! In all IE versions to date, it also returns elements by name, if the ID isn’t set. This can be a real pill at times.
• A new Object.querySelector method, providing a cleaner way to locate elements. This is a nice addition based on the W3C specs, but having used jQuery’s amazing xpath-friendly selectors, it seems a bit, like, so yesterday. Example usage:
  

  div.querySelector("p span");

• getAttribute and setAttribute now behave like they should – and like they do on virtually every other browser. Namely, getting and setting attributes and not returning weird objects and stuff.
• DOM Storage. This is a neat one. I’m no Flash expert, but it seems to be similar to Flash Objects – providing the developer with a way to store information on the person’s computer, rather than using the justifiably reviled “cookies”. (Up to 10MB per domain, apparently!). Microsoft were pretty upfront that this is a simple hash object with getters & setters – it’s not a database.
• A new Firebug-like tool for debugging, etc.
• Ajax Navigation: window.location.hash. From my viewpoint, this is probably the most exciting upcoming feature. In the past, I’ve made several posts about the RSH (Really Simple History) library, now maintained by Brian Dillard. This script provides a browser independent way of maintaining the use of the browser’s Back button within Ajax apps (or tries to, I should say – there are still some open critical bugs). Well, the window.location.hash property lets you log pages in the browsers history – just like with most of the other browser vendors out there – so now when you click back, it’ll load any pages logged in that object. Instant back button friendliness. There was an enticing post on Ajaxian about the possibility that this new feature will render the RSH library obsolete. Brian thinks not, and I fully agree. He also notes a few caveats with the Microsoft model.

Related links:

Microsoft’s “Readiness Toolkit” for IE8, written in a depressingly sales-pitchy kind of way:
http://www.microsoft.com/windows/products/winfamily/ie/ie8/readiness/DevelopersNew.htm#ajax

Some more technical details on the release:
http://code.msdn.microsoft.com/Release/ProjectReleases.aspx?ProjectName=ie8whitepapers&ReleaseId=581

John Resig (jQuery dude) wrote an interesting – and enthusiastic – post about the upcoming changes here:
http://ejohn.org/blog/javascript-in-internet-explorer-8/

Brian Dillard, who took over the Really Simply History (RSH) project from Brad Neuberg last year, comments on the nifty new Ajax-friendly nav: http://blogs.pathf.com/agileajax/2008/03/ie8-html5-and-a.html

W3C CSS3 selectors:
http://www.w3.org/TR/css3-selectors/

Smart Lists is now available as a jQuery plugin as well as a Prototype-Scriptaculous extension.

Smart Lists is light-weight (8KB) script that converts “flat” HTML lists of information into categorized, paginated lists. In essence, it’s a presentation layer for improving the readability of static information, without need of a database or server-side script. It can be applied to existing lists of information with very little work, providing a significant bump in usability.

You can learn more about the script here.

http://neosmart.net/gallery/v/apps/IE8/

Very pretty. But thank heavens they didn’t move the “Home” button back with the left and right buttons. Grouping related actions is overrated, in my opinion.

Whenever I start a new application, the thought of writing the javascript from scratch – or even just relying on my own libraries I’ve built up during my time as a UI developer – seems cruel and unusual. These days there’s just no reason to not use one of the many available JS frameworks out there: Prototype, jQuery, Mootools, Ext JS, Dojo, YUI – to name just a few of the larger players. These libraries abstract away the never-ending cross-browser idiosyncrasies, provide you with some really extensive practical function libraries, and let you focus on actually implementing your ideas. What a novel idea. Thanks to these beauties, writing javascript is no longer the horror show that it used to be.

For some long-forgotten reason, when I first started exploring these frameworks I settled on Prototype and Scriptaculous. It was probably the beautiful Scriptaculous effects that sold me. Now, having used Prototype on a number of projects I thought it was about time I learned more about how it worked and what other gems lay within its core. The online Prototype API is an excellent resource – and very clearly written – but lacking any sort of search mechanism. For that reason, certain information can’t be found unless you know where to look for it. [Why is there no Array.contains() function? There's no mention of it in the Array section... Months later I stumble upon Enumerable - ahhhh...!]. The scriptaculous documentation, on the other hand, is god-awful. Navigating their site to find out the simplest thing can take hours of painful searching, clicking, cries for help, blaspheming – finally ending with you either giving up or relying on Google to save the day. Avoid their documentation at all costs.

So anyway, I picked up this book to fill the gaps of my knowledge, especially with regard to Scriptaculous. The reviews I came across were pretty positive, so I thought I’d give it a go.

The book was… well, a little disappointing, to my mind. It’s not a definitive resource, which the author makes perfectly clear. But certain basic things like available selectors for the $$ utility function are omitted with the disclaimer that “we don’t have space to provide a full tutorial on the types of selectors here…”. That bugged me: that’s why I GOT the book, so that All Things Prototype and Scriptaculous would be covered and explained. The $$ function is such a commonly used function, you’d expect it would be covered in depth… wouldn’t you?

But it’s not all bad. I very much enjoyed the chapter on functions, notably the discussion of bind() and bindAsEventListener(). It’s very clearly explained, and I think that closures and binding have finally found a permanent home in my slow-witted brain. The chapter on Prototype Objects wasn’t bad, too: it certainly helped with building my Smart Lists Prototype extension.

Perhaps my excitement over this framework has waned because I’ve been recently exploring another: jQuery. I turned to jQuery out of necessity, since I needed a JS framework that was compatible with Adobe AIR. In a recent post in the “Prototype: Core” Google group, Thomas Fuchs (the lead developer for Prototype) said there were no plans to support Adobe AIR since it “broke the specs”. True enough, but to my mind that’s not enough reason to not accommodate them (if we did this, no script would ever support IE). Other than forbidding eval(), I’m not sure how AIR deviates from the ECMA specification. I’d be curious to know.

Having played with jQuery for a week or so, I must admit I’ve definitely had more “wow!” moments than I did with Prototype. Prototype feels like it’s really geared towards developers, whereas jQuery feels like any bozo (even my retarded cat, “Fish”) could use it. That’s a good sign. I’m going to convert my Smart Lists app to jQuery just out of curiosity to compare the frameworks. Maybe I’ll post about the differences then.

Anyway, to get back on topic and conclude: despite the misgivings mentioned above, “Prototype and Scripaculous in Action” is a good book and well worth the read. Just don’t expect a definitive guide.

Just a quick apology to the people who’ve written me recently to whom I haven’t responded. Sorry!!!! I’m very busy with a number of projects at the moment and having a hard time finding time to get back to everyone. And taking on any more work isn’t possible…!!! :-)

Smart Lists is light-weight (8KB) Prototype-Scriptaculous framework extension that converts “flat” HTML lists of information into categorized, paginated lists. In essence, it’s a presentation layer for improving the readability of static information, without need of a database or server-side script. It can be applied to existing lists of information with very little work, providing a significant bump in usability.

I wrote a version of the script a couple of years back for my Software page and always intended to generalize it into a downloadable script. Finally found time to write the sucker.

Oh, and it’s free, naturally. :-)

You can learn more about the script here.