Server Side Rendering & Static Site Generation

There are two types of pre-rendering in Next.js. So what are they and which is the best approach? Table of Contents Rendering on Server Pre-rendering Server Side Rendering Static Site Generation Use cases Wrap Up Rendering on Server ✍️ Explain: When users request to server, server will sent a generated HTML file. After that, ReactDOM.hydrate() will run to hydrate (attach event listeners) the HTML rendered from the server. After hydration process, the website becomes interactive....

July 7, 2022 · 3 min · Cao Trong Tin

How to update nested state correctly in React Hook

Table of Contents Shallow Copy Deep Copy Problem Solution Wrap Up Shallow Copy Shallow Copy is a copy whose properties share the same references (point to the same underlying values) as those of the source object from which the copy was made. As a result, when you change either the source or the copy, you may also cause the other object to change too — and so, you may end up unintentionally causing changes to the source or copy that you don’t expect....

January 4, 2022 · 3 min · Cao Trong Tin

React Fiber

Table of Contents Prerequisites Reconciliation Reconciliation vs Rendering Scheduling React Fiber React Fiber is an ongoing reimplementation of React’s core algorithm. It is the culmination of over two years of research by the React team. Prerequisites A few things to know before diving into React Fiber: React Components, Elements, Instances Reconciliation React Basic Theoretical Concepts React design Principles Reconciliation Reconciliation is an algorithm that React uses to distinguish one DOM tree from another to determine which parts need to be changed....

December 7, 2021 · 3 min · Cao Trong Tin