Service Workers - Advanced Caching

Cache on Demand

Till now either we were caching all the dynamic requests or we can remove all the dynamic requests,
we can also cache on Demand , note that we can add responses to cache from front-end js codes as well this , so while we are doing some fetch we can decide whether we  want to cache its response or not .
also note that cache.add (some url)  can do both request for resource and cache it


ex


this function is a event Listener ,which is normal js function (not in sw.js) which  is adding some resource to cache so that in future those resources can be served from cache if needed

Also while using cache from front-end js file much check whether cache is available in that browser or not



Comments

Post a Comment

Popular posts from this blog

manifest file

Image
1. manifest.json file   we need to create a manifest .json file and need to add this file in the head section of all the pages         so   that configuration which we have written in this file will be applied to all the pages . ex- <link rel="manifest" href="/manifest.json"> 2.  what does manifest.json file contains    
Read more

service worker caching

Image
Static Elements Caching Adding different files to caches one by one , and also serving from service worker addAll for caching multiple files  Dynamic caching since we don't know all the requests which we require so we can dynamically cache those , if it is not found in the caches then first make request and then store response . Adding cache versioning why do we need cache vesrsions           If we will do some change in a file ,then if that file is already cached changes does  not reflect            since service worker will serve same old version of the files .           so we have to maintain different version of cache , also we need to clean previous version so                that files will be not served from previous version      code used   sw.js var CACHE_STATIC_NAME = 'stati...
Read more

Service Worker Basics

Image
Service worker runs on a separate single thread . Available for all the pages of the application. Service worker lives on even if browser is closed its a background process  it listen to events and react on events  service worker is attached with scope and tun in background  Events Listen by Service Worker   Fetch  Push Notification  Notification Interaction  Background Sync (store user response and send when internet connection is there)  Service Worker life cycle Service Worker LifeCycle Steps   Generally Index.html file includes app.js ( general code structure)   From  App.js we can register service worker    while registering it emits Install event    After installation is finished Activation event  will be triggered (note that if there is any old         version of service worker is running in some tab than this activation will be not trigg...
Read more