Как отследить прогресс кэшируемых страниц Service Worker в процентах?

Question

[carbanak01]

Доброго времени суток !
Столкнулся с такой проблемой: "когда сервис воркер запускается появляется на сайте лоадер с гифкой крутящей шестерёнки, и при завершении лоадер удаляется.
Как бы я не пытался, я не могу передать прогресс кэширования в этот лоадер в процентах.( или по другому сделать индикатор загрузки)
Кэшируемых страниц где то 296, он загружается долго, поэтому я хочу сделать так чтобы посетитель знал когда закончится процесс."

// Check for Service Worker API support.
    var enabled = true;
    if (enabled) {
        const cacheId = 'gastro.vseopecheni.ru19';
        if ('serviceWorker' in navigator && localStorage['auth'] === 'true') {
            var removeNotification = () => {
                let notification = document.getElementsByClassName('js_sw-caching')[0];
                if(notification) {
                    notification.remove()
                }    
            }
            
            var addNitification = (persent = 0) => {
                var bodyEl = $('body');
                bodyEl.prepend('<p class="js_sw-caching"><span class="percent_caching">0</span>%<img src="/img/loaderimg.gif"> Подождите, идет кеширование</p>');
                
            }
            
            
            //Register service worker
            window.addEventListener('load', function() {
                
                navigator.serviceWorker.register('sw.js')
                    .then(function (reg) {
                        addNitification();
                        if(reg && reg.installing){
                            //We register new service worker and should wait for caching
                            reg.installing.onstatechange = function(event){
                                if(event.target.state === 'installed'){
                                    removeNotification();
                                }
                            };
                        } else {
                            removeNotification();
                        }
                        console.log('Service Worker registered');
                    })
                    .then(() => navigator.serviceWorker.ready.then((worker) => {
                        worker.sync.register('syncdata');
                        console.log('service worker start');
                    }))
                    .catch((err) => console.log(err));
                    
                    var buttonUpdate = $('.cache_del');
                    buttonUpdate.click(function(e) {
                        e.preventDefault();
                        
                        navigator.serviceWorker.getRegistrations().then(function(registrations){
                         for(let registration of registrations) {
                          console.log('update Serwice Worker');
                          registration.unregister();
                          window.location.reload();
                        }
                        })
                    });
            });
        }
    }