Gatsby is a website framework designed to build fast React-based websites. Prismic’s Gatsby plugins work great. They provide:
- Easy access to your website content
- Immediate content preview sessions
- The ability to host on Gatsby Cloud
Today, we’re releasing a new version of our Gatsby integration, Version 6.
The new version includes the following updates:
- 5️⃣ Gatsby 5 support
- 🏎️ Faster, more performant previews
- 🦾 A complete rewrite to simplify the plugins’ underlying code
Most projects can be upgraded in less than an hour.
Gatsby + Prismic v6 will be the last major version to be officially released by Prismic. Documentation for Prismic’s Gatsby plugins has moved from the Prismic Docs website to the plugins’ GitHub repository.
For more details on what this change means for you and your projects, see Our future plans for Gatsby + Prismic below.
Prismic plugins are now compatible with Gatsby 5
Gatsby 5 includes a number of improvements and optimizations that make building better websites even easier than before. Take advantage of Gatsby’s new Head API, Script component, and Slice API (not to be confused with Prismic’s Slices!) once you update.
gatsby-plugin-prismic-previews does not currently support Gatsby’s Partial Hydration feature, currently in beta.
Prismic previews in Gatsby sites are now quicker
Previewing content while writing is crucial to many content writers’ workflow. A fast feedback loop leads to quick iterations and a shorter time to publish.
Prismic previews in Gatsby sites are now quicker, especially when previewing from Prismic repositories with many documents (think: >500 documents).
gatsby-plugin-prismic-previews uses a new strategy that minimizes the amount of Prismic documents fetched during a preview session, leading to shorter loading times.
gatsby-plugin-prismic-previews is now only loaded during a preview session. That means all of your website’s visitors won’t need to download code that only content writers need for previewing.
A complete rewrite
The new plugins have been rewritten from the ground up not only to improve performance but also to make it simpler to understand and contribute to.
If you ever ran into a bug with the previous versions and jumped into their code to debug it, you’ll know it wasn’t the most intuitive code to read. The new versions avoid clever code making it easier for everyone in the Gatsby + Prismic community to work on the plugins together.
As always, pull requests to improve the plugins or fix bugs are always welcome!
How to upgrade
First, update your project to Gatsby 5 (see the official migration guide).
Next, install the updated plugins:
npm install gatsby-source-prismic@latest npm install gatsby-plugin-prismic-previews@latest
Finally, update your project’s code to be compatible with the latest changes. The Gatsby + Prismic V5 to V6 Migration Guide walks you through each step.
Our future plans for Gatsby + Prismic
Today, we are releasing new versions of our Gatsby plugins:
Over the next two months, we will provide support to fix bugs in the new plugins and help developers upgrade their projects.
After that time, we plan to reduce our support and encourage the Gatsby + Prismic community to help maintain the plugins. We will continue to review and guide community contributions to the plugins.
We recommend building new React-based websites using Next.js rather than Gatsby going forward. We see more innovation from the Next.js team and believe simpler, more stable websites can be built with Next.js when compared to Gatsby. Our Next.js support is stronger than ever, with full support for the App Router, TypeScript, and Slice Machine.
If you have any questions about the updated plugins or our plans to reduce official support for Gatsby, please post them the Prismic Community forum.