Google Gears: Offline Support for AJAX Apps

Posted by Scott Laird Wed, 30 May 2007 23:01:00 GMT

I usually avoid promoting products that I’m paid to work with, but I just love this one: Google Gears. It’s an open-source, cross-browser (IE and Win/Mac/Linux FF for now) plugin that provides a bunch of enhancements for developers of AJAX apps. Most importantly, it lets you add offline support to your AJAX apps without requiring a rewrite or fork. You just replace your existing XMLHttpRequest calls with a wrapper and off you go. The wrapper’s designed to fail gracefully if the plugin’s not available, so one set of code will work for everyone–with or without the plugin, online or offline. Presumably someone will integrate this into Prototype and other JS frameworks shortly, making it easy for thousands of developers to build offline-enabled web apps.

That’s not all that Google Gears is good for; it also includes Javascript thread support and an in-browser SQL database. I’ll let you use your imagination on those.

I’ve been watching this develop for the past few months, and I’m really excited about it. I can’t wait to see how people integrate this into Rails and other frameworks.

Tags , ,  | 5 comments

Behavior: CSS-like application of Javascript

Posted by Scott Laird Sat, 02 Jul 2005 23:00:25 GMT

Lamda the Ultimate just pointed out a cool new Javascript tool that should make AJAX-ifying web sites much cleaner and more maintainable. By using Behavior, you can strip all of the ugly little <script> and onclick="" tags out of your website and then specify all of the Javascript actions out of line using CSS selectors. Here’s the example from their website:

So, instead of this:

<li>
  <a onclick="this.parentNode.removeChild(this)" href="#">
    Click me to delete me
  </a>
</li>

You can use:

<ul id="example">
  <li>
    <a href="/someurl">Click me to delete me</a>
  </li>
</ul>

Then you feed something like this into Behavior:

var myrules = {
  '#example li' : function(el){
    el.onclick = function(){
      this.parentNode.removeChild(this);
    }
  }
};

Behaviour.register(myrules);

It’s a little too verbose to use in this example, but the basic mechanism is really cool. I’d love to see this extended one step further, with Behavior being able to parse a configuration more like this:

#example li:onclick {
  this.parentNode.removeChild(this);
}

You’d drop that into a file on your web server, say mylayout.jcss. Then you’d have a block like this at the top of the HTML file:

<script>Behavior.import("mylayout.jcss");</script>

I’m not exactly a Javascript wiz, but this looks vastly cleaner to me. I’d love to see something like this included into a future release of Rails.

Posted in  | Tags , , , ,  | no comments