Google Gears

• Google Gears API [1].

• From the architecture [2] doc.

• The database is gears.

• Modal: tell/ask the user if online or not.
  • User must remember to switch modes.
  • Bad when connection is flaky.
  • Local store can't be used when online.
• Modeless: always use local store, frequent syncs up.
  • Harder to implement.
  • Harder to test due to asyn.

• In a manual sync the user decides.
  • Can be implemented with full copy/download.
  • User must know when online/offline.

• Data is ready any time.
• Better user experience with slow connection.

• Same origin policy.

• Create all the other classes:

<script type="text/javascript" src="gears_init.js"></script>
<script type="text/javascript">

// Check whether Google Gears is installed.
if (window.google && google.gears) {
  // Instantiate Gears objects
  var db = google.gears.factory.create('beta.database');
  db.open();
}

</script>

• The database [3] lets your app store data in the client.
• You use SQL statements.

<script type="text/javascript" src="gears_init.js"></script>
<script type="text/javascript">

var db = google.gears.factory.create('beta.database');
db.open('database-test');
db.execute('create table if not exists Test' +
           ' (Phrase text, Timestamp int)');
db.execute('insert into Test values (?, ?)', ['Monkey!', new Date().getTime()]);
var rs = db.execute('select * from Test order by Timestamp desc');

while (rs.isValidRow()) {
  alert(rs.field(0) + '@' + rs.field(1));
  rs.next();
}
rs.close();

</script>

• Results are in a ResultSet class.

• An XHR object that works with workers

<script type="text/javascript" src="gears_init.js"></script>
<script type="text/javascript">

var request = google.gears.factory.create('beta.httprequest');
request.open('GET', '/index.html');
request.onreadystatechange = function() {
  if (request.readyState == 4) {
    console.write(request.responseText);
  }
};

</script>

• Lets app cache and serve all its resources locally.

<script type="text/javascript" src="gears_init.js"></script>
<script type="text/javascript">

var localServer = google.gears.factory.create('beta.localserver');
var store = localServer.createManagedStore('test-store');
store.manifestUrl = 'site-manifest.txt';
store.checkForUpdate();

</script>

// site-manifest.txt
{
  "betaManifestVersion": 1,
  "version": "site_version_string",
  "entries": [
    { "url": "site.html" },
    { "url": "gears_init.js" }
  ]
}

• Re-defines setTimeout and others for workers

var timer = google.gears.factory.create('beta.timer');
timer.setTimeout(function() { alert('Hello, from the future!'); },
                 1000);

• Create threads that do not hang the browser!

// main.js
var workerPool = google.gears.factory.create('beta.workerpool');

workerPool.onmessage = function(a, b, message) {
  alert('Received message from worker ' + message.sender + ': ' + message.text);
};

var childWorkerId = workerPool.createWorkerFromUrl('worker.js');

workerPool.sendMessage('Hello, world!', childWorkerId);

// worker.js
var wp = google.gears.workerPool;
wp.onmessage = function(a, b, message) {
  wp.sendMessage('Received: ' + message.text, message.sender);
}

• In-the-cloud, in-the-client: best of both worlds.
• Need to engineer into your application from the beginning!