Using Service Workers to improve dynamic image delivery in the browser
summary
How to use Service Workers in the browser to detect network speed and dynamically adapt image delivery—serving different image versions or formats to improve load times for users on slow devices or poor connectivity. Covers practical considerations when implementing this technique in front-end code and describes a low-cost approach that achieves capabilities similar to those offered by commercial image infrastructure providers.
AI-written summary · about
chapters (10)
- 0:00Start
- 2:18Mobile Networks can be Slow & Inconsistent
- 5:26Real-time network information Network Information API
- 8:01Real-time quality change Imagekit.io-real-time image optimization product
- 10:29Installing a Service Worker
- 12:59Problem with browser-caching
- 13:31Implement Network-based caching
- 14:18Code Sample Network-based cache maintenance
- 18:09Cache Management using Google Workbox
- 19:02Updating cache put time and expiry
related talks
38mImproving Media Content Performance with Service Workers
32mThe ServiceWorker is coming, look busy
27mAnd Now You Understand Service Workers
30mBuilding Faster, More Resilient Apps with Service Worker: A Caching Strategy Deep Dive
01h 01mService Workers: Using Hard-Won Experience and Looking Ahead
05mLightning talk: Service Workers, use them
17mService Worker and the Appification of the Web
01h 03mNew Adventures in Responsive Web Design