From 760caf247c6d80bcccef32841632e24eb24c891b Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Wed, 11 Nov 2020 19:45:55 +0700 Subject: [PATCH 01/10] docs: 2.26 release notes (WIP) --- docs/release-notes/v2.26/index.md | 64 +++++++++++++++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 docs/release-notes/v2.26/index.md diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md new file mode 100644 index 0000000000000..f262c61858988 --- /dev/null +++ b/docs/release-notes/v2.26/index.md @@ -0,0 +1,64 @@ +# November.1 2020 (version 2.26) + +--- + +Welcome to the November.1 2020 release of Gatsby (version 2.26). Key highlights of this release: + +- [New Image Plugin](#new-gatsby-image-beta) - access static images without GraphQL, high Lighthouse scores again +- [File System Route API](#file-system-route-api) - create pages using filename conventions +- [New Release Process](#new-release-process) - more stability and clarity around Gatsby releases +- [gatsby-source-contentful v4.0](#gatsby-source-contentful) - new RichText implementation + +Other notable changes: + +- [Enable compression in the dev server](#enable-compression-in-the-dev-server) - speeds up remote previews +- [gatsby-plugin-mdx](#gatsby-plugin-mdx) - performance improvements +- [Notable bug-fixes](#) + +Sneak peek to next releases: + +- [Queries on Demand](#) - quicker `develop` startup for big sites +- [create-gatsby](#) - better `gatsby new` +- [Experimental: Lazy images in develop](#) + +**Bleeding Edge:** Want to try new features as soon as possible? Install `gatsby@next` and let us know +if you have any [issues](https://github.com/gatsbyjs/gatsby/issues). + +### New Gatsby Image (Beta) + +TODOC + +- [README](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image) +- [Discussion](https://github.com/gatsbyjs/gatsby/discussions/27950) + +### File System Route API + +TODOC + +### New Release Process + +TODOC + +### Enable compression in the dev server + +TODOC + +### gatsby-source-contentful + +TODOC + +### gatsby-plugin-mdx + +TODOC + +## Notable fixes + +TODOC + +- [1234](https://github.com/gatsby/gatsby/issues/1234): Example + +## Thank you + +A big **Thank You** to the following community members who contributed to this release: + +TODOC From 08de8a51acd1f969adf86e85a4974ca733aec505 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Thu, 12 Nov 2020 13:24:32 +0700 Subject: [PATCH 02/10] docs: 2.26 release notes --- docs/release-notes/v2.26/index.md | 144 ++++++++++++++++++++++++------ 1 file changed, 115 insertions(+), 29 deletions(-) diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md index f262c61858988..42e182d96bdd7 100644 --- a/docs/release-notes/v2.26/index.md +++ b/docs/release-notes/v2.26/index.md @@ -1,64 +1,150 @@ -# November.1 2020 (version 2.26) +--- +date: "2020-11-12" +version: "2.26.0" +--- + +# [v2.26](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.26.0-next.0...gatsby@2.27.0-next.0) (November 2020) --- -Welcome to the November.1 2020 release of Gatsby (version 2.26). Key highlights of this release: +Welcome to `gatsby@2.26.0` release (November 2020). +Key highlights of this release: -- [New Image Plugin](#new-gatsby-image-beta) - access static images without GraphQL, high Lighthouse scores again -- [File System Route API](#file-system-route-api) - create pages using filename conventions +- [New Image Plugin](#gatsby-plugin-image010-beta) - access static images without GraphQL, high Lighthouse scores again +- [File System Route API](#file-system-route-api) - create pages from your data using filename conventions - [New Release Process](#new-release-process) - more stability and clarity around Gatsby releases -- [gatsby-source-contentful v4.0](#gatsby-source-contentful) - new RichText implementation +- [gatsby-source-contentful v4.0](#gatsby-source-contentful400) - new RichText implementation, performance improvements Other notable changes: +- [gatsby-plugin-mdx](#gatsby-plugin-mdx140) - performance improvements - [Enable compression in the dev server](#enable-compression-in-the-dev-server) - speeds up remote previews -- [gatsby-plugin-mdx](#gatsby-plugin-mdx) - performance improvements -- [Notable bug-fixes](#) Sneak peek to next releases: -- [Queries on Demand](#) - quicker `develop` startup for big sites -- [create-gatsby](#) - better `gatsby new` -- [Experimental: Lazy images in develop](#) +- [Queries on Demand](#queries-on-demand) - improves `gatsby develop` bootup time +- [Experimental: Lazy images in develop](#experimental-lazy-images-in-develop) +- [Documentation Reorganization](#documentation-reorganization) **Bleeding Edge:** Want to try new features as soon as possible? Install `gatsby@next` and let us know if you have any [issues](https://github.com/gatsbyjs/gatsby/issues). -### New Gatsby Image (Beta) +### New Release Process -TODOC - -- [README](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image) -- [Discussion](https://github.com/gatsbyjs/gatsby/discussions/27950) +We are evaluating a new process that should bring more stability and clarity +to Gatsby releases. ### File System Route API -TODOC +This new API enables you to create pages from your GraphQL data using filename conventions, +e.g. to create individual blog post pages for your blog. -### New Release Process +Some examples: -TODOC +- `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` + +See [Full Documentation](https://www.gatsbyjs.com/docs/file-system-route-api/), +[examples](https://github.com/gatsbyjs/gatsby/tree/master/examples/route-api) +and related PR [#27424](https://github.com/gatsbyjs/gatsby/pull/27424). ### Enable compression in the dev server -TODOC +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](https://github.com/gatsbyjs/gatsby/pull/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`. + +- [Full announcement and discussion](https://github.com/gatsbyjs/gatsby/discussions/27950) +- [README](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image) + +## 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](https://github.com/gatsbyjs/gatsby/pull/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](https://github.com/gatsby/gatsby/issues/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](https://github.com/gatsbyjs/gatsby/discussions/27620) if you have any issues with it): + +``` +npm install gatsby@qod +``` + +Enable in your `gatsby-config.js`: + +```js +module.exports = { + // your existing configuration + __experimentalQueryOnDemand: true, +} +``` + +[Details and discussion](https://github.com/gatsbyjs/gatsby/discussions/27620). + +### 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. -### gatsby-source-contentful +Try early alpha (and [let us know](https://github.com/gatsbyjs/gatsby/discussions/27603) if you have any issues with it): -TODOC +``` +npm install gatsby-plugin-sharp@lazy-images +``` -### gatsby-plugin-mdx +Enable in your `gatsby-config.js`: -TODOC +```js +// in gatsby-config.js +{ + resolve: 'gatsby-plugin-sharp', + options: { + experimentalDisableLazyProcessing: true, + } +} +``` -## Notable fixes +[Details and discussion](https://github.com/gatsbyjs/gatsby/discussions/27603). -TODOC +### Documentation Reorganization -- [1234](https://github.com/gatsby/gatsby/issues/1234): Example +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. -## Thank you +[Announcement and discussion](https://github.com/gatsbyjs/gatsby/discussions/27856). -A big **Thank You** to the following community members who contributed to this release: +## Contributors -TODOC +A big **Thank You** to [everyone who contributed](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.26.0-next.0...gatsby@2.27.0-next.0) to this release ๐Ÿ’œ From 145c6bcfec6c4b20fb8c4d25490d9f797efa8be4 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Thu, 12 Nov 2020 15:11:31 +0700 Subject: [PATCH 03/10] examples for gatsby-plugin-image --- docs/release-notes/v2.26/index.md | 51 ++++++++++++++++++++++++++++--- 1 file changed, 47 insertions(+), 4 deletions(-) diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md index 42e182d96bdd7..8de5cd652047a 100644 --- a/docs/release-notes/v2.26/index.md +++ b/docs/release-notes/v2.26/index.md @@ -57,11 +57,54 @@ See PR [#27948](https://github.com/gatsbyjs/gatsby/pull/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`. +[New image plugin](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image) 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`. -- [Full announcement and discussion](https://github.com/gatsbyjs/gatsby/discussions/27950) -- [README](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image) +### StaticImage + +This component is a new, simpler way to use Gatsby's image processing for static images without needing to write GraphQL queries: + +```js +import React from "react" +import { StaticImage } from "gatsby-plugin-image" + +export const Dino = () => ( + +) +``` + +### 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): + +```graphql +query { + file(relativePath: { eq: "plant.jpg" }) { + childImageSharp { + gatsbyImageData(maxWidth: 720, layout: FLUID, placeholder: TRACED_SVG) + } + } +} +``` + +You then use the data like this: + +```jsx +import { GatsbyImage, getImage } from "gatsby-plugin-image" + +export function Plant({ data }) { + const imageData = getImage(data.file) + return +} +``` + +- [Details, Migration guide and discussion](https://github.com/gatsbyjs/gatsby/discussions/27950) +- [Documentation](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image) ## gatsby-source-contentful@4.0.0 From fc38512c1fc0aab8cc7ec04422db98e86cc7f088 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Thu, 12 Nov 2020 15:29:57 +0700 Subject: [PATCH 04/10] Update docs/release-notes/v2.26/index.md Co-authored-by: Lennart --- docs/release-notes/v2.26/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md index 8de5cd652047a..fa0178ab06694 100644 --- a/docs/release-notes/v2.26/index.md +++ b/docs/release-notes/v2.26/index.md @@ -11,7 +11,7 @@ Welcome to `gatsby@2.26.0` release (November 2020). Key highlights of this release: - [New Image Plugin](#gatsby-plugin-image010-beta) - access static images without GraphQL, high Lighthouse scores again -- [File System Route API](#file-system-route-api) - create pages from your data using filename conventions +- [File System Route API](#file-system-route-api) - create routes from your data using filename conventions - [New Release Process](#new-release-process) - more stability and clarity around Gatsby releases - [gatsby-source-contentful v4.0](#gatsby-source-contentful400) - new RichText implementation, performance improvements From 62c9339ca856601fd9db35a26ae7fec2f0c0f3ac Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Thu, 12 Nov 2020 15:30:10 +0700 Subject: [PATCH 05/10] Update docs/release-notes/v2.26/index.md Co-authored-by: Lennart --- docs/release-notes/v2.26/index.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md index fa0178ab06694..5f035e771e675 100644 --- a/docs/release-notes/v2.26/index.md +++ b/docs/release-notes/v2.26/index.md @@ -36,8 +36,8 @@ to Gatsby releases. ### File System Route API -This new API enables you to create pages from your GraphQL data using filename conventions, -e.g. to create individual blog post pages for your blog. +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: From 6c96c3a50b4c8b3c33a79bcac1297bd2bb7ccba5 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Thu, 12 Nov 2020 15:30:38 +0700 Subject: [PATCH 06/10] Update docs/release-notes/v2.26/index.md Co-authored-by: Lennart --- docs/release-notes/v2.26/index.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md index 5f035e771e675..bf326f967ee70 100644 --- a/docs/release-notes/v2.26/index.md +++ b/docs/release-notes/v2.26/index.md @@ -43,6 +43,8 @@ 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](https://www.gatsbyjs.com/docs/file-system-route-api/), [examples](https://github.com/gatsbyjs/gatsby/tree/master/examples/route-api) From 175f9c9d7ff690040c87e11bbf151e58d669ebf6 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Thu, 12 Nov 2020 15:30:50 +0700 Subject: [PATCH 07/10] Update docs/release-notes/v2.26/index.md Co-authored-by: Lennart --- docs/release-notes/v2.26/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md index bf326f967ee70..74f1adb4c665f 100644 --- a/docs/release-notes/v2.26/index.md +++ b/docs/release-notes/v2.26/index.md @@ -46,7 +46,7 @@ Some examples: - `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](https://www.gatsbyjs.com/docs/file-system-route-api/), +See [full documentation](https://www.gatsbyjs.com/docs/file-system-route-api/), [examples](https://github.com/gatsbyjs/gatsby/tree/master/examples/route-api) and related PR [#27424](https://github.com/gatsbyjs/gatsby/pull/27424). From 29c16a63335f9044715fa477b381b08525a556f9 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Thu, 12 Nov 2020 23:47:10 +0700 Subject: [PATCH 08/10] Update docs/release-notes/v2.26/index.md Co-authored-by: Ward Peeters --- docs/release-notes/v2.26/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/release-notes/v2.26/index.md b/docs/release-notes/v2.26/index.md index 74f1adb4c665f..f1f57a4177fef 100644 --- a/docs/release-notes/v2.26/index.md +++ b/docs/release-notes/v2.26/index.md @@ -10,7 +10,7 @@ version: "2.26.0" Welcome to `gatsby@2.26.0` release (November 2020). Key highlights of this release: -- [New Image Plugin](#gatsby-plugin-image010-beta) - access static images without GraphQL, high Lighthouse scores again +- [New Image Plugin (beta)](#gatsby-plugin-image010-beta) - access static images without GraphQL, high Lighthouse scores again - [File System Route API](#file-system-route-api) - create routes from your data using filename conventions - [New Release Process](#new-release-process) - more stability and clarity around Gatsby releases - [gatsby-source-contentful v4.0](#gatsby-source-contentful400) - new RichText implementation, performance improvements From 660dbc713be9d479bc2e581f5a281259baa77603 Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Fri, 13 Nov 2020 01:00:20 +0700 Subject: [PATCH 09/10] Moved release notes to another location --- docs/{ => reference}/release-notes/v2.26/index.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename docs/{ => reference}/release-notes/v2.26/index.md (100%) diff --git a/docs/release-notes/v2.26/index.md b/docs/reference/release-notes/v2.26/index.md similarity index 100% rename from docs/release-notes/v2.26/index.md rename to docs/reference/release-notes/v2.26/index.md From 5058ed916f4e05d0f1ed5a124ea2e2758740120d Mon Sep 17 00:00:00 2001 From: Vladimir Razuvaev Date: Fri, 13 Nov 2020 01:03:43 +0700 Subject: [PATCH 10/10] Fixed link for the changelog --- docs/reference/release-notes/v2.26/index.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/reference/release-notes/v2.26/index.md b/docs/reference/release-notes/v2.26/index.md index f1f57a4177fef..920a8502a6ff5 100644 --- a/docs/reference/release-notes/v2.26/index.md +++ b/docs/reference/release-notes/v2.26/index.md @@ -3,7 +3,7 @@ date: "2020-11-12" version: "2.26.0" --- -# [v2.26](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.26.0-next.0...gatsby@2.27.0-next.0) (November 2020) +# [v2.26](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.26.0-next.0...gatsby@2.26.0) (November 2020) --- @@ -192,4 +192,4 @@ And that means having documentation that helps yโ€™all find the information you ## Contributors -A big **Thank You** to [everyone who contributed](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.26.0-next.0...gatsby@2.27.0-next.0) to this release ๐Ÿ’œ +A big **Thank You** to [everyone who contributed](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.26.0-next.0...gatsby@2.26.0) to this release ๐Ÿ’œ