Skip to content
Sachini Dilrangi.

the log

Field
notes.

Glowing amber light rays fanning out from a single bright point of origin at different angles against a black background

Aug 9, 2026 · 5 min read

Cosine Similarity, Explained With Your Hands

A vector ten times larger than another, pointing in the exact same direction, scores as a worse match under plain distance — the fix isn't a better distance formula, it's asking a different question: angle, not gap.

#embeddings#semantic-search#machine-learning
A dark star field with two glowing amber points close together near the center and one isolated point far below

Aug 9, 2026 · 6 min read

What Is an Embedding, Actually?

Two sentences that share exactly one word — 'the' — and mean almost the same thing. Why word-matching fails at this, and what it actually means to represent meaning as a point in space instead.

#embeddings#semantic-search#machine-learning
A dark hourglass with crimson sand in the top chamber falling as gold sand into the bottom chamber

Aug 6, 2026 · 6 min read

staleTime vs invalidateQueries: Who Wins?

A 60-second staleTime clock with 45 seconds left on it versus an invalidateQueries call fired 30 seconds ago — it sounds like a race between two timers, and that instinct is exactly backwards.

#react#tanstack-query#caching
Four identical stone archways in a row, three dim and crimson-tinted, the fourth fully lit and glowing gold-white

Aug 4, 2026 · 7 min read

Next.js Has Four Different Caches. Here's What Each One Actually Does

TanStack Query's cache, the Data Cache, the Router Cache, and the database itself — four separate systems that don't know about each other, plus a decision table for figuring out which one is actually serving stale data.

#react#tanstack-query#nextjs
Two glowing orbs, one crimson and one gold, facing each other and connected by a single crackling vertical thread of light

Aug 3, 2026 · 7 min read

One QueryClient or Two? The Server/Browser Singleton Pattern Explained

Two QueryClient implementations sitting in the same project, both correct in isolation — until you trace why the server needs a fresh one every time while the browser needs the exact same one forever.

#react#tanstack-query#nextjs
A glowing crystal on one cliff sending threads of light across a dark chasm to a crystal formation on a distant cliff

Aug 2, 2026 · 7 min read

prefetchQuery, dehydrate, HydrationBoundary: A Visual Walkthrough

Why a server-rendered TanStack Query page still flashes a loading spinner, and how prefetchQuery, dehydrate, and HydrationBoundary work together to eliminate it — one function at a time.

#react#tanstack-query#nextjs
Two matching stone archways in a dark room — one open and glowing gold with light spilling across the floor, the other closed and dark

Aug 1, 2026 · 4 min read

Does the src Folder Actually Matter in Next.js?

You clicked through a setup prompt without reading it. Here's what you actually chose, and whether it matters.

#nextjs#app-router#project-structure
A complete, glowing gold compass on the left beside a broken, incomplete red ring missing pieces on the right

Jul 31, 2026 · 6 min read

Why Does My Server Component Need an Absolute URL?

Why fetch('/api/posts') works in a Client Component but throws in a Server Component — and why the failure can hide silently inside prefetchQuery instead of erroring loudly.

#react#nextjs#server-components
Tangled red wires converging into a knot at a glowing gold gateway shaped like the Next.js logo, with a single clean gold thread passing straight through it

Jul 30, 2026 · 7 min read

Server Components vs Client Components: The Mental Model Nobody Explains Properly

The real rule behind Next.js's Server/Client boundary: it propagates through import statements, not JSX nesting — which is why a root layout can wrap the whole app in a provider without going fully client-side.

#react#nextjs#server-components
A grid of dark red cells receding into the distance with a few glowing gold cells lit up, evoking fresh rows in a lookup table

Jul 29, 2026 · 7 min read

TanStack Query in Plain English: What Actually Happens When You Call useQuery

A plain-English walkthrough of what useQuery actually does under the hood — the cache, queryKey, staleTime, and invalidateQueries, all as one consistent rule.

#react#tanstack-query#data-fetching
A tangled mass of red wires resolving into an ordered gold circuit grid

Jul 29, 2026 · 7 min read

Why I Stopped Using useEffect for Data Fetching

Five real problems with useEffect-based data fetching — no caching, duplicate requests, race conditions — and how TanStack Query solves each one.

#react#tanstack-query#data-fetching