Design Systems and Tokens
Listed inDesign Systems and TokensFrontend Engineeringon
Encoding colour, spacing, and type as tokens so a redesign is a values change rather than a rewrite.
Intermediate8 minDraft
#design
The browser as a runtime you do not control: how a page actually becomes pixels, and the decisions that make it fast, responsive, and maintainable.
25 articles
Listed inDesign Systems and TokensFrontend Engineeringon
Encoding colour, spacing, and type as tokens so a redesign is a values change rather than a rewrite.
Listed inClient State ManagementFrontend Engineeringon
Local, shared, URL, and server state — four kinds with different rules, usually confused for one.
Listed inBrowser StorageFrontend Engineeringon
Cookies, localStorage, and IndexedDB — capacity, lifetime, and which ones a script can read.
Listed inThe Critical Rendering PathFrontend Engineeringon
What blocks the first paint, why a stylesheet is render-blocking and a script can be worse, and how to unblock both.
Listed inBundlers and ToolingFrontend Engineeringon
Module graphs, code splitting, tree shaking, source maps, and reading a bundle analysis honestly.
Listed inCSS ArchitectureFrontend Engineeringon
BEM, utility-first, CSS modules, and cascade layers — how teams stop fighting over specificity.
Listed inHydration and Its CostsFrontend Engineeringon
Attaching behaviour to server-rendered markup, the gap where the page looks ready but is not, and islands.
Listed inSame-Origin Policy and CORSFrontend Engineeringon
What an origin is, why the preflight happens, and the header the backend was always missing.
Listed inHow the Browser WorksFrontend Engineeringon
Parse, DOM and CSSOM, layout, paint, composite — the pipeline every performance problem lives somewhere inside.
Listed inAnimation and MotionFrontend Engineeringon
Animating on the compositor, avoiding layout thrash, and honouring reduced-motion preferences.
Listed inResponsive DesignFrontend Engineeringon
Fluid type and space, container queries, and designing from content outwards rather than from breakpoints in.
Listed inRendering StrategiesFrontend Engineeringon
Client, server, static, incremental, and streaming — what each does to the first byte and the first interaction.
Listed inClient-Side RoutingFrontend Engineeringon
History, scroll restoration, and keeping the URL the source of truth rather than a side effect.
Listed inWeb TypographyFrontend Engineeringon
Web font loading, FOUT and FOIT, subsetting, variable fonts, and a scale that holds at every size.
Listed inCSS LayoutFrontend Engineeringon
Flexbox for one dimension, grid for two, and the handful of cases where neither is the answer.
Listed inComponent ModelsFrontend Engineeringon
Props down, events up, composition over configuration, and where reactivity differs between frameworks.
Listed inForms and ValidationFrontend Engineeringon
Controlled versus uncontrolled inputs, validating in both places, and error messages that help.
Listed inImages and MediaFrontend Engineeringon
Modern formats, responsive sources, lazy loading, and reserving space so nothing jumps.
Listed inCSS FundamentalsFrontend Engineeringon
The box model, the cascade, specificity, and inheritance — four rules that explain almost every surprise.
Listed inBrowser CompatibilityFrontend Engineeringon
Baseline, feature detection, polyfills, and choosing a support matrix from analytics rather than habit.
Listed inThe DOM and EventsFrontend Engineeringon
Capture, bubble, delegation, and why touching the DOM in a loop is the slowest thing on the page.
Listed inData FetchingFrontend Engineeringon
Caching, revalidation, optimistic updates, and cancelling the request whose response nobody wants.
Listed inWeb PerformanceFrontend Engineeringon
LCP, CLS, and INP — what each measures, what actually moves it, and measuring on real devices.
Listed inHTML and SemanticsFrontend Engineeringon
Choosing the element that already means what you need — the cheapest accessibility and SEO work available.
Listed inProgressive EnhancementFrontend Engineeringon
Working without JavaScript first, then improving — and what still breaks when a bundle fails to load.