• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

Dion Almaer

Software, Development, Products

  • @dalmaer
  • LinkedIn
  • Medium
  • RSS
  • Show Search
Hide Search

Own The Cache

April 11, 2016 Leave a Comment


I appreciate what the browser does for me caching what it can, but man that black box feels… well too black boxy. It has a complex algorithm that attempts to work out what it should keep and what it can safely purge, but I know it isn’t optimal for me and my needs as an end user and a developer trying to serve users.

I think that with recent advancements we are getting closer to being able to really own the cache to better serve everyone:

Pre-fill the cache

Just as a teacher needs to be one class ahead of the student, if you can fill up the cache ahead of time the experience will feel fantastic. You can tell the browser to do just that with the various resource hints (prefetch, prerender etc), and with service workers you can make more fine-grained control with programatic access to a cache. It is a common pattern to go ahead and cache as many static assets as possible on the install of a service worker. You want to make sure the service worker JavaScript file itself isn’t cached too far in advance, but everything else that you can should be far future expired with a unique URL.

http://caniuse.com/#feat=link-rel-prerender

Cross Domain Caching

Your service worker can intercept URLs outside of your scope, which allows you to cache beyond your domain. But if both of us have a service worker, we are both getting and caching those Google Fonts. We can go one better with the new foreign fetch API. This allows Google to have a service worker that caches the fonts once, and everyone benefits from it. This should offer huge leverage for the common assets that we use on the Web, especially the bulky ones like fonts.

Back in the day I worked with the team to create the Hosted Libraries as a CDN for common JavaScript libraries. The thinking was, if we could get a lot of people using the same URL for jQuery version x.y.z, then there would be a higher likelihood that it would be in the cache, and thus available immediately.

We also talked a lot about the idea of not relying on the URL. What if we could put a hash into the script tag, thus allowing any URL that had the same file to reuse what was going on? Hmm, well, how do you know if the file is right without downloading it (kinda defeating the point).

But it turns out that the hash is useful in another way, and thus we now have Subresource Integrity, where we can at least make sure that the downloaded file is the one that you wanted to download and execute.

http://caniuse.com/#feat=subresource-integrity

Oops

Have you ever made a mistake and set a far future header on the wrong resource by mistake? It is quite scary that a bad header can mean that a file is lost to some browser caches for good. Whenever making important changes to headers I feel like I am on a mission in space where one wrong move and the tether to my ship will my users will drift off into space with no way for me to fix them.

I would love a way for my service worker to be able to be that tether, so I could tell the browser “hey, if you have a file that matches this URL, can you reset the cache header because I messed up? er, kthankssorry!”

In general I love the trend of empowering developers to do what makes sense for them, by getting more and more access to the browser, but only when needed.

Share this:

  • Twitter
  • Facebook

Tagged With: JavaScript, Progressive Web App, Web Development

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Twitter

My Tweets

Recent Posts

  • Generative AI: It’s Time to Get Into First Gear
  • Developer Docs + GenAI = ❤️
  • We keep confusing efficacy for effectiveness
  • The holy grail of a Web SDK
  • The rise of the extensible app platforms

Follow

  • LinkedIn
  • Medium
  • RSS
  • Twitter

Tags

3d Touch 2016 Active Recall Adaptive Design Agile Amazon Echo Android Android Development Apple Application Apps Artificial Intelligence Autocorrect blog Bots Brain Calendar Career Advice Cloud Computing Coding Cognitive Bias Commerce Communication Companies Conference Consciousness Cooking Cricket Cross Platform Deadline Delivery Design Desktop Developer Advocacy Developer Experience Developer Platform Developer Productivity Developer Relations Developers Developer Tools Development Distributed Teams Documentation DX Ecosystem Education Energy Engineering Engineering Mangement Entrepreneurship Exercise Family Fitness Founders Future GenAI Gender Equality Google Google Developer Google IO Habits Health HR JavaScript Jobs Jquery Kids Stories Kotlin Language Leadership Learning Lottery Machine Learning Management Messaging Metrics Micro Learning Microservices Microsoft Mobile Mobile App Development Mobile Apps Mobile Web Moving On NPM Open Source Organization Organization Design Pair Programming Paren Parenting Path Performance Platform Platform Thinking Politics Product Design Product Development Productivity Product Management Product Metrics Programming Progress Progressive Enhancement Progressive Web App Project Management Psychology Push Notifications pwa QA Rails React Reactive Remix Remote Working Resilience Ruby on Rails Screentime Self Improvement Service Worker Sharing Economy Shipping Shopify Short Story Silicon Valley Slack Software Software Development Spaced Repetition Speaking Startup Steve Jobs Study Teaching Team Building Tech Tech Ecosystems Technical Writing Technology Tools Transportation TV Series Twitter Typescript Uber UI Unknown User Experience User Testing UX vitals Voice Walmart Web Web Components Web Development Web Extensions Web Frameworks Web Performance Web Platform WWDC Yarn

Subscribe via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

Archives

  • January 2023
  • September 2022
  • June 2022
  • May 2022
  • April 2022
  • March 2022
  • February 2022
  • November 2021
  • August 2021
  • July 2021
  • February 2021
  • January 2021
  • May 2020
  • April 2020
  • October 2019
  • August 2019
  • July 2019
  • June 2019
  • April 2019
  • March 2019
  • January 2019
  • October 2018
  • August 2018
  • July 2018
  • May 2018
  • February 2018
  • December 2017
  • November 2017
  • September 2017
  • August 2017
  • July 2017
  • May 2017
  • April 2017
  • March 2017
  • February 2017
  • January 2017
  • December 2016
  • November 2016
  • October 2016
  • September 2016
  • August 2016
  • July 2016
  • June 2016
  • May 2016
  • April 2016
  • March 2016
  • February 2016
  • January 2016
  • December 2015
  • November 2015
  • October 2015
  • September 2015
  • August 2015
  • July 2015
  • June 2015
  • May 2015
  • April 2015
  • March 2015
  • February 2015
  • January 2015
  • December 2014
  • November 2014
  • October 2014
  • September 2014
  • August 2014
  • July 2014
  • June 2014
  • May 2014
  • April 2014
  • March 2014
  • February 2014
  • December 2013
  • November 2013
  • October 2013
  • September 2013
  • August 2013
  • July 2013
  • June 2013
  • May 2013
  • April 2013
  • March 2013
  • February 2013
  • December 2012
  • November 2012
  • October 2012
  • September 2012
  • August 2012

Search

Subscribe

RSS feed RSS - Posts

The right thing to do, is the right thing to do.

The right thing to do, is the right thing to do.

Dion Almaer

Copyright © 2023 · Log in