Collateral Improvements

Jethro Larson vs. web development, gaming, and everything else

Jun 27

Data URI Stylesheets and localStorage

I recently read a Storager case study: Bing, Google by Steve Souders and started wondering if the technique would improve performance on the desktop. One problem I was concerned about was the ability to write to <style> tags in IE.

After some thought and discussion with Dan Krieger, I came up with an idea. Take the stylesheet and base64 encode it, stuff it into local storage and create link tags dynamically, setting the href to the data URI of the stylesheet.

http://jsfiddle.net/jethrolarson/vaUHn/

Works in IE8+ and most everything else. I’ll have to do some tests on what the performance gains are on desktop, but I thought the technique was interesting.