Abdelrahman Beaih’s Post

Everyone talks about not overusing useMemo() and useCallback(). But do you actually know why??? Soo..the thing is, these hooks aren't some magic performance booster you sprinkle everywhere. useMemo only helps when you have some expensive calculations running on every render say like filtering a huge list or computing derived data. If the calculation is cheap, wrapping it just makes your code more complicated for no reason Nnn...useCallback() only matters when you're passing functions to memoized child components. Otherwise, it's just noise that clutters your component. The best approach is to write clean, readable components first. Let these hooks solve real performance problems, not those you imagined ;) Follow Sakshi Jaiswal ✨ for more quality content ;) #Frontend #React #Sakshi_Jaiswal #FullstackDevelopment #javascript #TechTips #ServerComponents #UseMemo #UseCallback

I once spent hours debugging something that made no sense. The code looked correct. The logic was simple. But the console logs were appearing in a strange order. Something like this: Promise 𝗿𝗲𝘀𝗼𝗹𝘃𝗲𝗱 Then 𝘀𝗲𝘁𝗧𝗶𝗺𝗲𝗼𝘂𝘁 Then another log I expected earlier. That’s when I discovered something many JavaScript developers overlook: Not all async tasks are treated the same. Some go to the 𝗺𝗶𝗰𝗿𝗼𝘁𝗮𝘀𝗸 𝗾𝘂𝗲𝘂𝗲. Some go to the 𝗺𝗮𝗰𝗿𝗼𝘁𝗮𝘀𝗸 𝗾𝘂𝗲𝘂𝗲. And JavaScript always clears microtasks first before moving to the next macrotask. That’s why: Promises, 𝗾𝘂𝗲𝘂𝗲𝗠𝗶𝗰𝗿𝗼𝘁𝗮𝘀𝗸, 𝗠𝘂𝘁𝗮𝘁𝗶𝗼𝗻𝗢𝗯𝘀𝗲𝗿𝘃𝗲𝗿 run earlier. While things like: 𝘀𝗲𝘁𝗧𝗶𝗺𝗲𝗼𝘂𝘁, 𝘀𝗲𝘁𝗜𝗻𝘁𝗲𝗿𝘃𝗮𝗹, 𝗗𝗢𝗠 𝗲𝘃𝗲𝗻𝘁𝘀 wait for the next event loop cycle. Once I understood this, a lot of 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗶𝘀 𝘄𝗲𝗶𝗿𝗱 moments stopped being weird. They were just the event loop doing exactly what it was designed to do. Sometimes the bug isn’t in the code. It’s in our 𝗺𝗲𝗻𝘁𝗮𝗹 𝗺𝗼𝗱𝗲𝗹 of how the runtime works. #JavaScript #EventLoop #FrontendEngineering #SoftwareEngineering

Before optional chaining, my code looked like a trust issues simulator. ━━━━━━━━━━━━━━━━ ❌ Before: if (user &&   user.address &&   user.address.city) {  console.log(user.address.city); } ✅ After: console.log(user?.address?.city); ━━━━━━━━━━━━━━━━ What if anything in the chain is null or undefined? Just returns undefined. No crash.🤷 Works with methods too: const len = str?.trim()?.length; And arrays: const first = arr?.[0]; One operator. Replaced 10 lines of defensive code. Where has this been all my life. 🙏 #JavaScript #WebDev #LearnToCode #CodingTips

🔍 How JavaScript REALLY executes your code — a quick breakdown Most of us write JS every day, but rarely think about what happens before our code runs. Here's the journey V8 takes with every JS file: 1. Tokenization — raw text is broken into tokens (keywords, literals, operators) 2. AST Generation — tokens form an Abstract Syntax Tree, a hierarchical map of your code's structure 3. Ignition (Bytecode) — the AST is compiled into bytecode. Code starts running immediately — no need to wait for full machine code compilation 4. TurboFan (Machine Code) — hot functions (called repeatedly) get compiled into optimized native machine code But here's the part that matters for performance 👇 If TurboFan assumes a function always receives a number, and suddenly you pass a string — it deoptimizes. Falls back to the interpreter. Your any types in TypeScript aren't just a code smell — they're a V8 performance problem. And then there's the Event Loop: Call Stack → Microtask Queue → Task Queue Promises resolve before setTimeout, always Microtasks spawning microtasks can starve your render pipeline — real cause of UI freezes you can't explain Small things compound at platform scale. #JavaScript #WebPerformance #FrontendEngineering #StaffEngineer #V8 #PlatformEngineering

Solved another classic Linked List problem today: Swap Nodes in Pairs on LeetCode. Approach: Used a recursive strategy to swap nodes in pairs. Base condition: if the list has 0 or 1 node, return it as is. For each pair: Store the second node. Recursively process the remaining list. Reverse the current pair by updating pointers. Key pointer operations: temp = head.next head.next = swapPairs(head.next.next) temp.next = head Result: Runtime: 0 ms (Beats 100%) Memory: 52.66 MB (Beats 97.59%) Problems like this reinforce how powerful recursion and pointer manipulation are when working with linked lists. #DSA #LinkedList #LeetCode #JavaScript #ProblemSolving #DataStructures #Algorithms #CodingPractice #SoftwareEngineering #BackendDevelopment

