Taras Glek
taras@mozilla.com
https://blog.mozilla.com/tglek/

Browsers Are Replacing Traditional Operating Systems
• Some web pages are actually apps
• Higher performance expectations in apps

Scheduling Sucks
• SetTimeout
• XMLHTTPRequest loops
• Every other API with async callbacks

SetTimeout - Web Multitool
• Animations
• Polling
• Way to run code outside of DOM event handlers

Do not use SetTimeout for animations
• CSS animations perform better than JS ones
• Use requestAnimationFrame if you must do JS animations

Regular DOM activity can burn through CPU/battery
• DOM activity can flush layout (ie accessing .offsetWidth or any other layout property), trigger paints
• Do not touch DOM from setTimeouts if you can avoid it
• Time your setTimeout handlers
• SetTimeouts are good way to maximize event-handling lag

• Background setTimeouts throttled to 1Hz
• Background painting (ie requestAnimationFrame), reflows, etc throttled to 1Hz, halving every iteration
• Serialize background tabs, require opt-in for apps that require background activity?
• Some mobile browsers freeze all background activity

• Avoid touching the DOM regularly
• Do not update invisible elements until they come into view
• Use page-visibility API to suspend page activity

• 5MB storage limit
• Synchronous API
• Slow

• IO is usually fast, especially during lab testing
• IO performance features nasty outliers

• Joins sync XMLHttpRequest in API hall of shame
• Requires caching of read/write, which causes robustness issues
• Stalls the rest of page and/or browser

DOM Storage = Slow
• Backend is an SQLite table

Problem with SQLite and other databases
• Internal fragmentation - poor data grouping
• External fragmentation - poor data grouping with less accidental upsides
• DB maintenance is expensive

Characteristics of a fast filesystem backend
• Use files to provide storage locality, reduce abstraction penalty
• Allow write, fsync, rename
• grow/truncate ability to cope with fragmentation

FileHandle API
• Extends IndexedDB to allow raw file access
• Low level foundation that can be used to implement something as complex as SQLite
• Landed in Firefox 15

Summary
• Use SetTimeout carefully (avoid DOM, use page-visibility API to back off)
• We should consider an opt-in mechanism to keep background pages active
• DOM Local Storage sucks
• Storage is not faster than network
• Look into FileHandle API for high performance IO