MunichJS: 2011-04-06Mike West (mkwst@google.com)

Hi. I'm Mike.You can email me at

mkwst@google.com, follow me onTwitter @mikewest, or visit myoutdated blog at mikewest.org.

Two topics:IndexedDB (which is awesome).Chromium extension goodness.

IndexedDB

Uxebu are awesome.I'm thrilled that they're writing

abstraction layers. Seriously, thisrocks. If you haven't read the

article, do.

I'm less thrilled that they're wrong.

“But how is this betterthan localStorage? It

isn't.”

My thesis: IndexedDB, orsomething like it, is the way

forward.

Yes, it's complex, and the APIcould be better, but we're adults

here. We'll deal.

Why IndexedDB?A short intro to Chromium

internals.

Chromium splits the world into onetrusted browser and many

untrusted renderers.

BrowserAll I/O goes through the browser;it's the only piece of Chromium

that can make system calls, accessfiles or DBs, and display output to

the user.

Sandboxed RenderersRenderers run in processes with as

few permissions as possible, andonly have I/O access via IPC

messages to the browser's process.

I/O is a bottleneckThere's only one I/O messaging

thread on each renderer; it'scritical not to block while waiting

for a response.

Asynchronous APIs!The additional conceptual

complexity aside, they allow you tosmoothly continue responding to

user interactions.

With that in mind...What's wrong with this code?

var x = JSON.stringify( complexObject );window.localStorage['x'] = x;window.localStorage['anotherX'] = x;

Problem 1: localStorage requiresobjects be flattened via stringify,

called synchronously inuser-space.

var x = JSON.stringify( complexObject );window.localStorage['x'] = x;window.localStorage['anotherX'] = x;

IndexedDB storesunserialized objectsAs far as your (single-threaded)JavaScript process is concerned,

you'll never block while processingJSON.

Problem 2: localStorage itself issynchronous, which means the

assignment blocks while the writegoes through to the file system.

var x = JSON.stringify( complexObject );window.localStorage['x'] = x;window.localStorage['anotherX'] = x;

IndexedDB isasynchronous.

db.transaction(store, READ_WRITE). objectStore(store). put({ ... }). addEventListener( 'onsuccess', function (e) { ... });

Problem 3: There's no mechanismto ensure that both assignments gothrough successfully, nor that theyboth apply to the same baseline.

var x = JSON.stringify( complexObject );window.localStorage['x'] = x;window.localStorage['anotherX'] = x;

Transactions & Locking

db.transaction(store, READ_WRITE)…db.transaction(store, READ_ONLY)…

Chrome Privacy

Our privacy team's missionstatement.

“Chromium providesusers full transparency

and control over theinformation managed by

the browser.”

The team approaches this task in anumber of ways, notably in terms

of new extension APIs.

WebNavigation EventsonBeforeNavigateonBeforeRetarget

onCommittedonCompleted

onDOMContentLoadedonErrorOccurred

Done when they'redone...

WebRequest APIContentSettings API

DevTools (WebInspector,Debugger, etc.)

And more... goo.gl/Hy6Jy

Stay up to datechromestatus.com and Last Week

in Chromium/Webkit(goo.gl/XWEY3) are great

resources.

HTML5Rocks.com is full of usefultutorials (and will be localized

soonish).

Questions?mkwst@google.com

@mikewest