Bun vs Node.js: Performance Comparison

React 19 makes refs simple One of the most awkward React APIs is finally cleaned up. Earlier, passing refs meant: - forwardRef boilerplate - TypeScript generic issues - Extra wrapper components import { forwardRef } from "react"; const Input = forwardRef(function Input(props, ref) { return <input ref={ref} {...props} />; }); With React 19, ref is just a regular prop. function Input({ ref, ...props }) { return <input ref={ref} {...props} /> } - No forwardRef - No HOC - Just clean, predictable React A small change that significantly improves developer experience, especially for reusable component libraries in React. #React19 #FrontendEngineering #JavaScript #TypeScript #DeveloperExperience

Day 6 – Node.js Understanding async/await Today’s topic: async/await in Node.js. async/await is built on top of Promises and makes asynchronous code easier to read and maintain. Instead of using .then() and .catch(), we can write asynchronous code that looks like synchronous code. Key points: • async makes a function return a Promise • await pauses execution until the Promise resolves • Error handling is done using try/catch • Avoids callback nesting async/await improves readability and structure in real-world backend applications. Next: Node.js Core Modules (fs, path, os) #NodeJS #BackendDevelopment #JavaScript #AsyncProgramming #SoftwareEngineering

🚀 What is Node.js — and why backend developers care 🧩 Node.js is a JavaScript runtime that allows JavaScript to run outside the browser. Under the hood, Node.js uses Chrome’s V8 engine to execute JavaScript code — the same engine that powers Google Chrome. 🔍 What this means in practice • JavaScript is compiled to machine code • Execution is fast and efficient • Frontend and backend can share the same language ⚙️ Why Node.js became popular for APIs • Designed for non-blocking I/O • Handles many requests efficiently • Perfect fit for APIs and microservices 🎯 Key insight Node.js isn’t a framework. It’s a runtime that changed how JavaScript is used. #Nodejs #Javascript #Backenddevelopment #Webdevelopment #LearningByDoing

⚛️ React 19 finally killed the worst API in React 👇 . It is time to delete forwardRef from your codebase. If you have ever tried to pass a ref to a custom <Input /> or <Button /> component, you hit the classic React error: "Function components cannot be given refs." The solution for the last 5+ years was forwardRef. It was arguably one of the clunkiest APIs in React. It required wrapping your component in a higher-order function, it made component definitions harder to read, and it caused major headaches when trying to use TypeScript generics. React 19 fixes this forever. ❌ The Old Way (forwardRef): An awkward wrapper that changes how you write your component function. You had to declare (props, ref) instead of just passing ref inside the props object. ✅ The Modern Way (ref as a prop): ref is now just a standard prop. • Zero Wrappers: Define your component exactly like normal. • Cleaner Destructuring: Just pull ref out of your props object alongside everything else: function MyInput({ ref, value }) • TypeScript Friendly: No more struggling with ForwardedRef utility types. The Shift: We are dropping boilerplate wrappers in favor of intuitive, standard JavaScript patterns. Are you ready to delete forwardRef from your codebase? 👇 #ReactJS #React19 #WebDevelopment #Frontend #JavaScript #CleanCode #SoftwareEngineering #TechTips #ReactJSTips #Tips #FrontendDeveloper #ReactJSDeveloper #Hooks #Developer #ProblemSolving

🚀 Why Node.js is So Fast? Let’s Understand the Secret Node.js is an open-source, cross-platform JavaScript runtime environment that allows developers to run JavaScript outside the browser, mainly on the server side. Asynchronous, Non-Blocking I/O High Performance – Powered by V8 engine 🔥 Top Node.js Questions Every Developer Should Know 🚀 1️⃣What is Event Loop in Node.js? 2️⃣ process.nextTick() vs setImmediate()? 3️⃣ What is Non-Blocking I/O? 4️⃣ How does Node.js handle concurrency? 5️⃣ What are Streams and their types? 6️⃣ How does the Node.js architecture work? 7️⃣ What is V8 engine’s role in Node.js? 8️⃣ What is libuv? 9️⃣ How does async/await work internally? 🔟 Callbacks vs Promises vs Async/Await 1)How does Garbage Collection work in Node.js? 2️⃣ How to detect memory leaks? 3️⃣ How to optimize Node.js performance? 4️⃣ What is EventEmitter? 5️⃣ How to avoid blocking the event loop? 6️⃣ Worker Threads vs Cluster Module 7️⃣ require() vs import() 8️⃣ CommonJS vs ES Modules 9️⃣ How does module caching work? How environment variables are managed? #NodeJS #JavaScript #BackendDeveloper #MERNStack #InterviewPreparation #WebDeveloper #Coding #TechJobs #FullStackDeveloper

Day 9 – Node.js Using fs.promises Node.js provides a Promise-based version of the fs module that works seamlessly with async/await. Instead of callback-based APIs, we can use: require('fs').promises This improves readability, structure, and production-level code quality. Next: Understanding path module in Node.js. #NodeJS #BackendDevelopment #JavaScript #AsyncAwait #SoftwareEngineering

Day 55 of my #100DaysofCodeChallenge Understanding the Node.js Event Loop Today I moved from using Node.js… to understanding how it actually works internally. Node.js runs JavaScript on a single-threaded event loop. If you block that thread, your entire server stops responding. Here’s what I explored: Event Loop Phases Timers Pending Callbacks Poll Check Close Callbacks Each phase has its own callback queue. Microtask Priority process.nextTick() executes before the event loop proceeds to the next phase. Overusing it can starve the loop and freeze your app. Important Execution Detail When called inside an I/O callback: setImmediate() executes before setTimeout(0) This clarified how Node schedules work internally. I also reinforced what NOT to do in production: Avoid synchronous APIs Avoid CPU-heavy calculations on the main thread Avoid large blocking JSON operations Avoid blocking loops inside request handlers Finally, I started exploring Express.js, the minimal web framework built on top of Node’s HTTP module. Understanding the event loop changes how you design scalable systems. #NodeJS #BackendEngineering #100DaysOfCode #JavaScript #SoftwareEngineering

🚀 Type-Safe Redux Hooks in React (TypeScript) Tired of repeatedly typing useDispatch and useSelector with types in every component? This simple pattern helps keep your Redux code clean, consistent, and fully type-safe 👇 By creating custom hooks for dispatch and selector, you get: ✅ Strong type safety with TypeScript 🧼 Cleaner component code ⚡ Better developer experience 🔁 No repeated type imports across components A small setup that makes a big difference in large React applications. If you’re using React + Redux Toolkit + TypeScript, this is a must-have pattern for scalable projects. #React #ReduxToolkit #TypeScript #FrontendDevelopment #WebDevelopment #CleanCode #DeveloperExperience

When I started learning React.js, I thought the challenge was JSX and hooks — but the real shift happened when I understood how React thinks. React doesn’t directly manipulate the DOM; it re-renders components, recalculates a virtual representation, and updates only what’s necessary. Re-renders are normal — they’re just function calls. The key is keeping state minimal, deriving what you can, and understanding that useEffect is for synchronizing with external systems, not just mimicking lifecycle methods. Ultimately, React becomes simple when you focus on data flow — where state lives and how it moves between components. Strong fundamentals make everything easier. #ReactJS #FrontendDevelopment #JavaScript #WebDevelopment