Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

SupportLog In

v2.26 Release Notes

Welcome to gatsby@2.26.0 release (November 2020). Key highlights of this release:

Other notable changes:

Sneak peek to next releases:

Bleeding Edge: Want to try new features as soon as possible? Install gatsby@next and let us know if you have any issues.

New Release Process

We are evaluating a new process that should bring more stability and clarity to Gatsby releases.

File System Route API

This new API enables you to create routes from your GraphQL data using filename conventions, e.g. to create individual blog post pages for your blog. It also allows for creating client-only routes more easily.

Some examples:

  • src/pages/products/{Product.name}.js will generate pages for all products with a path like /products/burger
  • src/pages/products/{Product.fields__sku}.js will generate pages for all products with a path like /products/001923
  • src/pages/users/[id].js will generate a route like /users/:id
  • src/pages/image/[...].js will generate a route like /image/*

See full documentation, examples and related PR #27424.

Enable compression in the dev server

This lowers the amount of data transferred for one site especially in remote situations. Most of that drop was from the commons.js bundle.

See PR #27948 for details.

gatsby-plugin-image@0.1.0 (beta)

New image plugin to replace gatsby-image, which greatly improves performance (Lighthouse 💯 again) and adds easy static images (no GraphQL). Part of it is also a new, simpler API for gatsby-transformer-sharp.

StaticImage

This component is a new, simpler way to use Gatsby’s image processing for static images without needing to write GraphQL queries:

GatsbyImage

This is a complete rewrite of the Gatsby Image component, using native lazy loading whenever possible. In our tests it allows sites whose Lighthouse scores dropped in recent updates to get back to 100s across the board.

Simpler GraphQL for non-static images

Instead of having to remember lots of different fragments for different image types, you can pass all your options as field arguments (and get inline help in GraphiQL):

You then use the data like this:

gatsby-source-contentful@4.0.0

New Rich Text Implementation

Breaking Change: New rich text implementation for performance and usability. This is only a breaking change if you rely on the Rich Text Contentful field type.

See PR #25249 description for details and migration guide.

Performance improvements

The max of pageLimit option was raised from 100 to 1000 (on Contentful’s side) which should lead to significant reduction of remote fetching times.

Note that the default value for the pageLimit option is still 100, so you need to change it manually in your site config to see performance improvements.

Due to technical limitations, the response payload size is still bound by a hard chunk download size, so it is possible you may need to use a lower value for your particular site.

gatsby-plugin-mdx@1.4.0

There was a significant performance improvement by making a certain node fetching step lazy. This is especially noticeable at scale. See PR #27937 for details.

Work in progress

Queries on Demand

When developing a Gatsby site there’s no need to run all graphql queries before serving the site. Instead, Gatsby could run queries for pages as they’re requested by a browser. This would avoid having to wait for slower queries (like image processing) if you’re editing an unrelated part of a site.

Try early alpha (and let us know if you have any issues with it):

Enable in your gatsby-config.js:

Details and discussion.

Experimental: Lazy images in develop

We’ve got some feedback that the more image-heavy your website gets, the slower gatsby develop. This experimental version of gatsby-plugin-sharp only does image processing when the page gets requested.

Try early alpha (and let us know if you have any issues with it):

Lazy images are enabled by-default in this version.

Details and discussion.

Documentation Reorganization

We’ve heard repeatedly from the community that Gatsby is a powerful tool, but it has a steep learning curve. We want to make it easier to get started with Gatsby. And that means having documentation that helps y’all find the information you need when you need it.

Announcement and discussion.

Contributors

A big Thank You to our community who contributed to this release 💜

Start building today on Netlify!
Edit this page on GitHub
© 2024 Gatsby, Inc.
Accessibility StatementBrand Guidelines
Terms of UsePrivacy Policy