Persist the Gatsby cache between Netlify builds for huge build speed improvements! ⚡️
NOTE: Netlify Build Plugins are in beta.
To install, add the following lines to your netlify.toml file:
[[plugins]]
package = "netlify-plugin-gatsby-cache"Note: The [[plugins]] line is required for each plugin, even if you have other plugins in your netlify.toml file already.
This plugin determines the location of your .cache folder by looking at the publish folder configured for Netlify deployment (this can be set in your netlify.toml in the [build] section). This means that if your Gatsby site successfully deploys, it will be cached as well with no config required! 🎉
Each Gatsby site is different, so build times vary widely between them, but one common slowdown in Gatsby builds is processing and transforming images. Gatsby is smart enough to check if these transformations have already been done and skip them, but in order to get that benefit in a build pipeline (e.g. Netlify) the public and .cache directories need to be preserved between builds. That’s what this plugin does!
On a site with 231 GraphQL queries, 1,871 images, and 224 pages, build times dropped by 75%:
- no cache: ✔ Netlify Build completed in 293207ms (build log) cache: ✔ Netlify Build completed in 72835ms (build log)
On a small site (5 GraphQL queries, no image processing, 32 pages), build times dropped by 30% when using this plugin:
no cache: ✔️ Netlify Build completed in 22072ms (build log)
- cache: ✔️ Netlify Build completed in 15543ms (build log)
tl;dr: Repeat builds with lots of images will be much faster. With few or no images, the difference will be there, but it won’t be as pronounced.
Check out Sarah Drasner’s excellent tutorial!