Hey friend, This is one of the most exciting updates in the React ecosystem: the React Compiler โ๏ธ. I am incredibly excited because we can now use the Next.js 15 RC โ๏ธ with this compiler and eliminate many React hooks we've been using, such as useCallback, useMemo, memo, and more. If you prefer to watch the video instead, then check out my latest video here ๐ How does React Compiler ACTUALLY work?โOur Weekly Snack: Is it time to forget useCallback or useMemo?First of all, why are we questioning this? Well, that's because React compiler is out. What is React Compiler?React Compiler is an automatic optimizer for React code. It analyzes your components and optimizes them for performance, reducing the need for manual memoization with hooks ๐ช like These hooks are currently used to prevent unnecessary re-renders of components based on whether their props or state have truly changed. React Compiler will optimize your React code provided you follow the Rules of React โ๏ธ. Now, not using hooks inside a function, function should always return the same output etc. are all part of the rules. These are rules we're aware of. It can reduce the need for developers to manually add memoization code. For example, you may not need to add useCallback and useMemo everywhere as React is going to optimize that for you. Here is an example, How you can get Next.js 15 React Compiler for a new project:How can you enable React Compiler?There are 2 modes:
๐งฉ Opt-in mode: React Compiler can be enabled in annotation mode, which allows developers to control which components are optimized. This is seen in the left terminal. โจ Compile all components: Setting it to true will get all components to get optimized. Is React Compiler a Silver Bullet?While React Compiler is a powerful tool, it's essential to remember:
โ โ Latest Frontend NewsFind out if people on Twitter ๐ข actually ship code or if they're just shiptalking with Ship Talkers โ๏ธ. โGPT skeleton โ๏ธ converts your components into Skeleton UI. You can simply copy paste. โBeautiful Gradients โ๏ธ ready to use for your projects or apps or to add a little whimsy to your apps. Add sounds to your application for user clicks or to have some fun, with the use-sound hook โ๏ธ. โAstro 4.10 is out โ๏ธ โจ Changes include,
What if there was a Next.js form lib that does both client and server validation from one Zod schema, well, this is possible through conform โ๏ธ.โ โTailwind released a new version โ๏ธ of `prettier-plugin-tailwindcss` โจ that automatically cleans up unnecessary whitespace in your class lists Weekly Youtube VideosCheck it out and subscribe to my channel โ๏ธ for more Frontend, Leadership and Career Development content. What do you think of today's Newsletter? Simply click on one of the links below.
|
Join 6000+ subscribers reading by weekly personalized Newsletter that helps developers level up their skills through weekly Frontend and Leadership Snacks. You get a deep dive into a Tech topic, Actionable tips to excel in your career and a toolbox!
Hello Reader, As an Engineering leader, you are going to get requests all the time. So you need to prioritize how you are going to manage that. According to a study by McKinsey, leaders who set clear priorities for their teams see a 25% increase in overall productivity. You might have to say โnoโ to your direct team or product leaders or might have to say no to priorities. In Leadership, saying no means 'not right now', but let's work together to figure out 'when.' While setting priorities,...
Hey friend, I've been heads down building this thing for months, and I'm both nervous and *stoked* to finally share it with you. It is The Modern Full Stack Next.js Course which is dropping on November 25th ๐ฅ. It is a course that teaches you to build and deploy production-ready Next.js apps. Less than 10 days to go, WILD !! ๐ฌ Look, I know there are tons of courses out there, but I wanted to do something different. I actually built my own *custom course platform* from scratch because, well,...
Hey friend, AI has revolutionized how we should build products. Instead of being scared of it, I'd suggest trying out a bunch of tools and seeing what you like to make you more powerful, I mean productive :P. I mean, I built this Full Stack Splitwise app from scratch using just prompts and AI โ no coding skills required! My Tech Stack - Next.js, ShadCN, Clerk, and all the bells and whistles. I'm blown away ๐คฏ. I also gave AI my design vision and it designed this beautiful app for me! If you...