mischnic / parcel-plugin-sw-cache

📦👷 Parcel plugin for caching using a service worker
https://npm.im/parcel-plugin-sw-cache
MIT License
47 stars 6 forks source link

Not caching index.html #3

Closed goofblob closed 6 years ago

goofblob commented 6 years ago

Performance scenario:

On a current project getting index.html from Github Pages takes just over 300ms. And from disk cache about 30ms.

But getting it from the service worker takes 800ms+. So I do not want to cache index.html. I have achieved this with the following:

"globDirectory": "./dist", "globPatterns": [ "**\/*.{css,js}" ], "globIgnores": [ "./index.html" ],

However, workbox-sw still creates workbox.routing.registerNavigationRoute("index.html"); in sw.js. And because index.html is not cache, it is not served and the website simply does not work.

I have hacked my way around this by removing that line from sw.js manually -- by adding a sed -i /registerNavigationRoute/d dist/sw.js at the end of my build script. But this seems inelegant.

Is there a way to tell the plug-in to not do the registerNavigationRoute?

mischnic commented 6 years ago

SEE END FOR THE REAL SOLUTION

The default configuration tries to stay (somewhat) compatible with the environment of the parcel dev server. It, as is common for a PWA app, serves index.html instead of a 404 error to enable client side routing (I guess). So to override the default

    navigateFallback: publicURL+"/index.html",
    "templatedUrls": {
        "/": ["index.html"]
    }

you need to set the configuration to :

"cache": {
    "globIgnores": [
        "index.html"
    ],
    "navigateFallback": "undefined",
    "templatedUrls": "undefined"
}

Be sure to use the most recent version from the repository and not npm (the translation from json's "undefined" to javascript's undefined had to be added in febbdab):

"devDependencies":{
    "parcel-plugin-sw-cache": "mischnic/parcel-plugin-sw-cache"
}

EDIT: Apart from that "workaround", the real problem is that the file isn't getting cached properly. Solution

"cache":{
    "ignoreUrlParametersMatching": [["#\/(?:video.*)?$"]]
}

This will rewrite the url, so that every subpage will also be served with the index.

goofblob commented 6 years ago

Outstanding work!

Thank you. I hope you keep maintaining this. Parcel definitely needs it.