[PWA] 11. Serve skeleton cache for root

Intead of cache the root floder, we want to cache skeleton instead.

self.addEventListener('install', function (event) {
event.waitUntil(
caches.open(staticCacheName).then(function (cache) {
return cache.addAll([
'/skeleton',
'js/main.js',
'css/main.css',
'imgs/icon.png',
'https://fonts.gstatic.com/s/roboto/v15/2UX7WLTfW3W8TclTUvlFyQ.woff',
'https://fonts.gstatic.com/s/roboto/v15/d-6IYplOFocCacKzxwXSOD8E0i7KZn-EPnyo3HZu7kw.woff'
]);
})
);
});

Respond to requests for the root page with thepage skeleton from the cache:

self.addEventListener('fetch', function (event) {
// use the page skeleton from the cache
let requestUrl = new URL(event.request.url);
if(requestUrl.origin === location.origin){
if(requestUrl.pathname === '/'){
event.respondWith(
caches.match('/skeleton')
);
return;
}
}

event.respondWith(
caches.match(event.request).then(function (response) {
return response || fetch(event.request);
})
);
});