Shipping React Faster Without Burning the Codebase
Lessons from rebuilding internal tooling at Harley Innovations: how component primitives, SSR and pragmatic caching cut iteration time in half.
When I joined the team, every new screen felt like starting from scratch. Buttons drifted, spacing wandered, and TypeScript errors lived in a folder no one opened.
We did three things, in this order: extracted a small set of primitives, locked the design tokens, and moved data fetching to the server. Nothing fancy — but together they removed entire categories of bugs.
Primitives first. We picked 12 components — Button, Input, Field, Card, Sheet, Dialog, Tabs, Avatar, Badge, Menu, Tooltip, Toast — and forbade ad-hoc variants in feature code. Every variant must be added to the primitive.
Then tokens. Color, radius, spacing and font tokens went into one CSS file. Feature code only consumes semantic tokens (bg-card, text-muted-foreground), never raw values. That alone killed half our drift.
SSR with TanStack Start gave us per-route loaders and tiny client bundles. Most pages render before JS finishes — and the few interactive bits hydrate where needed.
Six weeks later, ticket throughput nearly doubled. Not because we worked harder — because the codebase stopped pushing back.