pragalbh srivastavhydration.hashnode.dev·Nov 29, 2024How a Server-Rendered Page Becomes Interactive in Next.jsWhen the server sends the webpage to your browser, it's just a "body" (HTML). It looks complete, but it can't think or respond to actions (like clicking a button or typing in a form). Hydration is the process where React's JavaScript "wakes up" and c...Discusshydration
akanksha srivastavadeeplinking.hashnode.dev·Oct 13, 2024Virtual DOM ( Document Object Model)The virtual DOM is a concept in web development, particularly in libraries and framework like React, that optimizes the way changes to the UI are handled. How the virtual DOM works :- Real DOM : The regular DOM ( Document Object Model ) is a tree st...Discuss·1 likeReact
Salvador Villalon JrforfreeCodeCampfreecodecamp.org·Oct 7, 2024What are Pre-Rendering and Hydration in Web Development? A Deep Dive for DevsHave you ever wondered how Frameworks like Next.js, Gatsby.js, and Remix work? These frameworks use the concepts of Pre-rendering and Hydration, which represent significant advancements in the history of web development. These frameworks leverage the...DiscussJavaScript
Shubham Mehtashubham-mehta.hashnode.dev·Sep 23, 2024Client Side Rendering (CSR) vs Server Side Rendering (SSR)While developing a web application or website from scratch, a developer has to make many decisions that can significantly impact performance and user experience, especially how the content is rendered on the view. First, let's understand what renderi...Discuss·1 like·366 readsClient-side rendering
Rishi Bakshirishibakshi.hashnode.dev·Sep 21, 2024Understanding and Fixing Hydration Errors in Next.jsHydration errors are a common pitfall for developers new to Next.js, especially when dealing with client components that rely on browser APIs like localStorage. In this article, we’ll explore what hydration errors are, how they occur, and how to fix ...Discuss·10 likesYou Don't Know Next.jsincorrect-html-structure
Rishi Bakshirishibakshi.hashnode.dev·Sep 10, 2024Think Client Components Only Run on the Client Side? Think AgainIn Next.js, there’s often a misconception that client components run only on the client, as their name might suggest. However, this isn't entirely true. In reality, client components in Next.js execute both on the server during the initial page rende...Discuss·10 likesYou Don't Know Next.jsrsc-payload
Thành Nam Nguyễnblog.thanhnamnguyen.dev·Aug 13, 2024Hydration trong ReactGiới thiệu Khi xây dựng các ứng dụng web, tính linh hoạt và hiệu suất của React đã khiến nó trở thành sự lựa chọn phổ biến đối với các lập trình viên. Một trong những khái niệm quan trọng giúp tăng cường hiệu quả của các ứng dụng React là "hydration....Discuss·187 readsFront-endReact
Brandon Damuedamue.hashnode.dev·Jun 29, 2024Boost Your React App's Performance with Lazy Loading, Hydration, and Code SplittingAfter a React/Next.js sabbatical, I am back to building ways!! At the time of writing, I am working on an admin dashboard for an online marketplace application powered by Next.js and Typescript. As is the case with every project I undertake, learning...Discuss·1 likeReact
FAISAL HUSAINfaisal004.hashnode.dev·Mar 3, 2024Fix hydration error by this npm packageIf you have worked with or working with Next.js you have definitely came across this hydration error. Fix Method ##1 Simple fix for this error is const [isMounted, setIsMounted] = useState(false); useEffect(() => { setIsMounted(true); }, [...Discuss·64 readsNext.js
