Irene Tomaini’s Post

JS engines sometimes skip creating objects that your code asks for. This isn't a bug — it's Copy Elision. 🧠 When you return an object from a function, you might think: create it → copy it out → assign it. That's three heap operations. With copy elision, V8 can skip to just one — building the object directly where it's going to live. Where it shows up in real JS Copy elision is most visible with object literals returned from functions, array spread operations, and destructuring assignments. V8's optimizing compiler (TurboFan) detects when a temporary object's only purpose is to be immediately assigned somewhere — and eliminates the middle step. Why it matters at scale In high-throughput Node.js apps, you might call a factory function millions of times per minute. Each unnecessary allocation adds GC pressure. More GC = more stop-the-world pauses = latency spikes. When I was building our aggregation pipeline processing 20M+ records, keeping factory functions small and predictable let V8 apply this consistently. How to help V8 elide more Return object literals directly — avoid storing in a local variable first. Keep return shapes consistent (same keys, same order). Avoid conditional returns with different shapes — V8 can't elide what it can't predict. Ever had an unexpected GC pause tank your API response times? What did you find when you dug in? 👇 #JavaScript #NodeJS #V8Engine #MemoryManagement #BackendEngineering #JSInternals #WebPerformance #LearnInPublic

#React 19 isn't asking you to learn a new framework — it's finally catching up to what developers always wanted. The new React Compiler alone can eliminate thousands of lines of manual memoization, and new #hooks like "useActionState" and "useOptimistic" turn what used to be 20+ lines of boilerplate into just a few. If you're still writing "useMemo" everywhere and managing form state manually, it's worth taking another look. The best React code in 2026 is shorter, faster, and more readable — not because we got smarter, but because the tools got better. #OpenSource #Coding #Developer #Programming #SoftwareEngineering #SoftwareDevelopment #CodeNewbie #Dev  #JavaScript #TypeScript #Frontend #FrontendDevelopment #WebDevelopment https://lnkd.in/da26iEBP

Redux is a powerful state management library that enables developers to build scalable and predictable applications. In this post, I’ve summarized the core concepts of Redux—Store, Actions, Reducers, and Unidirectional Data Flow—in a simple visual format. 🔑 Key insights: • Single Source of Truth • State is Read-Only • Changes via Pure Functions • Improved Debugging with DevTools • Scalable Architecture Mastering Redux can significantly improve how you handle complex state in modern web applications. #ReactJS #Redux #WebDevelopment #FrontendDeveloper #JavaScript #SoftwareDevelopment #Coding #TechLearning #FullStackDeveloper

📒 𝐉𝐚𝐯𝐚𝐒𝐜𝐫𝐢𝐩𝐭 𝐡𝐚𝐬 𝐚 𝐜𝐥𝐞𝐚𝐧𝐞𝐫 𝐫𝐮𝐧𝐧𝐢𝐧𝐠 𝐢𝐧 𝐭𝐡𝐞 𝐛𝐚𝐜𝐤𝐠𝐫𝐨𝐮𝐧𝐝… 𝐚𝐧𝐝 𝐦𝐨𝐬𝐭 𝐝𝐞𝐯𝐞𝐥𝐨𝐩𝐞𝐫𝐬 𝐢𝐠𝐧𝐨𝐫𝐞 𝐢𝐭. 𝑌𝑒𝑠, 𝐼’𝑚 𝑡𝑎𝑙𝑘𝑖𝑛𝑔 𝑎𝑏𝑜𝑢𝑡 𝐺𝑎𝑟𝑏𝑎𝑔𝑒 𝐶𝑜𝑙𝑙𝑒𝑐𝑡𝑖𝑜𝑛 (𝐺𝐶) ♻️ Every time you create: ✅ objects ✅ arrays ✅ functions 𝐽𝑎𝑣𝑎𝑆𝑐𝑟𝑖𝑝𝑡 𝑎𝑙𝑙𝑜𝑐𝑎𝑡𝑒𝑠 𝑚𝑒𝑚𝑜𝑟𝑦. 𝐵𝑢𝑡 𝑡ℎ𝑒 𝑟𝑒𝑎𝑙 𝑞𝑢𝑒𝑠𝑡𝑖𝑜𝑛 𝑖𝑠… When does JS free that memory? ➡️ Only when the value becomes unreachable. 🔥 Reachable = Alive If something can be accessed from: 1️⃣ global variables 2️⃣ current function variables 3️⃣ call stack …it stays in memory. Example: 𝗹𝗲𝘁 𝘂𝘀𝗲𝗿 = { 𝗻𝗮𝗺𝗲: "𝗝𝗼𝗵𝗻" }; 𝘂𝘀𝗲𝗿 = 𝗻𝘂𝗹𝗹; Now no one can access it → GC removes it. ⚡ 𝐵𝑖𝑔𝑔𝑒𝑠𝑡 𝑚𝑖𝑠𝑐𝑜𝑛𝑐𝑒𝑝𝑡𝑖𝑜𝑛: “Objects are deleted when they have no references.” Not exactly. Because two objects can reference each other and STILL get deleted. 📌 If the main root reference is gone, the whole connected group becomes an unreachable island → GC clears everything. 🚀 𝑊ℎ𝑦 𝑠ℎ𝑜𝑢𝑙𝑑 𝑦𝑜𝑢 𝑐𝑎𝑟𝑒? Because this is how memory leaks happen: ❌ event listeners not removed ❌ unused variables still holding references ❌ large objects stored unnecessarily Result: 🐢 slow apps 💥 crashes 📉 poor performance 💡 Simple rule: If you don’t need it → remove the reference. Because JavaScript will clean it… only after you let go. #JavaScript #WebDevelopment #Frontend #ReactJS #Programming #Coding #SoftwareEngineering #Tech #Learning #interview

