After upgrading to Gatsby v3 I noticed builds on netlify seemed to be taking a long time.
The main component taking time on builds seemed to be netlify cms.
NetlifyCMS React Component #
Changed netlify-cms to use external pre-built js to speed up build times.
The main difference between using the netlify cms react component & using pre-built js from netlify is the post preview when editing in netlify cms.
It is possible to set custom css styles for the preview pane on pre-built netlify-cms using CMS.registerPreviewStyle
.
Cleanup Dependencies #
Removed some dependencies which are no longer required for the blog.
Deploy Times #
Before #
4:44:35 PM: success Building production JavaScript and CSS bundles - 144.258s
...
4:44:52 PM: info Done building in 187.134201731 sec
4:44:52 PM: Done in 188.06s.
...
4:44:59 PM: Site is live ✨
4:47:01 PM: Finished processing build request in 10m9.217468818s
After #
7:26:46 PM: success Building production JavaScript and CSS bundles - 60.790s
...
7:26:59 PM: info Done building in 92.066096274 sec
7:26:59 PM: Done in 92.34s.
...
7:27:26 PM: Site is live ✨
7:28:40 PM: Finished processing build request in 3m57.922657014s
netlify.toml Tweaks #
As I had disabled gatsby-plugin-netlify due to a problem with webpack on upgrading gatsby I added some default header rules with basic security headers.
Default Header Rules #
X-Frame-Options = "DENY"
X-XSS-Protection = "1; mode=block"
X-Content-Type-Options = "nosniff"
Referrer-Policy = "same-origin"
Redirects #
A cool feature with netlify is the ability to set redirects allowing me to redirect common RSS uri's (/feed
, /rss
) to rss.xml
Redirects can also forward to external websites.
I added redirects to my github & twitter profiles. (/gh
, /github
, /twitter
)
[[redirects]]
from = "/github"
to = "https://github.com/equk"
status = 301
force = true
Pull Requests
Dependency Cleanup & Quicker Build Tweaks
Netlify Tweaks (Header Rules & Redirects)
The source for the site is available on github.
Webmentions
No Comments Yet