💡 𝗧𝗶𝗽 𝗼𝗳 𝘁𝗵𝗲 𝗗𝗮𝘆 — 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗗𝗶𝗱 𝘆𝗼𝘂 𝗸𝗻𝗼𝘄? "Object.freeze()" makes an object 𝗶𝗺𝗺𝘂𝘁𝗮𝗯𝗹𝗲 — but only at the top level. That means: - You 𝗰𝗮𝗻𝗻𝗼𝘁 𝗮𝗱𝗱, 𝗿𝗲𝗺𝗼𝘃𝗲, 𝗼𝗿 𝗰𝗵𝗮𝗻𝗴𝗲 properties on the frozen object - But 𝗻𝗲𝘀𝘁𝗲𝗱 𝗼𝗯𝗷𝗲𝗰𝘁𝘀 𝗰𝗮𝗻 𝘀𝘁𝗶𝗹𝗹 𝗯𝗲 𝗺𝗼𝗱𝗶𝗳𝗶𝗲𝗱 🔧 𝗜𝗺𝗽𝗼𝗿𝘁𝗮𝗻𝘁: If you need full immutability, you’ll need a 𝗱𝗲𝗲𝗽 𝗳𝗿𝗲𝗲𝘇𝗲 (or use libraries like Immer). Shallow vs deep immutability — a small detail that can cause big bugs. #JavaScript #FrontendDevelopment #WebDevelopment #SoftwareEngineering #CodingTips #CleanCode #BestPractices #FullstackDeveloper

Predict the output: function test() { console.log(a); var a = 10; } test(); Output: undefined Why? Because of hoisting. JavaScript rewrites it internally as: function test() { var a; console.log(a); a = 10; } Only declaration is hoisted. Not initialization. Now try with let: function test() { console.log(a); let a = 10; } This throws an error. Because let has temporal dead zone. Understanding hoisting prevents subtle bugs. #javascript #frontend #webdevelopment #programming

𝗟𝗲𝘃𝗲𝗹𝗹𝗲𝗱 𝘂𝗽 𝘁𝗵𝗶𝘀 𝘀𝗽𝗿𝗶𝗻𝘁 𝗶𝗻 𝗮𝗻 𝘂𝗻𝗲𝘅𝗽𝗲𝗰𝘁𝗲𝗱 𝘄𝗮𝘆. Picked up some long-pending observability issues — duplicate errors, unhandled promises, and general noise that never felt “urgent enough.” One error stood out: 👉 `𝙩𝙝𝙞𝙨.𝙤.𝙖𝙩 𝙞𝙨 𝙣𝙤𝙩 𝙖 𝙛𝙪𝙣𝙘𝙩𝙞𝙤𝙣` Turned out it came from the `web-vitals` library using `𝙰̲𝚛̲𝚛̲𝚊̲𝚢̲.̲𝚙̲𝚛̲𝚘̲𝚝̲𝚘̲𝚝̲𝚢̲𝚙̲𝚎̲.̲𝚊̲𝚝̲(̲)̲` — not supported in all browsers possibly older versions. The fix? I wrote a polyfill. Always thought polyfills were just for interviews… turns out they matter in production too lol. Good reminder: As systems scale, anomalies become real work. Not glamorous. But 𝗰𝗿𝗶𝘁𝗶𝗰𝗮𝗹. Sometimes leveling up isn’t about building new things — it’s about making existing systems more reliable. #SoftwareEngineering #WebDevelopment #Observability #JavaScript #LearningInPublic

🚀 Day 13 of #DevDSA Today’s focus: Array + Hashing Basics Solved the classic problem: Contains Duplicate (LeetCode Easy) 🔍 What I learned: Used a JavaScript Object (obj) as a hash map to track elements How hashing helps reduce time complexity drastically ⚖️ Time vs Space Tradeoff: Brute Force Time Complexity: O(n²) Space Complexity: O(1) Optimized (Using Object) Time Complexity: O(n) Space Complexity: O(n) 💡 Key takeaway: Even a simple object can act like a hash map and help achieve optimal performance. 🧠 Approach used: Traverse array once Store elements in an object (obj) If element already exists in object → duplicate found One more step forward in consistency 💪 #Day13 #LeetCode #DSA #JavaScript #CodingJourney #100DaysOfCode #Developers #LearningInPublic

Day 13 of #30DaysOfTech 🚀 Today I simulated the feel of a real server. I created a small “ghost logger” system that: - Loops through users - Delays responses using setTimeout() - Differentiates between Admin and Guests - Logs activity gradually like real server processing Instead of everything printing at once, each user is “scanned” with a timed delay. It’s a small script… But it mimics how servers process requests over time. Backend isn’t just about syntax. It’s about thinking in flows, timing, and behavior. Building the mindset. 🔥 Check comment section for the code 👇👇👇 #LearningWithTS #BackendDevelopment #JavaScript #SoftwareEngineering #NodeJSJourney #LearningInPublic #BuildInPublic