All posts

40 posts · 90 topics

All184 #javascript17 #react16 #nextjs11 #frontend10 #async9 #performance9 #event loop6 #hooks6 #basics4 #promises4

2026

JavaScript Generators & Iterators — Lazy Sequences Explained

Generators let you produce values on demand instead of all at once. Learn how iterators and generator functions work, and when to reach for them.

Posted 3 days ago3 minintermediate

React memo vs useMemo vs useCallback — When to Use Which

Three React APIs that all say 'memoize' — but they do different things. Clear explanations, examples, and a cheatsheet.

Posted on June 203 minintermediate

CDN Explained: What It Is, How It Works, and How to Use It in Next.js

A CDN speeds up your app by serving assets from servers close to your users. Here's how it works and how Next.js takes advantage of it.

2025

Posted on December 311 minintermediate

queueMicrotask Explained: The Smallest Async Queue in JavaScript

What queueMicrotask does, how it differs from Promise.then, and how microtasks really work under the hood.

Posted on December 303 minintermediate

Why async/await Doesn’t Make JavaScript Code Parallel

Async/await feels like parallel code, but it isn’t. Here’s why JavaScript is still single-threaded and how async really works.

Posted on December 302 minintermediate

How Promise.all Works in a Single-Threaded JavaScript World

If JavaScript is single-threaded, how can Promise.all handle multiple requests at the same time? A deep dive into the event loop and async I/O.

Posted on December 303 minintermediate

Promise APIs Compared: all vs race vs any vs allSettled

A practical and conceptual comparison of Promise.all, Promise.race, Promise.any, and Promise.allSettled.

Posted on December 303 minintermediate

Are TypeScript Enums a Good Idea? (Bundle Size & Runtime)

A practical guide to TypeScript enums, their runtime cost, and better alternatives for modern frontend apps.

Posted on December 303 minintermediate

Web Workers Explained for Frontend Developers

How Web Workers work, why they matter, and when to use them to achieve real parallelism in frontend apps.

Posted on December 121 minintermediate

useDeferredValue Explained: Keeping React UIs Responsive

How useDeferredValue works under the hood, when to use it, and how it differs from useTransition.

Posted on December 123 minintermediate

useTransition Explained: Make React Feel Instant

How useTransition works under the hood, when to use it, and how it differs from useDeferredValue.

Posted on October 143 minintermediate

Understanding HttpOnly Cookies in Depth

How HttpOnly cookies work, why they're essential for security, and how to use them safely in Next.js and Express.

Posted on October 84 minadvanced

React Fiber Explained: How React’s Engine Actually Works

A deep but clear explanation of React Fiber — the engine that powers modern React rendering and concurrency.

Posted on October 63 minintermediate

React Context Explained: How It Works Under the Hood

Understand what React Context is, how it works internally, and best practices for using it effectively.

Posted on October 53 minintermediate

BroadcastChannel API in JavaScript

How to communicate between browser tabs, windows, or iframes easily using the BroadcastChannel API.

Posted on October 42 minintermediate

Prefetching in Next.js Links Explained

How Next.js prefetch works in <Link>, why it makes navigation fast, and when to disable it.

Posted on September 293 minintermediate

Why MUI Avoids Theme Flash on First Load (Dark/Light Mode)

How MUI applies the correct color scheme on the very first paint, and why other UI kits often flash light before switching to dark.

Posted on September 262 minbeginner

Deep Copy vs Shallow Copy in JavaScript

Understand the difference between shallow and deep copies, with examples and pitfalls.

Posted on September 262 minintermediate

Why setState Doesn’t Cause Hydration Errors

Understanding why calling setState after hydration doesn’t produce hydration mismatches in React/Next.js.

Posted on September 234 minintermediate

AbortController & AbortSignal

Everything you need to cancel async work in JS: fetch, streams, custom tasks, React patterns, Node notes, timeouts, races, and common pitfalls.

Posted on September 234 minintermediate

How useState Works Under the Hood (and Why It Needs use client)

Deep dive into React's useState, how it works internally, and why client components are required in Next.js App Router.

Posted on September 235 minintermediate

JavaScript Closures — A Simple Deep Dive

What closures are, how they work (lexical scope), and how to use them without pitfalls.

Posted on September 232 minbeginner

JavaScript Promises Explained

A simple but deep dive into how Promises work in JavaScript and why they matter.

Posted on September 232 minbeginner

JavaScript is Single-Threaded

Understand what it means when people say JS is single-threaded.

Posted on September 232 minbeginner

What is 'use client' in Next.js?

Understand 'use client' in Next.js App Router: what it means, when to use it, and how it works under the hood.

Posted on September 232 minbeginner

Next.js Page Router vs App Router

Understand the key differences between the old Page Router and the new App Router in Next.js.

Posted on September 214 minintermediate

JavaScript Event Bus 🚍 (JS + TypeScript)

A polished, practical event bus pattern with minimal JS, a strongly-typed TS version, wildcards, once-handlers, and React usage tips.

Posted on September 212 minintermediate

React Higher-Order Components (HOC)

Understand Higher-Order Components (HOCs) in React with examples, use cases, downsides, and a comparison to hooks.

Posted on September 201 minbeginner

JavaScript's Event Loop — Simple Guide (with SVG Timeline)

Event loop explained with a clean SVG timeline showing the actual execution order: Start → End → Promise → Timeout.

Posted on September 203 minadvanced

Microtask vs Macrotask in JavaScript — With Node.js vs Browser Notes

Understand microtasks and macrotasks across browsers and Node.js, including process.nextTick, setImmediate, and event loop phases.

Posted on September 202 minintermediate

Next.js App Router Caching — Cheat Sheet

A compressed reference of Next.js caching layers and controls (App Router).

Posted on September 172 minintermediate

React useRef vs useState — When to Use Which

A simple guide to understanding when to use useRef and useState in React, with examples, mental models, and a quick cheatsheet.

Posted on September 173 minintermediate

When Should You Use Dynamic Import in React/Next.js? (With Performance Comparison)

A practical guide to dynamic imports with real-world examples and a before/after bundle-size comparison using next-bundle-analyzer.

Posted on September 161 minbeginner

Git Rebase vs Git Merge — Simple Guide

Understand the difference between git rebase and git merge with analogies, ASCII diagrams, and visual commit history diagrams.

Posted on September 154 minadvanced

Frontend Design Patterns — A Practical Guide

A concise, example‑driven overview of the most useful frontend patterns for modern React/Next.js apps.

Posted on September 156 minadvanced

MVVM, Micro‑Frontends, and Domain‑Driven Frontend — A Practical Guide

Clear, practical explanations of MVVM, micro‑frontends, and domain‑driven design for modern React/Next.js teams, with examples, folder structures, and trade‑offs.

Posted on September 131 minbeginner

Event Bubbling vs Event Capturing in JavaScript

Understand how events travel through the DOM: bubbling (bottom-up) vs capturing (top-down) with simple examples and mental models.

Posted on September 131 minbeginner

Async vs Sync in JavaScript

Understand the difference between synchronous and asynchronous code in JavaScript with simple examples and analogies.

Posted on September 132 minbeginner

SOLID Principles Explained Simply

An easy-to-understand guide to SOLID principles for cleaner, more maintainable code.

Posted on August 111 minbeginner

What is Docker? The 2-minute mental model

Understand containers like folders for apps—portable and predictable.