React18
React useEffect vs useLayoutEffect
useEffect runs asynchronously after DOM paint, while useLayoutEffect runs synchronously before browser repaint.React 18 useInsertionEffect Hook
The useInsertionEffect hook in React 18 is mostly for CSS-in-JS libraries for inserting global DOM nodes like 'style' or SVG 'defs' in the document.
React 18 Adds Video onResize Event
Before React 18, onResize handlers were ignored on video elements. React 18 now adds support for the onResize media event.React 18 Allows Rendering undefined
Before React 18, if we did not want to render anything, we had to return 'null' or an empty fragment. React now allows undefined to be rendered.React 18 Suspense SSR Architecture
React 18's new SSR combines streaming server-side rendering with Selective Hydration for better performance.React 18 useDeferredValue Hook
The useDeferredValue hook allows us to mark some tasks as less important, making the app feel more responsive, thereby improving the user experience.React 18 useSyncExternalStore Hook
React 18's useSyncExternalStore hook safely subscribes to external stores, preventing tearing issues caused by concurrent rendering.React 18 useId API for Unique IDs
React 18 introduces a new hook API - useId, that generates stable ids during server rendering and hydration to avoid mismatches.React 18 startTransition API for Better UX
Learn React 18 startTransition API to prioritize urgent vs non-urgent updates. Improve UI responsiveness with concurrent rendering.React 18 Suspense Improvements
React 18 delays committing everything inside the Suspense boundary (the suspended component and all its siblings) until the suspended data resolves.
Newer