Firefox4 Demo

Looks like I've had a 2-month blogging hiatus... oops! I normally don't go this long with something to write about. Here is something so cool I couldn't avoid posting it:

The fine folks up in Canada (at least I assume that's where this guy is) have done it again! Video via hacks.mozilla.org

I have actually been using Firefox 4 in Alpha/Beta for quite some time now, but this video is just such a great demo of what you can accomplish with modern web browsers, and in this case, Firefox.

Notable things are:

• HTML5 Video. Firefox has had support for plugin-less video (i.e. no flash) for a while, but now that Google has opened the WebM codec, Firefox can have that in common with Chrome, Opera and the forthcoming IE9 (i.e. everyone except Safari). What does this mean? You should only have to encode your video twice now, into h.264 and WebM. You can still do Flash for backwards compatibility, but I fear rendering Flash video will become the "IE6 stylesheet" of the next decade.
• CSS Transitions and History API. Paul is doing all of his slides (except the page with 5 videos, the film site and the photo grid) in one giant HTML page with a bunch of transitions and the History API, which I assume you access with JavaScript. He then later shows how he uses the Web Sockets (you'll start hearing this instead of AJAX soon, I promise) to control the slides on his computer with his phone, over the cloud (instead of the local network).
• Hardware accelerated graphics. The browser can talk to the GPU; This goes above and beyond what you can do with Flash, I think, or at least in all but the very latest versions. This greatly speeds up all of the animations and "candy" that Paul shows in his demo. This is cool because the video card in any modern computer is a very capable and sometimes under-utilized piece of equipment, and it's perfect for doing stuff like this. While the contents of web pages will take a few years to catch up with these new developments, we can't have the next quantum leap unless every browser maker is able to accomplish stuff like this GPU-level optimization. (I think this only works on Windows today)
• 3D. Probably one of the coolest demos, but the one I'm most skeptical about. We've been hearing about 3D in the browser (and Flash) for years and years and years, but it's so different, it's probably just more candy. I don't think today's web designers would know what to do with 3D, and content companies (like game makers) are often way more interested in proprietorship, which is not consistent with the "view source" aesthetic of the web.
• Drag and Drop file uploads. All I can say is, "Finally!"
• Canvas.Paul appears to skip over canvas, but I believe that canvas was so instrumental in getting most of these other technologies to be usable in the wild, that I'll give him a pass. I put SVG in the same camp as 3D, though. (I'll believe it when everyone uses it.)
• He doesn't have demos for some of the other (relatively) new things, like the IndexedDB (see: Google Gears, Flash Shared Objects) or Location-aware browsing. I know there are some sites out there that are making use of the location services, because they are throwing pop-ups and permission requests at me.

Please note also, the title of this post - Firefox 4 Demo - not HTML5 and CSS3 Demo. Still, I think a lot of these things are possible in other browsers, but they don't have this guy with the killer French accent to give the demo. There is also a mobile version of Firefox beta, if you use Android at least (or you're in the Maemo minority).