Derived state is one of the most subtle sources of bugs. Because it “looks correct”. Until it isn’t. Here’s the issue 👇 You store: → Original data → Derived data (filtered, sorted, computed) Now you have: ❌ Two sources of truth Over time: → They go out of sync → Bugs appear → Debugging becomes painful Example: → items → filteredItems If items update but filteredItems doesn’t… Your UI lies. What works: ✔ Derive data on render (not store it) ✔ Use memoization if expensive ✔ Keep single source of truth Key insight: If something can be derived… It shouldn’t be stored. That’s how you avoid state inconsistency bugs. #ReactJS #StateManagement #Frontend #SoftwareEngineering #JavaScript #AdvancedReact #Architecture #Engineering #Programming #CleanCode

🚀 Mastering Performance: React Memoization & Modern Tooling I've been diving deep into web performance optimization, specifically focusing on how React handles re-renders and the impact of modern build tools like Vite. Here is a breakdown of my recent learnings: * Vite & the Move to OXC While older versions of Vite relied on Rollup for bundling, Vite @latest leverages the OXC compiler. Rollup: Excellent for combining multiple files into a single bundle. OXC: A high-performance compiler toolset that processes individual pieces of code much faster than traditional tools like Babel. * Memoization: Why It Matters Memoization is all about efficiency—remembering work already done so it doesn't have to be repeated. In React, this is crucial for preventing "falty reconciliation" (unnecessary re-renders). The Problem: Since functions are reference data types, their memory address changes on every render of a parent component. This causes child components (like an <About /> component) to re-render even if their data hasn't changed. The Solution: Using React.memo to cache the component. This saves RAM and processing power by ensuring a re-render only happens if the props actually change. - Key Techniques Learned: Component Memoization: Using React.memo() (via Higher Order Component or direct definition) to prevent unnecessary child updates. Function & Value Memoization: Utilizing the useCallback and useMemo hooks for granular control over memory and reference stability. Logic Check: React.memo performs a shallow comparison: $PrevProp === NewProp$ ? No Re-render : Re-render. Staying updated with these optimizations is key to building fast, scalable, and user-friendly applications! #ReactJS #WebDevelopment #FrontendEngineering #Vite #PerformanceOptimization #CodingTips #JavaScript #Memoization

🔥 JavaScript Arrays — Hidden Performance Cost You Might Ignore Hey devs 👋 We all use array methods daily: .map() .filter() .reduce() But here’s something most developers don’t think about 👇 👉 Chaining multiple methods: arr.filter(...).map(...).reduce(...) Looks clean… but: ❌ Creates multiple intermediate arrays ❌ Increases memory usage ❌ Impacts performance on large data 💡 Better approach (when needed): ✔ Combine logic in a single loop ✔ Use reduce smartly ✔ Optimize only for large datasets ⚡ Senior rule: “Readable code first… optimized code when necessary.” 👉 Insight: Not every clean-looking code is efficient. Have you optimized array-heavy logic before? #javascript #performance #webdevelopment #programming #frontend #backend #softwareengineering #Coding #TechCareers #Programming #success

