Presentation to Munich JS on 2011-04-06: covers the Munich Chrome team's privacy efforts, and argues that IndexedDB is a better mechanism than localStorage for applications of any real complexity. HTML version up at http://20110406-munichjs.appspot.com/

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

2. Hi. I'm Mike.
You can email me at
mkwst@google.com, follow me on
Twitter @mikewest, or visit my
outdated blog at mikewest.org.

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

4. IndexedDB

6. Uxebu are awesome.
I'm thrilled that they're writing
abstraction layers. Seriously, this
rocks. If you haven't read the
article, do.

7. “But how is this better
than localStorage? It
isn't.”
I'm less thrilled that they're wrong.

9. My thesis: IndexedDB, or
something like it, is the way
forward.
Yes, it's complex, and the API
could be better, but we're adults
here. We'll deal.

10. Why IndexedDB?
A short intro to Chromium
internals.

12. Chromium splits the world into one
trusted browser and many
untrusted renderers.

13. Browser
All I/O goes through the browser;
it's the only piece of Chromium
that can make system calls, access
files or DBs, and display output to
the user.

15. Sandboxed Renderers
Renderers run in processes with as
few permissions as possible, and
only have I/O access via IPC
messages to the browser's process.

17. I/O is a bottleneck
There's only one I/O messaging
thread on each renderer; it's
critical not to block while waiting
for a response.

19. Asynchronous APIs!
The additional conceptual
complexity aside, they allow you to
smoothly continue responding to
user interactions.

20. With that in mind...
What's wrong with this code?
var x = JSON.stringify( complexObject );
window.localStorage['x'] = x;
window.localStorage['anotherX'] = x;

21. Problem 1: localStorage requires
objects be flattened via stringify,
called synchronously in
user-space.
var x = JSON.stringify( complexObject );
window.localStorage['x'] = x;
window.localStorage['anotherX'] = x;

22. IndexedDB stores
unserialized objects
As far as your (single-threaded)
JavaScript process is concerned,
you'll never block while processing
JSON.

23. Problem 2: localStorage itself is
synchronous, which means the
assignment blocks while the write
goes through to the file system.
var x = JSON.stringify( complexObject );
window.localStorage['x'] = x;
window.localStorage['anotherX'] = x;

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

25. Problem 3: There's no mechanism
to ensure that both assignments go
through successfully, nor that they
both apply to the same baseline.
var x = JSON.stringify( complexObject );
window.localStorage['x'] = x;
window.localStorage['anotherX'] = x;

26. Transactions & Locking
db.transaction(store, READ_WRITE)…
db.transaction(store, READ_ONLY)…

28. Chrome Privacy

29. “Chromium provides
users full transparency
and control over the
information managed by
the browser.”
Our privacy team's mission
statement.

30. The team approaches this task in a
number of ways, notably in terms
of new extension APIs.

34. WebNavigation Events
onBeforeNavigate
onBeforeRetarget
onCommitted
onCompleted
onDOMContentLoaded
onErrorOccurred

35. Done when they're
done...
WebRequest API
ContentSettings API
DevTools (WebInspector,
Debugger, etc.)
And more... goo.gl/Hy6Jy

36. Stay up to date
chromestatus.com and Last Week
in Chromium/Webkit
(goo.gl/XWEY3) are great
resources.
HTML5Rocks.com is full of useful
tutorials (and will be localized
soonish).

39. Questions?
mkwst@google.com
@mikewest