Skip to content
Journal

Performance

16 posts
  1. Staff-Level React Architecture and Modern Refactoring: A Playbook for React 19.xA senior engineer's field guide to React 19.3: useActionState, useOptimistic, the React Compiler, ViewTransition, Fragment refs, and how to review async React code the way a staff engineer would.ReactPerformance33 min
  2. The Senior Frontend Engineer's Field Guide: Building an Enterprise Next.js 16 and React 19 Application From ScratchA hands-on, command-by-command build of an enterprise Next.js 16 and React 19 application, with every config flag, cache directive, security boundary and TypeScript pattern explained and empirically verified against the real 16.3.6 build — for a senior frontend interview with a week to prepare.ArchitectureReact94 min
  3. The Senior Frontend Engineer's Field Guide to the DOM and JavaScript Engine InternalsA hands-on, verified tour of what actually happens between your JavaScript and the pixels on screen: the rendering pipeline, live vs static collections, the event loop's real ordering guarantees, layout thrashing, Web Components, and a working virtualized 100,000-row data grid — built and checked in a real browser.JavaScriptDOM41 min
  4. The Senior Frontend Engineer's Field Guide to Advanced CSS and Tailwind v4A verified, hands-on tour of CSS for senior engineers: the rendering pipeline, cascade layers and the counterintuitive !important inversion, subgrid, container queries, :has() as a state machine, the Popover API, scroll-driven animations, and Tailwind v4's Rust engine — with a real capstone app built, tested, and debugged in a live browser.CSSArchitecture42 min
  5. The Senior Frontend Engineering Blueprint, Part 7: Building a Linear-Time Query Language ParserEvery product with a power-user search box eventually needs a real query language, and reaching for new RegExp(userInput) is how you end up hand-rolling a vulnerability. Here is a filter-query DSL built from a sticky-regex tokenizer, a recursive-descent parser, and a recursive Zod schema — with a ReDoS stress test to prove the O(N) claim.JavaScriptArchitecture11 min
  6. The Senior Frontend Engineering Blueprint, Part 6: Regex Engines, ReDoS and Defending Untrusted InputA validation regex that passes code review can still be an O(2^n) time bomb. Here is how V8's regex engine actually backtracks, the exact shape of pattern that wedges it, and the rest of the perimeter — Zod pipelines, parameterised SQL, DOMPurify, CSP — that a Next.js app needs around untrusted input.JavaScriptPerformance12 min
  7. The Senior Frontend Engineering Blueprint, Part 4: Virtualising 50,000 Rows Without Losing AccessibilityRendering 50,000 DOM rows is a real performance problem, and virtualising them away is a real accessibility problem if you stop at the transform. Here is a generic VirtualList built from scratch, with the ARIA contract most implementations skip.ArchitectureReact10 min
  8. The Senior Frontend Engineering Blueprint, Part 3: Parallel Routes, TanStack Query and a Tailwind v4 Design SystemPart 3 of an eight-part build: the file-system pattern behind Instagram-style shareable modals, prefetching TanStack Query on the server and hydrating it on the client without a duplicate fetch, a Tailwind v4 @theme design system with a CVA button primitive, and why Core Web Vitals numbers stay aspirational until you actually reserve the layout space.ReactPerformance15 min
  9. React Compiler Internals: How Auto-Memoisation Works, and Where It Gives UpThe compiler does not memoise your components by wrapping them in `memo`. It rewrites them into a cache-slot machine, and it does it only when it can prove your code follows the rules. Here is the proof it needs, and what breaks it.CompilersReact7 min
  10. Context Window Engineering: Compaction, Retrieval and Why Long Sessions DegradeA million-token window did not solve the problem, it moved it. Attention is not uniform, irrelevant context actively costs accuracy, and the skill that matters now is deciding what an agent is allowed to see.ArchitectureAI8 min
  11. Next.js in 2026: The Flight Wire Format, Cache Components and Tag InvalidationReact Server Components do not send HTML and they do not send JSON. Here is what actually goes over the wire, how Cache Components replaced three separate flags, and the invalidation race that a single-argument `revalidateTag` used to hide.ArchitectureReact8 min
  12. React Native's New Architecture: JSI, Fabric and the Bridgeless TurboModuleThe bridge is gone — removed outright, not deprecated. What replaced it is a set of C++ abstractions with real performance characteristics, and a new generation of native modules that compile straight to JSI bindings.ArchitecturePerformance7 min
  13. Senior Frontend Interview Prep, Part 6: Async, Promises, Workers and Shared MemoryFifteen questions on concurrency: promise internals, what `await` desugars to, cancellation that actually cancels, transferables and zero-copy, `SharedArrayBuffer` under cross-origin isolation, and a task pool you can paste into production.ConcurrencyJavaScript12 min
  14. Senior Frontend Interview Prep, Part 3: The Event Loop, Scheduling and Paint TimingFifteen questions on what actually runs next: microtasks against macrotasks, the rendering opportunity, libuv's phases, the nextTick ordering rule that has an exception nobody mentions, and how to break up a long task without hurting INP.JavaScriptBrowser10 min
  15. Senior Frontend Interview Prep, Part 2: Memory, Garbage Collection and Leak TopologiesFifteen interview questions on the V8 heap: generational collection, the scavenger, concurrent marking and write barriers, and the five leak shapes behind almost every 'the tab is using two gigabytes' report.MemoryJavaScript12 min
  16. Senior Frontend Interview Prep, Part 1: Inside the JavaScript EngineFifteen interview questions on how V8 turns source text into machine code — tiers, hidden classes, inline caches, elements kinds and deoptimisation — with the answers verified against a live engine.JavaScriptV812 min