Skip to content

Playbooks

Playbooks start from a situation, not a technology. You arrive with a symptom (“my list of 10,000 items is slow”, “my endpoint takes 3 seconds”, “should this be a web app or a native app?”) and leave with:

  1. A diagnosis — why it happens, connected to the fundamentals of the area
  2. A grounded recommendation — with before/after code and complexity (Big O) when it applies
  3. Honest thresholds — when the fix matters and when it doesn’t (“with n < 1,000 you won’t notice”)
  4. Discarded alternatives — each with its trade-offs and the situation where it would be the right call
  5. How to measure — the concrete tool to verify before and after; never optimize without measuring

The technology is the consequence of the recommendation, never the starting point.

How to use this section

Each area opens with a Fundamentals page — the mental model explained from zero, with primary sources (MDN, web.dev, official Node/Postgres/React Native docs). The cases then apply that fundamental to concrete situations. If a case’s diagnosis doesn’t click, read the area’s fundamentals first.

Find your symptom

This is happening to youGo here
You combine two lists and it gets slow as data growsCrossing two lists is slow
You need search or filtering and it’s sluggishYou need to search/filter
Sorting or ranking data takes too longYou sort/rank data
Deduplicating or counting items is slowDuplicates and counting
A CPU-heavy computation blocks everythingA CPU-bound task blocks everything
You fire many async operations and it’s slow or flakyMany async operations at once
A list of thousands of items renders slowlyYour huge list renders slowly
Typing in an input feels laggyThe input lags while typing
Images make your page heavy and slowYour images are slow
The UI freezes during a heavy computationThe UI freezes
An endpoint takes seconds to respondYour endpoint is slow
You read the same data over and overYou read the same data constantly
Heavy tasks block your request handlersHeavy jobs block requests
Traffic is growing and you don’t know what to scaleTraffic is growing
You’re starting a product and don’t know the platformWeb, PWA, hybrid or native?
You’re building an internal tool or dashboardAn internal tool or dashboard
Your mobile animations stutterAnimations stutter on mobile
Long lists scroll badly on mobileLong lists on mobile
Your app must work offlineIt must work offline

The areas

  • Algorithms & Data Structures — Big O in practice: what each JS operation actually costs, and when shape-of-the-algorithm is your real problem.
  • Runtime & Concurrency — the event loop in the browser and Node, why “single-threaded” doesn’t mean “no concurrency”. Conceptual base for the frontend and backend areas.
  • Frontend Performance — the browser render pipeline, React re-renders, Core Web Vitals.
  • Backend & Data — how a database executes a query, indexes, query plans, and the layers above them.
  • Platform Choice — deciding between web, PWA, hybrid, and native based on team, time, budget, and requirements.
  • Mobile & Native — the React Native bridge/JSI, JS thread vs UI thread, and why mobile jank is a threading problem.

How this differs from Recommendations

Recommendations compare tools for a need you already understand (“which payment processor?”). Playbooks diagnose a situation you don’t fully understand yet (“why is this slow?”) — the tool, if any, falls out of the diagnosis.