53a8d3bc90
Here is everything you need to know about this update. Please take a good look at what changed and the test results before merging this pull request. ### What changed? #### ✳️ react (19.1.1 → 19.2.0) · [Repo](https://github.com/facebook/react) · [Changelog](https://github.com/facebook/react/blob/main/CHANGELOG.md) <details> <summary>Release Notes</summary> <h4><a href="https://github.com/facebook/react/releases/tag/v19.2.0">19.2.0</a></h4> <blockquote><p dir="auto">Below is a list of all new features, APIs, and bug fixes.</p> <p dir="auto">Read the <a href="https://react.dev/blog/2025/10/01/react-19-2">React 19.2 release post</a> for more information.</p> <h2 dir="auto">New React Features</h2> <ul dir="auto"> <li> <a href="https://react.dev/reference/react/Activity"><code class="notranslate"><Activity></code></a>: A new API to hide and restore the UI and internal state of its children.</li> <li> <a href="https://react.dev/reference/react/useEffectEvent"><code class="notranslate">useEffectEvent</code></a> is a React Hook that lets you extract non-reactive logic into an <a href="https://react.dev/learn/separating-events-from-effects#declaring-an-effect-event">Effect Event</a>.</li> <li> <a href="https://react.dev/reference/react/cacheSignal"><code class="notranslate">cacheSignal</code></a> (for RSCs) lets your know when the <code class="notranslate">cache()</code> lifetime is over.</li> <li> <a href="https://react.dev/reference/developer-tooling/react-performance-tracks">React Performance tracks</a> appear on the Performance panel’s timeline in your browser developer tools</li> </ul> <h2 dir="auto">New React DOM Features</h2> <ul dir="auto"> <li>Added resume APIs for partial pre-rendering with Web Streams: <ul dir="auto"> <li> <a href="https://react.dev/reference/react-dom/server/resume"><code class="notranslate">resume</code></a>: to resume a prerender to a stream.</li> <li> <a href="https://react.dev/reference/react-dom/static/resumeAndPrerender"><code class="notranslate">resumeAndPrerender</code></a>: to resume a prerender to HTML.</li> </ul> </li> <li>Added resume APIs for partial pre-rendering with Node Streams: <ul dir="auto"> <li> <a href="https://react.dev/reference/react-dom/server/resumeToPipeableStream"><code class="notranslate">resumeToPipeableStream</code></a>: to resume a prerender to a stream.</li> <li> <a href="https://react.dev/reference/react-dom/static/resumeAndPrerenderToNodeStream"><code class="notranslate">resumeAndPrerenderToNodeStream</code></a>: to resume a prerender to HTML.</li> </ul> </li> <li>Updated <a href="https://react.dev/reference/react-dom/static/prerender"><code class="notranslate">prerender</code></a> APIs to return a <code class="notranslate">postponed</code> state that can be passed to the <code class="notranslate">resume</code> APIs.</li> </ul> <h2 dir="auto">Notable changes</h2> <ul dir="auto"> <li>React DOM now batches suspense boundary reveals, matching the behavior of client side rendering. This change is especially noticeable when animating the reveal of Suspense boundaries e.g. with the upcoming <code class="notranslate"><ViewTransition></code> Component. React will batch as much reveals as possible before the first paint while trying to hit popular first-contentful paint metrics.</li> <li>Add Node Web Streams (<code class="notranslate">prerender</code>, <code class="notranslate">renderToReadableStream</code>) to server-side-rendering APIs for Node.js</li> <li>Use underscore instead of <code class="notranslate">:</code> IDs generated by useId</li> </ul> <h2 dir="auto">All Changes</h2> <h3 dir="auto">React</h3> <ul dir="auto"> <li> <code class="notranslate"><Activity /></code> was developed over many years, starting before <code class="notranslate">ClassComponent.setState</code> (<a href="https://bounce.depfu.com/github.com/acdlite">@acdlite</a> <a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> and many others)</li> <li>Stringify context as "SomeContext" instead of "SomeContext.Provider" (<a href="https://bounce.depfu.com/github.com/kassens">@kassens</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33507">#33507</a>)</li> <li>Include stack of cause of React instrumentation errors with <code class="notranslate">%o</code> placeholder (<a href="https://bounce.depfu.com/github.com/eps1lon">@eps1lon</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34198">#34198</a>)</li> <li>Fix infinite <code class="notranslate">useDeferredValue</code> loop in popstate event (<a href="https://bounce.depfu.com/github.com/acdlite">@acdlite</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32821">#32821</a>)</li> <li>Fix a bug when an initial value was passed to <code class="notranslate">useDeferredValue</code> (<a href="https://bounce.depfu.com/github.com/acdlite">@acdlite</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34376">#34376</a>)</li> <li>Fix a crash when submitting forms with Client Actions (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33055">#33055</a>)</li> <li>Hide/unhide the content of dehydrated suspense boundaries if they resuspend (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32900">#32900</a>)</li> <li>Avoid stack overflow on wide trees during Hot Reload (<a href="https://bounce.depfu.com/github.com/sophiebits">@sophiebits</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34145">#34145</a>)</li> <li>Improve Owner and Component stacks in various places (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a>, <a href="https://bounce.depfu.com/github.com/eps1lon">@eps1lon</a>: <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33629">#33629</a>, <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33724">#33724</a>, <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32735">#32735</a>, <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33723">#33723</a>)</li> <li>Add <code class="notranslate">cacheSignal</code> (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33557">#33557</a>)</li> </ul> <h3 dir="auto">React DOM</h3> <ul dir="auto"> <li>Block on Suspensey Fonts during reveal of server-side-rendered content (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33342">#33342</a>)</li> <li>Use underscore instead of <code class="notranslate">:</code> for IDs generated by <code class="notranslate">useId</code> (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a>, <a href="https://bounce.depfu.com/github.com/eps1lon">@eps1lon</a>: <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32001">#32001</a>, <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33342">#33342</a><a href="https://bounce.depfu.com/github.com/facebook/react/pull/33099">#33099</a>, <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33422">#33422</a>)</li> <li>Stop warning when ARIA 1.3 attributes are used (<a href="https://bounce.depfu.com/github.com/Abdul-Omira">@Abdul-Omira</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34264">#34264</a>)</li> <li>Allow <code class="notranslate">nonce</code> to be used on hoistable styles (<a href="https://bounce.depfu.com/github.com/Andarist">@Andarist</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32461">#32461</a>)</li> <li>Warn for using a React owned node as a Container if it also has text content (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32774">#32774</a>)</li> <li>s/HTML/text for for error messages if text hydration mismatches (<a href="https://bounce.depfu.com/github.com/rickhanlonii">@rickhanlonii</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32763">#32763</a>)</li> <li>Fix a bug with <code class="notranslate">React.use</code> inside <code class="notranslate">React.lazy</code>-ed Component (<a href="https://bounce.depfu.com/github.com/hi-ogawa">@hi-ogawa</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33941">#33941</a>)</li> <li>Enable the <code class="notranslate">progressiveChunkSize</code> option for server-side-rendering APIs (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33027">#33027</a>)</li> <li>Fix a bug with deeply nested Suspense inside Suspense fallback when server-side-rendering (<a href="https://bounce.depfu.com/github.com/gnoff">@gnoff</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33467">#33467</a>)</li> <li>Avoid hanging when suspending after aborting while rendering (<a href="https://bounce.depfu.com/github.com/gnoff">@gnoff</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34192">#34192</a>)</li> <li>Add Node Web Streams to server-side-rendering APIs for Node.js (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33475">#33475</a>)</li> </ul> <h3 dir="auto">React Server Components</h3> <ul dir="auto"> <li>Preload <code class="notranslate"><img></code> and <code class="notranslate"><link></code> using hints before they're rendered (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34604">#34604</a>)</li> <li>Log error if production elements are rendered during development (<a href="https://bounce.depfu.com/github.com/eps1lon">@eps1lon</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34189">#34189</a>)</li> <li>Fix a bug when returning a Temporary reference (e.g. a Client Reference) from Server Functions (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34084">#34084</a>, <a href="https://bounce.depfu.com/github.com/denk0403">@denk0403</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33761">#33761</a>)</li> <li>Pass line/column to <code class="notranslate">filterStackFrame</code> (<a href="https://bounce.depfu.com/github.com/eps1lon">@eps1lon</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33707">#33707</a>)</li> <li>Support Async Modules in Turbopack Server References (<a href="https://bounce.depfu.com/github.com/lubieowoce">@lubieowoce</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34531">#34531</a>)</li> <li>Add support for .mjs file extension in Webpack (<a href="https://bounce.depfu.com/github.com/jennyscript">@jennyscript</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33028">#33028</a>)</li> <li>Fix a wrong missing key warning (<a href="https://bounce.depfu.com/github.com/unstubbable">@unstubbable</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34350">#34350</a>)</li> <li>Make console log resolve in predictable order (<a href="https://bounce.depfu.com/github.com/sebmarkbage">@sebmarkbage</a> <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33665">#33665</a>)</li> </ul> <h3 dir="auto">React Reconciler</h3> <ul dir="auto"> <li> <a href="https://bounce.depfu.com/github.com/facebook/react/blob/v19.2.0/packages/react-reconciler/src/ReactFiberReconciler.js#L255-L261">createContainer</a> and <a href="https://bounce.depfu.com/github.com/facebook/react/blob/v19.2.0/packages/react-reconciler/src/ReactFiberReconciler.js#L305-L312">createHydrationContainer</a> had their parameter order adjusted after <code class="notranslate">on*</code> handlers to account for upcoming experimental APIs</li> </ul> <h2 dir="auto">eslint-plugin-react-hooks@6.1.0</h2> <p dir="auto"><strong>Note:</strong> Version 6.0.0 was mistakenly released and immediately deprecated and untagged on npm. This is the first official 6.x major release and includes breaking changes.</p> <ul dir="auto"> <li> <strong>Breaking:</strong> Require Node.js 18 or newer. (<a href="https://bounce.depfu.com/github.com/michaelfaith">@michaelfaith</a> in <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32458">#32458</a>)</li> <li> <strong>Breaking:</strong> Flat config is now the default <code class="notranslate">recommended</code> preset. Legacy config moved to <code class="notranslate">recommended-legacy</code>. (<a href="https://bounce.depfu.com/github.com/michaelfaith">@michaelfaith</a> in <a href="https://bounce.depfu.com/github.com/facebook/react/pull/32457">#32457</a>)</li> <li> <strong>New Violations:</strong> Disallow calling <code class="notranslate">use</code> within try/catch blocks. (<a href="https://bounce.depfu.com/github.com/poteto">@poteto</a> in <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34040">#34040</a>)</li> <li> <strong>New Violations:</strong> Disallow calling <code class="notranslate">useEffectEvent</code> functions in arbitrary closures. (<a href="https://bounce.depfu.com/github.com/jbrown215">@jbrown215</a> in <a href="https://bounce.depfu.com/github.com/facebook/react/pull/33544">#33544</a>)</li> <li>Handle <code class="notranslate">React.useEffect</code> in addition to <code class="notranslate">useEffect</code> in rules-of-hooks. (<a href="https://bounce.depfu.com/github.com/Ayc0">@Ayc0</a> in <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34076">#34076</a>)</li> <li>Added <code class="notranslate">react-hooks</code> settings config option that to accept <code class="notranslate">additionalEffectHooks</code> that are used across exhaustive-deps and rules-of-hooks rules. (<a href="https://bounce.depfu.com/github.com/jbrown215">@jbrown215</a>) in <a href="https://bounce.depfu.com/github.com/facebook/react/pull/34497">#34497</a> </li> </ul></blockquote> <p><em>Does any of this look wrong? <a href=" |
||
|---|---|---|
| .. | ||
| app | ||
| public | ||
| .eslintrc.json | ||
| .gitignore | ||
| next.config.mjs | ||
| package.json | ||
| postcss.config.js | ||
| README.md | ||
| tsconfig.json | ||
This is a Next.js project bootstrapped with create-next-app.
Getting Started
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Inter, a custom Google Font.
Learn More
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
Deploy on Vercel
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.