{"componentChunkName":"component---src-templates-blog-js","path":"/blog/2018/12/19/react-v-16-7.html","result":{"data":{"markdownRemark":{"html":"<p>Our latest release includes an important performance bugfix for <code class=\"gatsby-code-text\">React.lazy</code>. Although there are no API changes, we’re releasing it as a minor instead of a patch.</p>\n<h2 id=\"why-is-this-bugfix-a-minor-instead-of-a-patch\"><a href=\"#why-is-this-bugfix-a-minor-instead-of-a-patch\" aria-hidden class=\"anchor\"><svg aria-hidden=\"true\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Why Is This Bugfix a Minor Instead of a Patch? </h2>\n<p>React follows <a href=\"/docs/faq-versioning.html\">semantic versioning</a>. Typically, this means that we use patch versions for bugfixes, and minors for new (non-breaking) features. However, we reserve the option to release minor versions even if they do not include new features. The motivation is to reserve patches for changes that have a very low chance of breaking. Patches are the most important type of release because they sometimes contain critical bugfixes. That means patch releases have a higher bar for reliability. It’s unacceptable for a patch to introduce additional bugs, because if people come to distrust patches, it compromises our ability to fix critical bugs when they arise — for example, to fix a security vulnerability.</p>\n<p>We never intend to ship bugs. React has a hard-earned reputation for stability, and we intend to keep it that way. We thoroughly test every version of React before releasing. This includes unit tests, generative (fuzzy) tests, integration tests, and internal dogfooding across tens of thousands of components. However, sometimes we make mistakes. That’s why, going forward, our policy will be that if a release contains non-trivial changes, we will bump the minor version, even if the external behavior is the same. We’ll also bump the minor when changing <code class=\"gatsby-code-text\">unstable_</code>-prefixed APIs.</p>\n<h2 id=\"can-i-use-hooks-yet\"><a href=\"#can-i-use-hooks-yet\" aria-hidden class=\"anchor\"><svg aria-hidden=\"true\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Can I Use Hooks Yet? </h2>\n<p>Not yet, but soon!</p>\n<p>At React Conf, we said that 16.7 would be the first release to include Hooks. This was a mistake. We shouldn’t have attached a specific version number to an unreleased feature. We’ll avoid this in the future.</p>\n<p>Although 16.7 does not include Hooks, please do not infer anything about the timeline of the Hooks launch. Our plans for Hooks are unchanged:</p>\n<ul>\n<li>The <a href=\"https://github.com/reactjs/rfcs/pull/68\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Hooks proposal</a> was accepted (<a href=\"https://github.com/reactjs/rfcs/pull/68#issuecomment-439314884\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">with minor planned changes in response to feedback</a>).</li>\n<li>The <a href=\"https://github.com/facebook/react/commit/7bee9fbdd49aa5b9365a94b0ddf6db04bc1bf51c\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">implementation</a> was merged into the React repo (behind a feature flag).</li>\n<li>We’re currently in the testing phase, and you can expect a public release within a few months.</li>\n</ul>\n<p>We’ve heard from many people who want to start using Hooks in their apps. We also can’t wait to ship them! But because Hooks changes how we write React components, we are taking extra time to get the details right. We appreciate your patience as we prepare this exciting new feature for widespread, ahem, <em>use</em>.</p>\n<p>Learn more about <a href=\"/blog/2018/11/27/react-16-roadmap.html\">our roadmap</a> in our previous post.</p>\n<h2 id=\"installation\"><a href=\"#installation\" aria-hidden class=\"anchor\"><svg aria-hidden=\"true\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Installation </h2>\n<p>React v16.7.0 is available on the npm registry.</p>\n<p>To install React 16 with Yarn, run:</p>\n<div class=\"gatsby-highlight\" data-language=\"bash\"><pre class=\"gatsby-code-bash\"><code class=\"gatsby-code-bash\"><span class=\"token function\">yarn</span> <span class=\"token function\">add</span> react@^16.7.0 react-dom@^16.7.0</code></pre></div>\n<p>To install React 16 with npm, run:</p>\n<div class=\"gatsby-highlight\" data-language=\"bash\"><pre class=\"gatsby-code-bash\"><code class=\"gatsby-code-bash\"><span class=\"token function\">npm</span> <span class=\"token function\">install</span> --save react@^16.7.0 react-dom@^16.7.0</code></pre></div>\n<p>We also provide UMD builds of React via a CDN:</p>\n<div class=\"gatsby-highlight\" data-language=\"html\"><pre class=\"gatsby-code-html\"><code class=\"gatsby-code-html\"><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">crossorigin</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation attr-equals\">=</span><span class=\"token punctuation\">\"</span>https://unpkg.com/react@16/umd/react.production.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">></span></span>\n<span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;</span>script</span> <span class=\"token attr-name\">crossorigin</span> <span class=\"token attr-name\">src</span><span class=\"token attr-value\"><span class=\"token punctuation attr-equals\">=</span><span class=\"token punctuation\">\"</span>https://unpkg.com/react-dom@16/umd/react-dom.production.min.js<span class=\"token punctuation\">\"</span></span><span class=\"token punctuation\">></span></span><span class=\"token script\"></span><span class=\"token tag\"><span class=\"token tag\"><span class=\"token punctuation\">&lt;/</span>script</span><span class=\"token punctuation\">></span></span></code></pre></div>\n<p>Refer to the documentation for <a href=\"/docs/installation.html\">detailed installation instructions</a>.</p>\n<h2 id=\"changelog\"><a href=\"#changelog\" aria-hidden class=\"anchor\"><svg aria-hidden=\"true\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Changelog </h2>\n<h3 id=\"react-dom\"><a href=\"#react-dom\" aria-hidden class=\"anchor\"><svg aria-hidden=\"true\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>React DOM </h3>\n<ul>\n<li>Fix performance of <code class=\"gatsby-code-text\">React.lazy</code> for large numbers of lazily-loaded components. (<a href=\"http://github.com/acdlite\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@acdlite</a> in <a href=\"https://github.com/facebook/react/pull/14429\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14429</a>)</li>\n<li>Clear fields on unmount to avoid memory leaks. (<a href=\"http://github.com/trueadm\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@trueadm</a> in <a href=\"https://github.com/facebook/react/pull/14276\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14276</a>)</li>\n<li>Fix bug with SSR and context when mixing <code class=\"gatsby-code-text\">react-dom/server@16.6</code> and <code class=\"gatsby-code-text\">react@&lt;16.6</code>. (<a href=\"http://github.com/gaearon\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@gaearon</a> in <a href=\"https://github.com/facebook/react/pull/14291\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14291</a>)</li>\n<li>Fix a performance regression in profiling mode. (<a href=\"http://github.com/bvaughn\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@bvaughn</a> in <a href=\"https://github.com/facebook/react/pull/14383\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14383</a>)</li>\n</ul>\n<h3 id=\"scheduler-experimental\"><a href=\"#scheduler-experimental\" aria-hidden class=\"anchor\"><svg aria-hidden=\"true\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Scheduler (Experimental) </h3>\n<ul>\n<li>Post to MessageChannel instead of window. (<a href=\"http://github.com/acdlite\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@acdlite</a> in <a href=\"https://github.com/facebook/react/pull/14234\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14234</a>)</li>\n<li>Reduce serialization overhead. (<a href=\"http://github.com/developit\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@developit</a> in <a href=\"https://github.com/facebook/react/pull/14249\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14249</a>)</li>\n<li>Fix fallback to <code class=\"gatsby-code-text\">setTimeout</code> in testing environments. (<a href=\"http://github.com/bvaughn\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@bvaughn</a> in <a href=\"https://github.com/facebook/react/pull/14358\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14358</a>)</li>\n<li>Add methods for debugging. (<a href=\"http://github.com/mrkev\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">@mrkev</a> in <a href=\"https://github.com/facebook/react/pull/14053\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">#14053</a>)</li>\n</ul>","excerpt":"Our latest release includes an important performance bugfix for . Although there are no API changes, we’re releasing it as a minor instead of a patch. Why Is This Bugfix a Minor Instead of a Patch?  React follows semantic versioning. Typically, this means that we use patch versions for bugfixes, and minors for new (non-breaking) features. However, we reserve the option to release minor versions even if they do not include new features. The motivation is to reserve patches for changes that have a…","frontmatter":{"title":"React v16.7: No, This Is Not the One With Hooks","next":null,"prev":null,"author":[{"frontmatter":{"name":"Andrew Clark","url":"https://twitter.com/acdlite"}}]},"fields":{"date":"December 19, 2018","path":"content/blog/2018-12-19-react-v-16-7.md","slug":"/blog/2018/12/19/react-v-16-7.html"}},"allMarkdownRemark":{"edges":[{"node":{"frontmatter":{"title":"Introducing the New JSX Transform"},"fields":{"slug":"/blog/2020/09/22/introducing-the-new-jsx-transform.html"}}},{"node":{"frontmatter":{"title":"React v17.0 Release Candidate: No New Features"},"fields":{"slug":"/blog/2020/08/10/react-v17-rc.html"}}},{"node":{"frontmatter":{"title":"React v16.13.0"},"fields":{"slug":"/blog/2020/02/26/react-v16.13.0.html"}}},{"node":{"frontmatter":{"title":"Building Great User Experiences with Concurrent Mode and Suspense"},"fields":{"slug":"/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense.html"}}},{"node":{"frontmatter":{"title":"Preparing for the Future with React Prereleases"},"fields":{"slug":"/blog/2019/10/22/react-release-channels.html"}}},{"node":{"frontmatter":{"title":"Introducing the New React DevTools"},"fields":{"slug":"/blog/2019/08/15/new-react-devtools.html"}}},{"node":{"frontmatter":{"title":"React v16.9.0 and the Roadmap Update"},"fields":{"slug":"/blog/2019/08/08/react-v16.9.0.html"}}},{"node":{"frontmatter":{"title":"Is React Translated Yet? ¡Sí! Sim! はい！"},"fields":{"slug":"/blog/2019/02/23/is-react-translated-yet.html"}}},{"node":{"frontmatter":{"title":"React v16.8: The One With Hooks"},"fields":{"slug":"/blog/2019/02/06/react-v16.8.0.html"}}},{"node":{"frontmatter":{"title":"React v16.7: No, This Is Not the One With Hooks"},"fields":{"slug":"/blog/2018/12/19/react-v-16-7.html"}}}]}},"pageContext":{"slug":"/blog/2018/12/19/react-v-16-7.html"}},"staticQueryHashes":[]}