Ever wondered how a single server can handle thousands of users at the same time? It’s a concept in JavaScript and Node.js called the Event Loop. Node.js runs on a single thread. That means it can only execute one thing at a time. So how does it handle thousands of users? It doesn’t “do everything at once”. Instead, it uses a smart system: - It executes synchronous code immediately - It sends slow tasks (like database calls, API requests, file operations) to the background - It continues handling other requests When those tasks finish, it comes back and processes the result This coordination is handled by the Event Loop. The Event Loop is not just a JavaScript feature. It’s a fundamental system design principle behind modern backend architecture. It explains how applications stay: - Fast under heavy load - Responsive with many concurrent users - Efficient without blocking resources #JavaScript #NodeJS #BackendDevelopment #WebDevelopment #SystemDesign  #EventLoop #Programming #SoftwareEngineering #Coding #FullStackDevelopment #BackendEngineering #Scalability #TechLearning #Developers #ComputerScience

var vs let vs const — The Real Differences If you're still reaching for `var` by default, this one's for you. Three keywords. Three very different behaviors. var • Function-scoped (ignores block scope) • Can be redeclared in the same scope • Hoisted and initialized as undefined • Legacy. Avoid in new code. let • Block-scoped • Can be reassigned, cannot be redeclared • Hoisted but not initialized (Temporal Dead Zone) • Use it when a value needs to change. const • Block-scoped • Cannot be reassigned or redeclared • Same hoisting behavior as let • Use it by default. Your future self will thank you. Rule of thumb: → const by default → let when you must reassign → var — don't Next post: Data Types — all seven, with the typeof null trap. Follow the series. #JavaScript #WebDevelopment #Frontend #CleanCode #NodeJS #SoftwareEngineering #WebDev #CodingTips #ES6 #LearnJavaScript #Programming #Coder #FullStackDeveloper #ReactJS #TypeScript #100DaysOfCode #DeveloperCommunity #TechTips #CodeNewbie #ProgrammingLife

𝗪𝗵𝗮𝘁'𝘀 𝗗𝗧𝗢𝘀 𝗶𝗻 𝗡𝗲𝘀𝘁 𝗷𝘀 In NestJS, a 𝗗𝗧𝗢 (Data Transfer Object) is an object that defines how data is sent over the network. Think of it as a contract or a blueprint that specifies exactly what data a client (like a mobile app or a browser) must send to your server. While DTOs are a general software pattern, NestJS uses them powerfully to handle validation and type safety. 𝟭. 𝗪𝗵𝘆 𝗱𝗼 𝘄𝗲 𝘂𝘀𝗲 𝗗𝗧𝗢𝘀? Without a DTO, your application wouldn't know if the incoming data is correct. If a user tries to register but sends a "username" as a number instead of a string, your database might crash. DTOs help prevent this by: 𝗩𝗮𝗹𝗶𝗱𝗮𝘁𝗶𝗼𝗻: Ensuring the data has the right format, length, and type. 𝗗𝗮𝘁𝗮 𝗧𝗿𝗮𝗻𝘀𝗳𝗼𝗿𝗺𝗮𝘁𝗶𝗼𝗻: Stripping away unwanted data that the client shouldn't be sending (e.g., trying to set their own isAdmin status). 𝗧𝘆𝗽𝗲 𝗦𝗮𝗳𝗲𝘁𝘆: Providing IntelliSense and auto-completion in your code so you know exactly what properties exist on the request body. 𝟮. 𝗖𝗹𝗮𝘀𝘀𝗲𝘀 𝘃𝘀. 𝗜𝗻𝘁𝗲𝗿𝗳𝗮𝗰𝗲𝘀 In NestJS, it is highly recommended to use Classes for DTOs rather than Interfaces. 𝗜𝗻𝘁𝗲𝗿𝗳𝗮𝗰𝗲𝘀 are removed during JavaScript compilation, meaning NestJS cannot check them at runtime. 𝗖𝗹𝗮𝘀𝘀𝗲𝘀 are preserved in the final code, allowing NestJS to use Pipe validation to check data as it arrives. #Programming #BackendDevelopment #TypeScript #NestJS