Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update gatsby-plugin-netlify to allow caching JS files via HTTP headers #9245

Conversation

tanvibhakta
Copy link
Contributor

This PR closes #9151

Adds a line to apply recommended caching behavior on all /src/ files in a gatsby project served on netlify, increasing cached content and therefore performance. This also makes the plugin consistent with the documentation.

@pieh
Copy link
Contributor

pieh commented Oct 23, 2018

this is bit confusing - we will not have src directory in built site, can You elaborate a bit on how this works? I thought it should use paths inside public directory that get served by netlify hosting

@tanvibhakta
Copy link
Contributor Author

You are right, and I completely overlooked that. Will fix and re-push!

This commit writes regex to cache all files in the build system that are .js files and .js.map files. 

I am not considering caching the files in workbox because it seems like it is only useful to users of chrome?
It is important to cache workbox as they are the files that create the service workers.
@tanvibhakta
Copy link
Contributor Author

Unsure why the 'no-useless-escape' is being activated, without the escape charecter non-js files with 'js' in the name are also cached.

@pieh
Copy link
Contributor

pieh commented Oct 26, 2018

There is edge case that will be problematic with just caching all .js files - there might be scenario where there are .js files that are not generated by gatsby webpack in output directory and we don't want to cache them permanently.

We will need to read webpack manifest, extract .js (and I think .css files too) and we will want to cache those.

Unsure why the 'no-useless-escape' is being activated, without the escape charecter non-js files with 'js' in the name are also cached.

eslint isn't aware that this will be used as Regular Expressions, so we would need to opt out of that check in those lines. But we will also probably will need to drop that regex and target specific files because of my top part of my comment.

@@ -26,6 +26,8 @@ export const SECURITY_HEADERS = {

export const CACHING_HEADERS = {
"/static/*": [`Cache-Control: public, max-age=31536000, immutable`],
"/*\.js": [`Cache-Control: public, max-age=31536000, immutable`],

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why are .js files not in the static folder?

@chadfawcett
Copy link
Contributor

@pieh Would the list of assets found at assetsByChunkName in the public/webpack.stats.json file cover all the js and css assets that should be cached indefinitely?

@wardpeet
Copy link
Contributor

Would love to get this one in! @tanvibhakta if you feel like processing this feedback that would be great. It's probably better to open up a new branch from master and try @pieh's feedback.

@wardpeet wardpeet closed this Jan 11, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Documentation about caching javascripts assets needs an update
5 participants