Raz Gvili’s Post

The React community is waiting with anticipation as React 19 prepares to introduce a game-changing feature: 𝐓𝐡𝐞 𝐑𝐞𝐚𝐜𝐭 𝐜𝐨𝐦𝐩𝐢𝐥𝐞𝐫 Initially started as a research project, the React compiler has evolved into a critical element of the framework's evolution. Meta, the parent company of Instagram, has already integrated this compiler into production For Optimal performance, reducing re-renders and using memoization is a big part of a React project. The introduction to React Compiler known as "𝐑𝐞𝐚𝐜𝐭 𝐅𝐨𝐫𝐠𝐞𝐭" in React 19 will change the way we code The React compiler will now manage these re-renders with the Babel plugin that converts our typical React code into code where every hook dependency, props, and components themselves are memoized. Once this compiler is rolled out, we will stop using 𝐦𝐞𝐦𝐨, 𝐮𝐬𝐞𝐂𝐚𝐥𝐥𝐛𝐚𝐜𝐤() and 𝐮𝐬𝐞𝐌𝐞𝐦𝐨() For more information watch this video => https://lnkd.in/dmTR4RdS where React core team members introduce the compiler Let me know what are you thoughts on this upcoming feature💡

React 19: Context.Provider → Context useContext → use

Dependency Injection using React Context

🚀 Exciting News for the React Community! 🚀 React is introducing the React Forget Compiler, a groundbreaking advancement set to revolutionize the way we build and optimize React applications. This innovative compiler is not just an improvement; it's a complete reimagining of how React code can be transformed for better performance and efficiency. 🔍 Why React Forget Compiler? - Enhanced Performance: By analyzing and optimizing React components at compile-time, it drastically reduces the runtime overhead, leading to faster application speeds. - Smarter Bundling: It intelligently removes unused code, significantly decreasing bundle sizes for quicker load times. - Forward-Compatible: Designed with future React features and updates in mind, ensuring your code stays efficient and up-to-date. 🌟 Key Features: - Advanced static analysis to identify and optimize critical paths in your React components. - Seamless integration with existing React projects, making it easier to adopt and implement without major overhauls. - Support for the latest JavaScript and TypeScript features, enhancing developer experience and productivity. 🔗 Dive deeper into what makes the React Forget Compiler a game-changer by watching the full overview: https://lnkd.in/gM2Z2GaM Let's embrace this innovation and take our React applications to the next level. Join the movement and be part of the future of React development! #React #WebDevelopment #Frontend #CompilerOptimization #Innovation #SoftwareEngineering

React 19: Context.Provider → Context useContext → use

In React 19, you don't have to write memoization code anymore. React compiler takes care of the memoization wherever its required. Here is a POC to understand how that works under the hood. https://lnkd.in/gf6pNJYf

Recommendation for reading - interesting story about React 19 and communication with React core team

How New React will change the way we code: -useMemo, useCallback, memo → React Compiler - forward Ref → ref is a prop - React.lazy → RSC, promise-as-child - useContext → use(Context) - throw promise → use(promise) - <Context. Provider> <Context> #react #reactnative #react19 #reactcompiler