Gatsby 2.0, a React based web and app generator, released with improved speeds of upto 75%

Gatsby.js or more commonly known as Gatsby is a React-based website and app generator. It is powered by GraphQL and is used as a static site generator. But it’s not all static, it can be viewed more like a modern front end framework. It is used for creating blogs, apps ecommerce sites, and documentation. Yesterday the second major release, Gatsby 2.0 was released.

Gatsby 2.0 comes 18 months after the first major release and has the hard work of the Gatsby core team and nearly 315 contributors.

This second major release is focused on performance and developer experience. The highlights are 75% reduced build times, JavaScript client runtime by shrunk by 31%. Gatsby’s core dependencies are also upgraded to their latest versions: webpack 4, Babel 7, React 16.5.

Gatsby 2.0 has faster site building

The focus is heavily on improving build speeds for v2 and there are significant speed improvements across various parts of the build pipeline.

The improvements include:

• Three to four times improved server side rendering performance due to React 16
• Less memory usage for server rendering pages
• Many speedups to JavaScript and CSS bundling with webpack 4
• A pull called “hulksmash” made many small fixes to refactor slow algorithms
• All available cores are used for rendering server pages

JavaScript client runtime reduced by 31%

The core JavaScript shipped with every Gatsby site is shrunk by 31%. Less use of JavaScript means faster websites. The core JavaScript size in Gatsby 1.0 was 78.5kb and in Gatsby 2.0 it is 53.9kb, both are sizes of GZIP files. The reduced sizes are largely due to the hard work done by the libraries.

The code size is decreased by 30% in React 16. That is 34.8kb from the previous 49.8kb in React 15. The routers are switched from react-router to @reach/router bringing a 25% smaller bundle of 6kb from 8kb.

For a complete list of changes, visit the Gatsby Blog. To know more visit their documentation and GitHub.

Read next

low.js, Node.js port for embedded systems

Browser based Visualization made easy with the new P5.js

Deno, an attempt to fix Node.js flaws, is rewritten in Rust