How To Dev

Introduction NextJS Server Actions is a powerful feature that allows you to perform data mutations directly on the server without having to create API Routes manually. Distinguishing between Routes Handle and Server Actions Similarities: Both are code defined on the Server Both can be used in Server components and Client components Differences: Use Routes Handle if you need to call APIs from outside such as from partners or mobile Use Server Actions for internal CRUD processing operations The outstanding advantages of Server Actions compared to Routes Handle include: Tight integration with Form: Works smoothly with the action attribute of HTML forms. Progressive Enhancement: The application can still function basically even when JavaScript has not finished loading or is disabled. Security: Automatically protects against CSRF attacks and keeps sensitive processing logic on the server side. Code simplification: Reduces boilerplate code when connecting between Client and Server. When...

Introduction React Fiber is the core reconciliation engine of React supported since version 16, helping to change the rendering mechanism from synchronous to asynchronous. Advantages: Ability to pause and resume work: Allows React to break the rendering process into small units of work (fibers) so as not to block the main thread. Task prioritization: Prioritizes direct user interactions (keystrokes, clicks) over background data processing tasks. UX Improvement: Minimizes lag (jank) when the application has to handle complex UI components or large data lists. Detailed Workflow React Rendering Pipeline Trigger Phase When you call setState() or dispatchAction, React marks the changed nodes as dirty and uses the lane mechanism to mark upwards to the corresponding parent Fiber Nodes. Fiber: Acts as a "unit of work." Each component is a Fiber node containing information about state, props and links to parent/child/sibling nodes. Render Phase - Calculation This is where Reconciliati...