---

Takeaways:

• Plans to transition the newsletter to a proprietary email service for better control over delivery and design.

• Feedback requested on desired content topics for the upcoming year.

• New React19 updates enhance support for Web Components and streamline form handling features.

Links:

• Read Online

• Things I Regret Not Knowing Earlier

• Use React19 form features to refactor a Newsletter Subscribe form* Tips to effectively optimize INP in React* You might not need a React Form Library* React19 and Web Component Examples

---

Takeaways:

• Explore classical, modular, and Functional-Scope Design (FSD) architectures to determine the best fit for your front-end applications.

• Use Codecov’s Test Analytics to catch flaky tests early and maintain a reliable CI/CD pipeline.

• Server-Side Rendering (SSR) can save costs by reducing computational overhead, contrary to the common belief that it is expensive.

• Learn how to develop DOM-based3D terrain renderers in React, focusing on height maps and CSS transforms.

• Prepare for2025 by adopting a stable React tech stack while considering the risks of vendor lock-in.

• Understand best practices for using callback refs in React19 to avoid unnecessary complications.

Links:

• Architectures of modern front-end applications

• Catch flaky tests before they break your build

• Why and how I made a3D terrain renderer with React

• React Tech Stack in2025

• Ref Callbacks, React19 and the Compiler

---

Takeaways:

• Optimize Interaction-to-Next-Paint (INP): Focus on enhancing INP for React applications as it significantly impacts Google’s search rankings.* Implement Virtualization: Consider using code virtualization techniques to handle large files more efficiently, improving performance.

• Leverage the React Compiler: Utilize the React Compiler tool for automatic performance optimization techniques such as memoization and efficient re-rendering.

Links:

• How To Improve Interaction-to-Next-Paint

• Better Code Rendering Through Virtualization

• How does the React Compiler perform on real code

• Cleaning up dead files in your React project

• React v19 has been released

---

Takeaways:

• Implement a Modal Dialog feature effectively from concept to production using a step-by-step approach.

• Utilize Cerbos for fine-grained access control implementations in React applications to maintain high security standards.

• Explore React Islands to modernize legacy systems by incrementally integrating React components.

• Understand TanStack Router’s built-in hooks for loading and invalidating data, enhancing data management in your apps.

• Develop an AutoScrollList Component using vanilla DOM to improve performance and compatibility.

• Create a feature-based architecture in React to structure applications thoroughly for better maintenance and scalability.

• Clerk’s new Waitlist component can effectively manage user interest and access for new product launches.

Links:

• Read Online

• Implement policy-driven RBAC and ABAC in React

• The anatomy of a React Island

• Loading Data with TanStack Router

• Feature-based React Architecture

• Introducing <Waitlist /> mode - a virtual queue for your app

React Portals allow the rendering of a component outside its parent component’s DOM hierarchy, which is particularly useful for elements such as modals and notifications that need to appear on top of other content.—

Takeaways:

• React Portals help in managing UI elements like modals and overlays by rendering them outside their parent component’s structure.

• This feature enhances user experience by avoiding constraints from the DOM hierarchy of parent components.

• Understanding controlled vs. uncontrolled components is crucial for effective React development, especially when managing state.

Links:

• What are React Portals?

• Building React Forms with Ease Using React Hook Form, Zod and Shadcn

• QA Wolf: Cut your QA cycles down from hours to minutes with automated testing

• Be careful with useSyncExternalStore