Kelly Mears

KnowledgeDomain

Web Platform

Where code runs, what ships, and what the browser does with it.

Notes
22
Within this domain
87
To other domains
92

This domain, and what it touches

Knowledge graph: 74 notes, 179 links.Each dot is a note, sized by how many links it has and coloured by topic. Focus or hover a dot to isolate it and its neighbours; activate it to open the note. The graph is a single tab stop: use the arrow keys to move between notes, Home and End for the most and least linked, Enter to open the focused note, and Escape to leave the graph.Silent FailureGround TruthDeterminismNamingAccessibilityServer-Side RenderingContinuous IntegrationReproducible CaseModule GraphPerformance BudgetReact Server ComponentsComponent StoryIslands ArchitectureSearch Engine OptimizationFocus ManagementPortalProgressive EnhancementGoodhart's LawHeadless ComponentBundlerCode CoverageCode SplittingCore Web VitalsDocument Object ModelFlaky TestHydrationKeyboard NavigationLazy LoadingMotion DesignRecord and Replay TestingSemantic HTMLStacking ContextStatic Site GenerationCache InvalidationcontenteditableFingerprintMarkdownRace ConditionUnit TestARIABacklinkClient-Server BoundaryDark ModeFocus TrapFrontmatterHeadless BrowserIncremental Static RegenerationPackage ManagerReduced MotionRSSStructured DataTypographic ScaleCascadeColor ContrastCritical Rendering PathCSS Custom PropertyLeast PrivilegeSchema DriftScoped StylingSemantic VersioningStreaming ResponseTest-Driven DevelopmentTree ShakingWeb Font LoadingLockfileMonorepoPortStaggered AnimationEasingEventual ConsistencyHash FunctionMulti-TenancyDomain Name SystemSame-Origin Policy

Drag to pan · hold ⌘/ctrl and scroll — or pinch — to zoom.

The notes

Most connected first

Server-Side Rendering

Producing a page's HTML on the server so the first response is already content.

Web Platform18 connections

Module Graph

The directed graph of imports that decides what code ends up where.

Web Platform16 connections

Performance Budget

A committed numeric ceiling on a page's cost, enforced automatically.

Web Platform16 connections

React Server Components

Components that execute only on the server and never ship their code to the browser.

Web Platform16 connections

Islands Architecture

Rendering a page as static HTML with small independently interactive regions.

Web Platform15 connections

Portal

Rendering an element into a different part of the document than its logical parent.

Web Platform14 connections

Progressive Enhancement

Building so the core experience works without scripts, with richer behaviour layered on top.

Web Platform14 connections

Bundler

The tool that resolves an application's modules into the files a browser downloads.

Web Platform12 connections

Code Splitting

Dividing an application bundle so a page downloads only the code it needs.

Web Platform12 connections

Core Web Vitals

Google's small set of user-centred performance metrics: loading, interactivity, and visual stability.

Web Platform12 connections

Document Object Model

The live tree of objects a browser builds from a document, and the surface every UI framework writes to.

Web Platform12 connections

Hydration

Attaching client-side behaviour to server-rendered markup without rebuilding it.

Web Platform12 connections

Lazy Loading

Deferring the fetch of a resource until it is needed, or until the browser is idle.

Web Platform12 connections

Static Site Generation

Rendering every page to a file at build time, so serving is just handing over bytes.

Web Platform12 connections

Cache Invalidation

Deciding when a cached value has stopped being correct — famously one of the hard problems.

Web Platform11 connections

contenteditable

The HTML attribute that makes an element directly editable, and the surface behind most rich-text editors.

Web Platform11 connections

Client-Server Boundary

The line in an application where execution moves from the server to the browser.

Web Platform10 connections

Incremental Static Regeneration

Serving a cached static page while regenerating it in the background after a chosen interval.

Web Platform10 connections

Critical Rendering Path

The sequence of steps between receiving HTML and painting pixels, and everything that blocks it.

Web Platform9 connections

Tree Shaking

Statically removing exports that nothing imports, shrinking the shipped bundle.

Web Platform9 connections

Web Font Loading

How custom typefaces are fetched and shown, and why the cost is easy to misattribute.

Web Platform9 connections

Same-Origin Policy

The browser rule isolating documents by scheme, host, and port, and the mechanisms for relaxing it.

Web Platform4 connections