React
Understanding the difference between React useEffect and useLayoutEffect hooks
useEffect hook and useLayoutEffect hook differ in the timing of their invocation. useEffect hook runs asynchronously after the DOM has been painted whereas useLayoutEffect runs synchronously after all DOM mutations.React custom infinite scroll with pagination
React custom infinite scroll with pagination helps developers to improve performance of the website.Know about the useInsertionEffect hook in React 18
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 onResize event to video elements
Before React 18, onResize handlers were ignored on video elements. React 18 now adds support for the onResize media event.React 18 allows components to render '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.Optimize large React app performance by code-splitting
Code-splitting helps divide large code bundles into smaller ones, which can then be loaded on demand. It helps in reducing the initial load time of the application.Improve the performance of dropdown containing large data using Virtualization
Super large lists can slow down the site's performance significantly, at times even freeze the application. In such situations windowing (or virtualization) comes to the rescue.React State management - Part 2
Learn some of the inherent ways of managing state without using any external state management tool.Tips to make React application more accessible
Making web applications accessible to all the users is an important aspect to be considered while developing. React fully supports building accessible websites, often by using standard HTML techniques.Deep dive into the new Suspense Server-side Rendering ( SSR ) architecture in React 18
The new SSR foundation allows us to combine streaming server-side rendering with a new approach to hydration - Selective Hydration! It also prioritizes hydrating the parts the user is interacting with, creating an illusion of instant hydration.