{"data":{"markdownRemark":{"html":"<p><span style=\"text-align: center; display: block;\">Part of <a href=\"/gatsby-v2\">a series on Gatsby v2</a></span></p>\n<p>Gatsby v2 is in beta. Awesome. What does that mean? What changes come with v2?</p>\n<blockquote>\n<p><strong>tl;dr</strong> - Gatsby v2 brings better data loading which supports giant sites, lets you use GraphQL in every component, and some other performance improvements.</p>\n</blockquote>\n<p>Gatsby v2 introduce a lot of changes under the hood. Some of those will affect you. See our <a href=\"/gatsby-v2-refactoring-cheat-sheet\">refactoring cheat sheet</a> for a quick summary. Great. What are the major changes?</p>\n<ul>\n<li>Data loading has been completely overhauled</li>\n<li>Faster and easier development experience</li>\n<li>GraphQL can now be used everywhere</li>\n</ul>\n<p>Those are the headline changes. We'll cover them one at a time.</p>\n<h2>Data loading</h2>\n<p>Gatsby ingests data. It sucks data into its own \"nodes\" system. Then it takes that data, and multiplies it by react components. Finally, it renders all of that to static files. But you knew that already.</p>\n<p>The static output essentially consists of two parts, components and data. In Gatsby v1, a list of every single page on your site was included as part of the HTML inside every single page. Think that one over for a second. With every new page, your built HTML files get bigger. Gatsby v1 breaks at around 1k or 2k pages.</p>\n<p>This has been completely changed in v2. This means several things.</p>\n<ul>\n<li>You can build sites with 50k or 100k pages with Gatsby v2</li>\n<li>Hot reloading happens much faster during development</li>\n<li>Your HTML pages will be smaller, and so load faster</li>\n</ul>\n<p>Bottom line, this is a huge change, and a massive win for Gatsby.</p>\n<h2>Improved dev experience</h2>\n<p>What does developer experience really mean? It means, how easy (and arguably how fun) is something to use. Gatsby is awesome. Gatsby sites are scary fast, super safe, and crazy simple to host. Getting started, learning Gatsby, can feel a bit mind bending at first.</p>\n<p>The Gatsby team (specifically Shannon) has been doing some awesome UX research around developer experience. This has lead to lots of improvements in how Gatsby works. Not only with Gatsby itself, but also in the ecosystem. Thanks Shannon, Gatsby is getting easier to use by the day.</p>\n<p>There are a handful of developer experience upgrades in Gatsby v2.</p>\n<p>Data loading. We talked about this already. Hot reloads are faster with v2. Nice. Really nice on bigger sites.</p>\n<p>Renames. There have been a few significant variable renames in v2. The new names are clearer, easier to understand. Sweet.</p>\n<p>Dependency upgrades. Gatsby is now using newer versions of its underlying packages. That means React v16, Babel v7 and webpack v4. These changes may appear subtle, but have nice payoffs. A personal favourite is support for <a href=\"https://reactjs.org/blog/2017/11/28/react-v16.2.0-fragment-support.html\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">React Fragments</a>.</p>\n<h2>GraphQL everywhere</h2>\n<p>Where you can and cannot use GraphQL in v1 is slightly confusing. With v2 it's much simpler. You can use GraphQL anywhere via <code class=\"language-text\">StaticQuery</code>. Then you can use the same, page specific, GraphQL queries in any page components. Easy, simple, clean.</p>\n<p>We'll write more about <code class=\"language-text\">StaticQuery</code> soon, and try to remember to update this post with a link. Please ping us in the comments if we forget!</p>\n<h2>Other changes</h2>\n<p>There are a lot of other changes with Gatsby v2. Check out these links for more:</p>\n<ul>\n<li><a href=\"https://www.gatsbyjs.org/blog/2018-06-16-announcing-gatsby-v2-beta-launch/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Gatsby v2 announcement blog post</a></li>\n<li><a href=\"https://github.com/gatsbyjs/gatsby/projects/2\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Gatsby v2 roadmap</a></li>\n</ul>","excerpt":"Part of  a series on Gatsby v2 Gatsby v2 is in beta. Awesome. What does that mean? What changes come with v2? tl;dr  - Gatsby v2 brings…","timeToRead":3,"frontmatter":{"date":"July 17, 2018","path":"/whats-new-in-gatsby-v2","title":"What's new in Gatsby v2"}},"relatedPosts":{"edges":[{"node":{"id":"88e68246-cc05-58c4-9cb0-9fa48bc65259","frontmatter":{"title":"Gatsby v2 refactoring cheat sheet","path":"/gatsby-v2-refactoring-cheat-sheet","tags":["v2","cheat sheet"]}}},{"node":{"id":"1aef1790-d364-5a28-ade8-d6196727902c","frontmatter":{"title":"Getting started with Gatsby v2","path":"/getting-started-with-gatsby-v2","tags":["v2"]}}},{"node":{"id":"c8ef7f7d-dffc-5aae-b6a0-0084762b39f0","frontmatter":{"title":"Gatsby v2","path":"/gatsby-v2","tags":["v2","beta"]}}},{"node":{"id":"43eb2d0b-dabd-5c3d-8f96-41eeffd1c003","frontmatter":{"title":"How do layouts work in Gatsby v2","path":"/how-do-layouts-work-in-gatsby-v2","tags":["v2"]}}},{"node":{"id":"53048efa-8e60-5988-8f54-73bf441a1ab2","frontmatter":{"title":"Should I rebuild my site for Gatsby v2?","path":"/should-i-rebuild-my-site-for-gatsby-v2","tags":["v2"]}}},{"node":{"id":"36c6d2e1-eff2-5062-aee4-518ccb6f4ea8","frontmatter":{"title":"StaticQuery in Gatsby v2","path":"/staticquery-in-gatsby-v2","tags":["v2"]}}},{"node":{"id":"9a16f7fc-6fa5-5328-816c-35542c1c38ec","frontmatter":{"title":"When should I upgrade to Gatsby v2?","path":"/when-should-i-upgrade-to-gatsby-v2","tags":["v2"]}}},{"node":{"id":"979a29c5-06ed-5582-b0be-4c37f26b65d4","frontmatter":{"title":"Enable absolute imports for Gatsby v2","path":"/enable-absolute-imports-for-gatsby-v2","tags":["v2"]}}},{"node":{"id":"5eb98a7e-3fd2-5edf-a9f8-44f5e25da39d","frontmatter":{"title":"GatsbyJS source plugin for eventbrite.com","path":"/gatsby-source-eventbrite","tags":["v2","source","eventbrite"]}}},{"node":{"id":"374bf18f-0f86-54c8-bdb1-f051527d8210","frontmatter":{"title":"WordPress starter for GatsbyJS","path":"/gatsby-starter-wordpress","tags":["v2","starter","wordpress"]}}},{"node":{"id":"737d2352-faae-5e91-b298-07399aaf3b1c","frontmatter":{"title":"Starter project for GatsbyJS","path":"/gatsby-central-starter","tags":["v2","starter"]}}}]},"allCommentsJson":null,"allRatingsJson":null},"pageContext":{"tags":["v2","beta"]}}