In memory of Saber Rastikerdar — creator of · Vazirmatn, the open typeface he gave the Persian web and asked nothing for.
Skip to content

Article Inventory

The complete article inventory for Frontend Engineering, generated from the taxonomy in KNOWLEDGE_MAP.md and the per-article metadata in each domain's graph.json. Every article below is a leaf of the four-level hierarchy Part → Domain → Topic → Article.

Summary

  • Total articles: 651
  • Parts: 9 · Domains: 35
  • Total estimated reading time: ~8459 min (~141 h)
  • Total expected code examples: ~1816
  • Difficulty distribution: Foundational 169 · Intermediate 288 · Advanced 160 · Staff 34
  • Status: 84 Published · 567 Planned.

Column reference

ColumnMeaning
TitleArticle title (the leaf concept).
SlugStable file name under the domain folder.
CategoryDomain — the folder the article lives in.
SubcategoryTopic — the grouping within the domain.
PriorityInherited from the Part (Critical / High / Medium).
DifficultyFoundational / Intermediate / Advanced / Staff.
Est. Reading TimeEstimated minutes to read.
PrerequisitesArticles to read first (Article · Domain denotes a cross-domain prerequisite).
Related ArticlesClosely connected articles.
Expected Code ExamplesPlanning estimate of code snippets, derived from difficulty tier (Foundational 2, Intermediate 3, Advanced 4, Staff 1; leadership topics carry fewer).
StatusAuthoring status — Published or Planned.

00 · Foundations · Priority: Critical · 96 articles

Browser APIs (23 articles · ~199 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Web Storageweb-storage.mdBrowser APIsStorageCriticalFoundational8 minProcess & Thread Architecture · The Web PlatformIndexedDB; The Cache Storage API; Cookies & Partitioned Storage; Storage Quotas & Eviction2Published
IndexedDBindexeddb.mdBrowser APIsStorageCriticalFoundational8 minWeb StorageWeb Storage; The Cache Storage API; Cookies & Partitioned Storage; Storage Quotas & Eviction2Published
The Cache Storage APIthe-cache-storage-api.mdBrowser APIsStorageCriticalFoundational8 minWeb StorageWeb Storage; IndexedDB; Cookies & Partitioned Storage; Storage Quotas & Eviction2Published
Cookies & Partitioned Storagecookies-and-partitioned-storage.mdBrowser APIsStorageCriticalFoundational11 minWeb StorageWeb Storage; IndexedDB; The Cache Storage API; Storage Quotas & Eviction2Published
Storage Quotas & Evictionstorage-quotas-and-eviction.mdBrowser APIsStorageCriticalFoundational8 minWeb StorageWeb Storage; IndexedDB; The Cache Storage API; Cookies & Partitioned Storage2Published
Intersection Observerintersection-observer.mdBrowser APIsObserversCriticalFoundational8 minWeb StorageResize Observer; Mutation Observer; Performance Observer2Planned
Resize Observerresize-observer.mdBrowser APIsObserversCriticalFoundational8 minIntersection Observer; Web StorageIntersection Observer; Mutation Observer; Performance Observer2Planned
Mutation Observermutation-observer.mdBrowser APIsObserversCriticalFoundational8 minIntersection Observer; Web StorageIntersection Observer; Resize Observer; Performance Observer2Planned
Performance Observerperformance-observer.mdBrowser APIsObserversCriticalFoundational8 minIntersection Observer; Web StorageIntersection Observer; Resize Observer; Mutation Observer2Planned
Media Capture & Streamsmedia-capture-and-streams.mdBrowser APIsDevice & MediaCriticalFoundational8 minIntersection ObserverThe Clipboard API; File & File System Access; Geolocation & Sensors; Notifications & Permissions2Planned
The Clipboard APIthe-clipboard-api.mdBrowser APIsDevice & MediaCriticalFoundational8 minMedia Capture & Streams; Intersection ObserverMedia Capture & Streams; File & File System Access; Geolocation & Sensors; Notifications & Permissions2Planned
File & File System Accessfile-and-file-system-access.mdBrowser APIsDevice & MediaCriticalFoundational8 minMedia Capture & Streams; Intersection ObserverMedia Capture & Streams; The Clipboard API; Geolocation & Sensors; Notifications & Permissions2Planned
Geolocation & Sensorsgeolocation-and-sensors.mdBrowser APIsDevice & MediaCriticalFoundational8 minMedia Capture & Streams; Intersection ObserverMedia Capture & Streams; The Clipboard API; File & File System Access; Notifications & Permissions2Planned
Notifications & Permissionsnotifications-and-permissions.mdBrowser APIsDevice & MediaCriticalFoundational11 minMedia Capture & Streams; Intersection ObserverMedia Capture & Streams; The Clipboard API; File & File System Access; Geolocation & Sensors2Planned
The History APIthe-history-api.mdBrowser APIsNavigation & HistoryCriticalFoundational8 minMedia Capture & StreamsThe Navigation API; URL & URLSearchParams2Planned
The Navigation APIthe-navigation-api.mdBrowser APIsNavigation & HistoryCriticalFoundational8 minThe History API; Media Capture & StreamsThe History API; URL & URLSearchParams2Planned
URL & URLSearchParamsurl-and-urlsearchparams.mdBrowser APIsNavigation & HistoryCriticalFoundational8 minThe History API; Media Capture & StreamsThe History API; The Navigation API2Planned
Timers & requestIdleCallbacktimers-and-requestidlecallback.mdBrowser APIsTiming & SchedulingCriticalFoundational11 minThe History APIrequestAnimationFrame; The Scheduler API (postTask)2Planned
requestAnimationFramerequestanimationframe.mdBrowser APIsTiming & SchedulingCriticalFoundational8 minTimers & requestIdleCallback; The History APITimers & requestIdleCallback; The Scheduler API (postTask)2Planned
The Scheduler API (postTask)the-scheduler-api-posttask.mdBrowser APIsTiming & SchedulingCriticalFoundational11 minTimers & requestIdleCallback; The History APITimers & requestIdleCallback; requestAnimationFrame2Planned
Feature Detectionfeature-detection.mdBrowser APIsCapability ModelCriticalFoundational8 minTimers & requestIdleCallbackPermissions Policy; Progressive Enhancement Strategy2Planned
Permissions Policypermissions-policy.mdBrowser APIsCapability ModelCriticalFoundational8 minFeature Detection; Timers & requestIdleCallbackFeature Detection; Progressive Enhancement Strategy2Planned
Progressive Enhancement Strategyprogressive-enhancement-strategy.mdBrowser APIsCapability ModelCriticalFoundational11 minFeature Detection; Timers & requestIdleCallbackFeature Detection; Permissions Policy2Planned

Computer Science for Frontend (18 articles · ~156 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Trees & the DOM as a Treetrees-and-the-dom-as-a-tree.mdComputer Science for FrontendData StructuresCriticalFoundational8 minGraphs & Dependency Modeling; Hash Maps & Sets; Stacks & Queues; Linked & Persistent Lists2Published
Graphs & Dependency Modelinggraphs-and-dependency-modeling.mdComputer Science for FrontendData StructuresCriticalFoundational11 minTrees & the DOM as a TreeTrees & the DOM as a Tree; Hash Maps & Sets; Stacks & Queues; Linked & Persistent Lists2Planned
Hash Maps & Setshash-maps-and-sets.mdComputer Science for FrontendData StructuresCriticalFoundational8 minTrees & the DOM as a TreeTrees & the DOM as a Tree; Graphs & Dependency Modeling; Stacks & Queues; Linked & Persistent Lists2Planned
Stacks & Queuesstacks-and-queues.mdComputer Science for FrontendData StructuresCriticalFoundational8 minTrees & the DOM as a TreeTrees & the DOM as a Tree; Graphs & Dependency Modeling; Hash Maps & Sets; Linked & Persistent Lists2Planned
Linked & Persistent Listslinked-and-persistent-lists.mdComputer Science for FrontendData StructuresCriticalFoundational8 minTrees & the DOM as a TreeTrees & the DOM as a Tree; Graphs & Dependency Modeling; Hash Maps & Sets; Stacks & Queues2Planned
Tree Diffing Algorithmstree-diffing-algorithms.mdComputer Science for FrontendAlgorithmsCriticalFoundational8 minTrees & the DOM as a TreeTraversal (DFS, BFS); Searching & Filtering; Sorting & Comparators; Memoization & Dynamic Programming2Planned
Traversal (DFS, BFS)traversal-dfs-bfs.mdComputer Science for FrontendAlgorithmsCriticalFoundational8 minTree Diffing Algorithms; Trees & the DOM as a TreeTree Diffing Algorithms; Searching & Filtering; Sorting & Comparators; Memoization & Dynamic Programming2Planned
Searching & Filteringsearching-and-filtering.mdComputer Science for FrontendAlgorithmsCriticalFoundational8 minTree Diffing Algorithms; Trees & the DOM as a TreeTree Diffing Algorithms; Traversal (DFS, BFS); Sorting & Comparators; Memoization & Dynamic Programming2Planned
Sorting & Comparatorssorting-and-comparators.mdComputer Science for FrontendAlgorithmsCriticalFoundational8 minTree Diffing Algorithms; Trees & the DOM as a TreeTree Diffing Algorithms; Traversal (DFS, BFS); Searching & Filtering; Memoization & Dynamic Programming2Planned
Memoization & Dynamic Programmingmemoization-and-dynamic-programming.mdComputer Science for FrontendAlgorithmsCriticalFoundational11 minTree Diffing Algorithms; Trees & the DOM as a TreeTree Diffing Algorithms; Traversal (DFS, BFS); Searching & Filtering; Sorting & Comparators2Planned
Big-O for UI Operationsbig-o-for-ui-operations.mdComputer Science for FrontendComplexity & CostCriticalFoundational8 minTree Diffing AlgorithmsAmortized Cost & Batching; Space vs Time Trade-offs2Planned
Amortized Cost & Batchingamortized-cost-and-batching.mdComputer Science for FrontendComplexity & CostCriticalFoundational8 minBig-O for UI Operations; Tree Diffing AlgorithmsBig-O for UI Operations; Space vs Time Trade-offs2Planned
Space vs Time Trade-offsspace-vs-time-trade-offs.mdComputer Science for FrontendComplexity & CostCriticalFoundational8 minBig-O for UI Operations; Tree Diffing AlgorithmsBig-O for UI Operations; Amortized Cost & Batching2Planned
Immutability & Structural Sharingimmutability-and-structural-sharing.mdComputer Science for FrontendModeling ChangeCriticalFoundational11 minBig-O for UI OperationsFinite State Machines; Statecharts & Hierarchical States2Planned
Finite State Machinesfinite-state-machines.mdComputer Science for FrontendModeling ChangeCriticalFoundational8 minImmutability & Structural Sharing; Big-O for UI OperationsImmutability & Structural Sharing; Statecharts & Hierarchical States2Planned
Statecharts & Hierarchical Statesstatecharts-and-hierarchical-states.mdComputer Science for FrontendModeling ChangeCriticalFoundational11 minImmutability & Structural Sharing; Big-O for UI OperationsImmutability & Structural Sharing; Finite State Machines2Planned
Concurrency vs Parallelismconcurrency-vs-parallelism.mdComputer Science for FrontendExecution ModelsCriticalFoundational8 minImmutability & Structural SharingDeterminism & Idempotency2Planned
Determinism & Idempotencydeterminism-and-idempotency.mdComputer Science for FrontendExecution ModelsCriticalFoundational8 minConcurrency vs Parallelism; Immutability & Structural SharingConcurrency vs Parallelism2Planned

Networking & Protocols (19 articles · ~170 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
HTTP/1.1 Semanticshttp-1-1-semantics.mdNetworking & ProtocolsHTTPCriticalFoundational8 minProcess & Thread Architecture · The Web PlatformHTTP/2 Multiplexing; HTTP/3 & QUIC; Methods, Status Codes & Headers2Published
HTTP/2 Multiplexinghttp-2-multiplexing.mdNetworking & ProtocolsHTTPCriticalFoundational8 minHTTP/1.1 SemanticsHTTP/1.1 Semantics; HTTP/3 & QUIC; Methods, Status Codes & Headers2Published
HTTP/3 & QUIChttp-3-and-quic.mdNetworking & ProtocolsHTTPCriticalFoundational8 minHTTP/1.1 SemanticsHTTP/1.1 Semantics; HTTP/2 Multiplexing; Methods, Status Codes & Headers2Planned
Methods, Status Codes & Headersmethods-status-codes-and-headers.mdNetworking & ProtocolsHTTPCriticalFoundational11 minHTTP/1.1 SemanticsHTTP/1.1 Semantics; HTTP/2 Multiplexing; HTTP/3 & QUIC2Planned
The HTTP Cachethe-http-cache.mdNetworking & ProtocolsTransport CachingCriticalFoundational8 minHTTP/1.1 SemanticsCache-Control & Validators (ETag); CDN Caching Model; Vary & Cache Keys2Planned
Cache-Control & Validators (ETag)cache-control-and-validators-etag.mdNetworking & ProtocolsTransport CachingCriticalFoundational11 minThe HTTP Cache; HTTP/1.1 SemanticsThe HTTP Cache; CDN Caching Model; Vary & Cache Keys2Planned
CDN Caching Modelcdn-caching-model.mdNetworking & ProtocolsTransport CachingCriticalFoundational8 minThe HTTP Cache; HTTP/1.1 SemanticsThe HTTP Cache; Cache-Control & Validators (ETag); Vary & Cache Keys2Planned
Vary & Cache Keysvary-and-cache-keys.mdNetworking & ProtocolsTransport CachingCriticalFoundational8 minThe HTTP Cache; HTTP/1.1 SemanticsThe HTTP Cache; Cache-Control & Validators (ETag); CDN Caching Model2Planned
Connection Lifecycle (DNS, TLS)connection-lifecycle-dns-tls.mdNetworking & ProtocolsConnection & LatencyCriticalFoundational11 minThe HTTP CacheLatency, Bandwidth & RTT; Preconnect & Priority Hints2Planned
Latency, Bandwidth & RTTlatency-bandwidth-and-rtt.mdNetworking & ProtocolsConnection & LatencyCriticalFoundational8 minConnection Lifecycle (DNS, TLS); The HTTP CacheConnection Lifecycle (DNS, TLS); Preconnect & Priority Hints2Planned
Preconnect & Priority Hintspreconnect-and-priority-hints.mdNetworking & ProtocolsConnection & LatencyCriticalFoundational11 minConnection Lifecycle (DNS, TLS); The HTTP CacheConnection Lifecycle (DNS, TLS); Latency, Bandwidth & RTT2Planned
WebSocketwebsocket.mdNetworking & ProtocolsReal-Time ProtocolsCriticalFoundational8 minConnection Lifecycle (DNS, TLS)Server-Sent Events; WebRTC & Data Channels; Long Polling & Fallbacks2Planned
Server-Sent Eventsserver-sent-events.mdNetworking & ProtocolsReal-Time ProtocolsCriticalFoundational8 minWebSocket; Connection Lifecycle (DNS, TLS)WebSocket; WebRTC & Data Channels; Long Polling & Fallbacks2Planned
WebRTC & Data Channelswebrtc-and-data-channels.mdNetworking & ProtocolsReal-Time ProtocolsCriticalFoundational8 minWebSocket; Connection Lifecycle (DNS, TLS)WebSocket; Server-Sent Events; Long Polling & Fallbacks2Planned
Long Polling & Fallbackslong-polling-and-fallbacks.mdNetworking & ProtocolsReal-Time ProtocolsCriticalFoundational8 minWebSocket; Connection Lifecycle (DNS, TLS)WebSocket; Server-Sent Events; WebRTC & Data Channels2Planned
JSON & Streaming JSONjson-and-streaming-json.mdNetworking & ProtocolsData FormatsCriticalFoundational8 minWebSocketBinary Formats (Protobuf, MessagePack); Multipart & Form Encoding; Transport Compression (gzip, brotli)2Planned
Binary Formats (Protobuf, MessagePack)binary-formats-protobuf-messagepack.mdNetworking & ProtocolsData FormatsCriticalFoundational11 minJSON & Streaming JSON; WebSocketJSON & Streaming JSON; Multipart & Form Encoding; Transport Compression (gzip, brotli)2Planned
Multipart & Form Encodingmultipart-and-form-encoding.mdNetworking & ProtocolsData FormatsCriticalFoundational8 minJSON & Streaming JSON; WebSocketJSON & Streaming JSON; Binary Formats (Protobuf, MessagePack); Transport Compression (gzip, brotli)2Planned
Transport Compression (gzip, brotli)transport-compression-gzip-brotli.mdNetworking & ProtocolsData FormatsCriticalFoundational11 minJSON & Streaming JSON; WebSocketJSON & Streaming JSON; Binary Formats (Protobuf, MessagePack); Multipart & Form Encoding2Planned

Runtime & Execution (18 articles · ~243 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Parsing & Bytecodeparsing-and-bytecode.mdRuntime & ExecutionEngine InternalsCriticalIntermediate12 minProcess & Thread Architecture · The Web PlatformJIT Compilation & Deoptimization; Hidden Classes & Shapes; Inline Caches3Published
JIT Compilation & Deoptimizationjit-compilation-and-deoptimization.mdRuntime & ExecutionEngine InternalsCriticalIntermediate15 minParsing & BytecodeParsing & Bytecode; Hidden Classes & Shapes; Inline Caches3Planned
Hidden Classes & Shapeshidden-classes-and-shapes.mdRuntime & ExecutionEngine InternalsCriticalIntermediate12 minParsing & BytecodeParsing & Bytecode; JIT Compilation & Deoptimization; Inline Caches3Planned
Inline Cachesinline-caches.mdRuntime & ExecutionEngine InternalsCriticalIntermediate12 minParsing & BytecodeParsing & Bytecode; JIT Compilation & Deoptimization; Hidden Classes & Shapes3Planned
The Call Stackthe-call-stack.mdRuntime & ExecutionExecution ContextCriticalIntermediate12 minParsing & BytecodeAsync Stack Frames & Continuations; Stack Traces & Debug Symbols3Planned
Async Stack Frames & Continuationsasync-stack-frames-and-continuations.mdRuntime & ExecutionExecution ContextCriticalIntermediate15 minThe Call Stack; Parsing & BytecodeThe Call Stack; Stack Traces & Debug Symbols3Planned
Stack Traces & Debug Symbolsstack-traces-and-debug-symbols.mdRuntime & ExecutionExecution ContextCriticalIntermediate15 minThe Call Stack; Parsing & BytecodeThe Call Stack; Async Stack Frames & Continuations3Planned
The Memory Model & the Heapthe-memory-model-and-the-heap.mdRuntime & ExecutionMemory ManagementCriticalIntermediate15 minThe Call StackGarbage Collection Strategies; Retained Memory & Leak Detection; Weak References & Finalizers3Planned
Garbage Collection Strategiesgarbage-collection-strategies.mdRuntime & ExecutionMemory ManagementCriticalIntermediate15 minThe Memory Model & the Heap; The Call StackThe Memory Model & the Heap; Retained Memory & Leak Detection; Weak References & Finalizers3Planned
Retained Memory & Leak Detectionretained-memory-and-leak-detection.mdRuntime & ExecutionMemory ManagementCriticalIntermediate15 minThe Memory Model & the Heap; The Call StackThe Memory Model & the Heap; Garbage Collection Strategies; Weak References & Finalizers3Planned
Weak References & Finalizersweak-references-and-finalizers.mdRuntime & ExecutionMemory ManagementCriticalIntermediate15 minThe Memory Model & the Heap; The Call StackThe Memory Model & the Heap; Garbage Collection Strategies; Retained Memory & Leak Detection3Planned
Web Workersweb-workers.mdRuntime & ExecutionMultithreadingCriticalIntermediate12 minThe Memory Model & the HeapShared Workers & Message Passing; SharedArrayBuffer & Atomics; Worklets3Planned
Shared Workers & Message Passingshared-workers-and-message-passing.mdRuntime & ExecutionMultithreadingCriticalIntermediate15 minWeb Workers; The Memory Model & the HeapWeb Workers; SharedArrayBuffer & Atomics; Worklets3Planned
SharedArrayBuffer & Atomicssharedarraybuffer-and-atomics.mdRuntime & ExecutionMultithreadingCriticalIntermediate15 minWeb Workers; The Memory Model & the HeapWeb Workers; Shared Workers & Message Passing; Worklets3Planned
Workletsworklets.mdRuntime & ExecutionMultithreadingCriticalIntermediate12 minWeb Workers; The Memory Model & the HeapWeb Workers; Shared Workers & Message Passing; SharedArrayBuffer & Atomics3Planned
WebAssembly Fundamentalswebassembly-fundamentals.mdRuntime & ExecutionBeyond JavaScriptCriticalIntermediate12 minWeb WorkersJS ↔ Wasm Interop; Polyglot Runtime Targets3Planned
JS ↔ Wasm Interopjs-wasm-interop.mdRuntime & ExecutionBeyond JavaScriptCriticalIntermediate12 minWebAssembly Fundamentals; Web WorkersWebAssembly Fundamentals; Polyglot Runtime Targets3Planned
Polyglot Runtime Targetspolyglot-runtime-targets.mdRuntime & ExecutionBeyond JavaScriptCriticalIntermediate12 minWebAssembly Fundamentals; Web WorkersWebAssembly Fundamentals; JS ↔ Wasm Interop3Planned

The Web Platform (18 articles · ~156 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Process & Thread Architectureprocess-and-thread-architecture.mdThe Web PlatformBrowser InternalsCriticalFoundational11 minTrees & the DOM as a Tree · Computer Science for FrontendSandboxing & Site Isolation; The Main Thread2Published
Sandboxing & Site Isolationsandboxing-and-site-isolation.mdThe Web PlatformBrowser InternalsCriticalFoundational11 minProcess & Thread ArchitectureProcess & Thread Architecture; The Main Thread2Published
The Main Threadthe-main-thread.mdThe Web PlatformBrowser InternalsCriticalFoundational8 minProcess & Thread ArchitectureProcess & Thread Architecture; Sandboxing & Site Isolation2Planned
HTML Parsing & DOM Constructionhtml-parsing-and-dom-construction.mdThe Web PlatformThe Rendering PipelineCriticalFoundational11 minProcess & Thread ArchitectureStyle Calculation; Layout & Reflow; Paint & Layerization; Compositing2Planned
Style Calculationstyle-calculation.mdThe Web PlatformThe Rendering PipelineCriticalFoundational8 minHTML Parsing & DOM Construction; Process & Thread ArchitectureHTML Parsing & DOM Construction; Layout & Reflow; Paint & Layerization; Compositing2Planned
Layout & Reflowlayout-and-reflow.mdThe Web PlatformThe Rendering PipelineCriticalFoundational8 minHTML Parsing & DOM Construction; Process & Thread ArchitectureHTML Parsing & DOM Construction; Style Calculation; Paint & Layerization; Compositing2Planned
Paint & Layerizationpaint-and-layerization.mdThe Web PlatformThe Rendering PipelineCriticalFoundational8 minHTML Parsing & DOM Construction; Process & Thread ArchitectureHTML Parsing & DOM Construction; Style Calculation; Layout & Reflow; Compositing2Planned
Compositingcompositing.mdThe Web PlatformThe Rendering PipelineCriticalFoundational8 minHTML Parsing & DOM Construction; Process & Thread ArchitectureHTML Parsing & DOM Construction; Style Calculation; Layout & Reflow; Paint & Layerization2Planned
The DOM as an Abstractionthe-dom-as-an-abstraction.mdThe Web PlatformObject ModelsCriticalFoundational8 minHTML Parsing & DOM ConstructionThe CSSOM; The Render Tree2Planned
The CSSOMthe-cssom.mdThe Web PlatformObject ModelsCriticalFoundational8 minThe DOM as an Abstraction; HTML Parsing & DOM ConstructionThe DOM as an Abstraction; The Render Tree2Planned
The Render Treethe-render-tree.mdThe Web PlatformObject ModelsCriticalFoundational8 minThe DOM as an Abstraction; HTML Parsing & DOM ConstructionThe DOM as an Abstraction; The CSSOM2Planned
Tasks & the Callback Queuetasks-and-the-callback-queue.mdThe Web PlatformThe Event LoopCriticalFoundational8 minThe DOM as an AbstractionMicrotasks & the Job Queue; Rendering & rAF Timing; Long Tasks & Starvation2Planned
Microtasks & the Job Queuemicrotasks-and-the-job-queue.mdThe Web PlatformThe Event LoopCriticalFoundational8 minTasks & the Callback Queue; The DOM as an AbstractionTasks & the Callback Queue; Rendering & rAF Timing; Long Tasks & Starvation2Planned
Rendering & rAF Timingrendering-and-raf-timing.mdThe Web PlatformThe Event LoopCriticalFoundational8 minTasks & the Callback Queue; The DOM as an AbstractionTasks & the Callback Queue; Microtasks & the Job Queue; Long Tasks & Starvation2Planned
Long Tasks & Starvationlong-tasks-and-starvation.mdThe Web PlatformThe Event LoopCriticalFoundational8 minTasks & the Callback Queue; The DOM as an AbstractionTasks & the Callback Queue; Microtasks & the Job Queue; Rendering & rAF Timing2Planned
Origins & Sitesorigins-and-sites.mdThe Web PlatformThe Origin ModelCriticalFoundational8 minTasks & the Callback QueueURL Anatomy; Document Lifecycle & bfcache2Planned
URL Anatomyurl-anatomy.mdThe Web PlatformThe Origin ModelCriticalFoundational8 minOrigins & Sites; Tasks & the Callback QueueOrigins & Sites; Document Lifecycle & bfcache2Planned
Document Lifecycle & bfcachedocument-lifecycle-and-bfcache.mdThe Web PlatformThe Origin ModelCriticalFoundational11 minOrigins & Sites; Tasks & the Callback QueueOrigins & Sites; URL Anatomy2Planned

01 · Core Languages · Priority: Critical · 101 articles

CSS & Visual Systems (29 articles · ~250 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Specificityspecificity.mdCSS & Visual SystemsThe CascadeCriticalFoundational8 minProcess & Thread Architecture · The Web PlatformInheritance & Initial Values; Cascade Layers (@layer); Custom Properties2Published
Inheritance & Initial Valuesinheritance-and-initial-values.mdCSS & Visual SystemsThe CascadeCriticalFoundational11 minSpecificitySpecificity; Cascade Layers (@layer); Custom Properties2Published
Cascade Layers (@layer)cascade-layers-layer.mdCSS & Visual SystemsThe CascadeCriticalFoundational8 minSpecificitySpecificity; Inheritance & Initial Values; Custom Properties2Published
Custom Propertiescustom-properties.mdCSS & Visual SystemsThe CascadeCriticalFoundational8 minSpecificitySpecificity; Inheritance & Initial Values; Cascade Layers (@layer)2Published
The Box Modelthe-box-model.mdCSS & Visual SystemsBox & FormattingCriticalFoundational8 minSpecificityFormatting Contexts; Stacking Contexts & z-index; Containment & content-visibility2Published
Formatting Contextsformatting-contexts.mdCSS & Visual SystemsBox & FormattingCriticalFoundational8 minThe Box Model; SpecificityThe Box Model; Stacking Contexts & z-index; Containment & content-visibility2Planned
Stacking Contexts & z-indexstacking-contexts-and-z-index.mdCSS & Visual SystemsBox & FormattingCriticalFoundational11 minThe Box Model; SpecificityThe Box Model; Formatting Contexts; Containment & content-visibility2Planned
Containment & content-visibilitycontainment-and-content-visibility.mdCSS & Visual SystemsBox & FormattingCriticalFoundational11 minThe Box Model; SpecificityThe Box Model; Formatting Contexts; Stacking Contexts & z-index2Planned
Normal Flownormal-flow.mdCSS & Visual SystemsLayout SystemsCriticalFoundational8 minThe Box ModelFlexbox; Grid & Subgrid; Positioning & Sticky; Intrinsic Sizing2Planned
Flexboxflexbox.mdCSS & Visual SystemsLayout SystemsCriticalFoundational8 minNormal Flow; The Box ModelNormal Flow; Grid & Subgrid; Positioning & Sticky; Intrinsic Sizing2Planned
Grid & Subgridgrid-and-subgrid.mdCSS & Visual SystemsLayout SystemsCriticalFoundational8 minNormal Flow; The Box ModelNormal Flow; Flexbox; Positioning & Sticky; Intrinsic Sizing2Planned
Positioning & Stickypositioning-and-sticky.mdCSS & Visual SystemsLayout SystemsCriticalFoundational8 minNormal Flow; The Box ModelNormal Flow; Flexbox; Grid & Subgrid; Intrinsic Sizing2Planned
Intrinsic Sizingintrinsic-sizing.mdCSS & Visual SystemsLayout SystemsCriticalFoundational8 minNormal Flow; The Box ModelNormal Flow; Flexbox; Grid & Subgrid; Positioning & Sticky2Planned
Media Queriesmedia-queries.mdCSS & Visual SystemsResponsive DesignCriticalFoundational8 minNormal FlowContainer Queries; Fluid Type & Space; Viewport & Responsive Units2Planned
Container Queriescontainer-queries.mdCSS & Visual SystemsResponsive DesignCriticalFoundational8 minMedia Queries; Normal FlowMedia Queries; Fluid Type & Space; Viewport & Responsive Units2Planned
Fluid Type & Spacefluid-type-and-space.mdCSS & Visual SystemsResponsive DesignCriticalFoundational8 minMedia Queries; Normal FlowMedia Queries; Container Queries; Viewport & Responsive Units2Planned
Viewport & Responsive Unitsviewport-and-responsive-units.mdCSS & Visual SystemsResponsive DesignCriticalFoundational11 minMedia Queries; Normal FlowMedia Queries; Container Queries; Fluid Type & Space2Planned
Font Loading & FOUT/FOITfont-loading-and-fout-foit.mdCSS & Visual SystemsTypographyCriticalFoundational8 minMedia QueriesType Scale & Rhythm; Text Overflow & Truncation2Planned
Type Scale & Rhythmtype-scale-and-rhythm.mdCSS & Visual SystemsTypographyCriticalFoundational8 minFont Loading & FOUT/FOIT; Media QueriesFont Loading & FOUT/FOIT; Text Overflow & Truncation2Planned
Text Overflow & Truncationtext-overflow-and-truncation.mdCSS & Visual SystemsTypographyCriticalFoundational8 minFont Loading & FOUT/FOIT; Media QueriesFont Loading & FOUT/FOIT; Type Scale & Rhythm2Planned
Color Spaces & Gamutcolor-spaces-and-gamut.mdCSS & Visual SystemsColorCriticalFoundational8 minFont Loading & FOUT/FOITColor Functions & Mixing; Perceptual Contrast & Readability2Planned
Color Functions & Mixingcolor-functions-and-mixing.mdCSS & Visual SystemsColorCriticalFoundational8 minColor Spaces & Gamut; Font Loading & FOUT/FOITColor Spaces & Gamut; Perceptual Contrast & Readability2Planned
Perceptual Contrast & Readabilityperceptual-contrast-and-readability.mdCSS & Visual SystemsColorCriticalFoundational11 minColor Spaces & Gamut; Font Loading & FOUT/FOITColor Spaces & Gamut; Color Functions & Mixing2Planned
Naming Methodologiesnaming-methodologies.mdCSS & Visual SystemsStyling ArchitectureCriticalFoundational8 minColor Spaces & GamutScoping & Isolation; Utility-First Styling; CSS-in-JS Models; Zero-Runtime / Compiled CSS2Planned
Scoping & Isolationscoping-and-isolation.mdCSS & Visual SystemsStyling ArchitectureCriticalFoundational8 minNaming Methodologies; Color Spaces & GamutNaming Methodologies; Utility-First Styling; CSS-in-JS Models; Zero-Runtime / Compiled CSS2Planned
Utility-First Stylingutility-first-styling.mdCSS & Visual SystemsStyling ArchitectureCriticalFoundational8 minNaming Methodologies; Color Spaces & GamutNaming Methodologies; Scoping & Isolation; CSS-in-JS Models; Zero-Runtime / Compiled CSS2Planned
CSS-in-JS Modelscss-in-js-models.mdCSS & Visual SystemsStyling ArchitectureCriticalFoundational8 minNaming Methodologies; Color Spaces & GamutNaming Methodologies; Scoping & Isolation; Utility-First Styling; Zero-Runtime / Compiled CSS2Planned
Zero-Runtime / Compiled CSSzero-runtime-compiled-css.mdCSS & Visual SystemsStyling ArchitectureCriticalFoundational11 minNaming Methodologies; Color Spaces & GamutNaming Methodologies; Scoping & Isolation; Utility-First Styling; CSS-in-JS Models2Planned
Consuming Design Tokensconsuming-design-tokens.mdCSS & Visual SystemsStyling ArchitectureCriticalFoundational8 minNaming Methodologies; Color Spaces & GamutNaming Methodologies; Scoping & Isolation; Utility-First Styling; CSS-in-JS Models2Planned

HTML & Document Semantics (16 articles · ~128 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
The Document Outlinethe-document-outline.mdHTML & Document SemanticsDocument StructureCriticalFoundational8 minProcess & Thread Architecture · The Web PlatformSectioning & Landmarks; Headings Hierarchy; Tables & Data Semantics2Published
Sectioning & Landmarkssectioning-and-landmarks.mdHTML & Document SemanticsDocument StructureCriticalFoundational8 minThe Document OutlineThe Document Outline; Headings Hierarchy; Tables & Data Semantics2Published
Headings Hierarchyheadings-hierarchy.mdHTML & Document SemanticsDocument StructureCriticalFoundational8 minThe Document OutlineThe Document Outline; Sectioning & Landmarks; Tables & Data Semantics2Published
Tables & Data Semanticstables-and-data-semantics.mdHTML & Document SemanticsDocument StructureCriticalFoundational8 minThe Document OutlineThe Document Outline; Sectioning & Landmarks; Headings Hierarchy2Planned
Native Form Controlsnative-form-controls.mdHTML & Document SemanticsInteractive ElementsCriticalFoundational8 minThe Document OutlineButtons, Links & Actions; Dialog, Details & Popover; The Contenteditable Model2Planned
Buttons, Links & Actionsbuttons-links-and-actions.mdHTML & Document SemanticsInteractive ElementsCriticalFoundational8 minNative Form Controls; The Document OutlineNative Form Controls; Dialog, Details & Popover; The Contenteditable Model2Planned
Dialog, Details & Popoverdialog-details-and-popover.mdHTML & Document SemanticsInteractive ElementsCriticalFoundational8 minNative Form Controls; The Document OutlineNative Form Controls; Buttons, Links & Actions; The Contenteditable Model2Planned
The Contenteditable Modelthe-contenteditable-model.mdHTML & Document SemanticsInteractive ElementsCriticalFoundational8 minNative Form Controls; The Document OutlineNative Form Controls; Buttons, Links & Actions; Dialog, Details & Popover2Planned
Responsive Images (srcset)responsive-images-srcset.mdHTML & Document SemanticsEmbedded ContentCriticalFoundational8 minNative Form ControlsAudio & Video; Iframes & Embedding; Inline SVG2Planned
Audio & Videoaudio-and-video.mdHTML & Document SemanticsEmbedded ContentCriticalFoundational8 minResponsive Images (srcset); Native Form ControlsResponsive Images (srcset); Iframes & Embedding; Inline SVG2Planned
Iframes & Embeddingiframes-and-embedding.mdHTML & Document SemanticsEmbedded ContentCriticalFoundational8 minResponsive Images (srcset); Native Form ControlsResponsive Images (srcset); Audio & Video; Inline SVG2Planned
Inline SVGinline-svg.mdHTML & Document SemanticsEmbedded ContentCriticalFoundational8 minResponsive Images (srcset); Native Form ControlsResponsive Images (srcset); Audio & Video; Iframes & Embedding2Planned
Head Metadatahead-metadata.mdHTML & Document SemanticsMetadata & DiscoveryCriticalFoundational8 minResponsive Images (srcset)SEO Semantics; Open Graph & Social Cards; Structured Data (JSON-LD)2Planned
SEO Semanticsseo-semantics.mdHTML & Document SemanticsMetadata & DiscoveryCriticalFoundational8 minHead Metadata; Responsive Images (srcset)Head Metadata; Open Graph & Social Cards; Structured Data (JSON-LD)2Planned
Open Graph & Social Cardsopen-graph-and-social-cards.mdHTML & Document SemanticsMetadata & DiscoveryCriticalFoundational8 minHead Metadata; Responsive Images (srcset)Head Metadata; SEO Semantics; Structured Data (JSON-LD)2Planned
Structured Data (JSON-LD)structured-data-json-ld.mdHTML & Document SemanticsMetadata & DiscoveryCriticalFoundational8 minHead Metadata; Responsive Images (srcset)Head Metadata; SEO Semantics; Open Graph & Social Cards2Planned

JavaScript (31 articles · ~275 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Primitives & Wrappersprimitives-and-wrappers.mdJavaScriptRuntime TypesCriticalFoundational8 minTrees & the DOM as a Tree · Computer Science for Frontend; Parsing & Bytecode · Runtime & ExecutionCoercion & Conversion; Equality & Comparison; null, undefined & Nullish2Published
Coercion & Conversioncoercion-and-conversion.mdJavaScriptRuntime TypesCriticalFoundational8 minPrimitives & WrappersPrimitives & Wrappers; Equality & Comparison; null, undefined & Nullish2Published
Equality & Comparisonequality-and-comparison.mdJavaScriptRuntime TypesCriticalFoundational8 minPrimitives & WrappersPrimitives & Wrappers; Coercion & Conversion; null, undefined & Nullish2Planned
null, undefined & Nullishnull-undefined-and-nullish.mdJavaScriptRuntime TypesCriticalFoundational8 minPrimitives & WrappersPrimitives & Wrappers; Coercion & Conversion; Equality & Comparison2Planned
Lexical Scopelexical-scope.mdJavaScriptScope & ClosuresCriticalFoundational8 minPrimitives & WrappersClosures; Hoisting & TDZ; Block vs Function Scope2Published
Closuresclosures.mdJavaScriptScope & ClosuresCriticalFoundational8 minLexical Scope; Primitives & WrappersLexical Scope; Hoisting & TDZ; Block vs Function Scope2Published
Hoisting & TDZhoisting-and-tdz.mdJavaScriptScope & ClosuresCriticalFoundational8 minLexical Scope; Primitives & WrappersLexical Scope; Closures; Block vs Function Scope2Published
Block vs Function Scopeblock-vs-function-scope.mdJavaScriptScope & ClosuresCriticalFoundational8 minLexical Scope; Primitives & WrappersLexical Scope; Closures; Hoisting & TDZ2Published
Property Descriptorsproperty-descriptors.mdJavaScriptObjects & PrototypesCriticalFoundational8 minLexical ScopeThe Prototype Chain; Inheritance Patterns; Proxies & Reflect2Planned
The Prototype Chainthe-prototype-chain.mdJavaScriptObjects & PrototypesCriticalFoundational8 minProperty Descriptors; Lexical ScopeProperty Descriptors; Inheritance Patterns; Proxies & Reflect2Planned
Inheritance Patternsinheritance-patterns.mdJavaScriptObjects & PrototypesCriticalFoundational8 minProperty Descriptors; Lexical ScopeProperty Descriptors; The Prototype Chain; Proxies & Reflect2Planned
Proxies & Reflectproxies-and-reflect.mdJavaScriptObjects & PrototypesCriticalFoundational8 minProperty Descriptors; Lexical ScopeProperty Descriptors; The Prototype Chain; Inheritance Patterns2Planned
Binding Rulesbinding-rules.mdJavaScriptThe this ModelCriticalFoundational8 minProperty Descriptorscall / apply / bind; Arrow Functions & Lexical this2Planned
call / apply / bindcall-apply-bind.mdJavaScriptThe this ModelCriticalFoundational8 minBinding Rules; Property DescriptorsBinding Rules; Arrow Functions & Lexical this2Planned
Arrow Functions & Lexical thisarrow-functions-and-lexical-this.mdJavaScriptThe this ModelCriticalFoundational11 minBinding Rules; Property DescriptorsBinding Rules; call / apply / bind2Planned
Higher-Order Functionshigher-order-functions.mdJavaScriptFunctionsCriticalFoundational8 minBinding RulesCurrying & Partial Application; Composition2Planned
Currying & Partial Applicationcurrying-and-partial-application.mdJavaScriptFunctionsCriticalFoundational11 minHigher-Order Functions; Binding RulesHigher-Order Functions; Composition2Planned
Compositioncomposition.mdJavaScriptFunctionsCriticalFoundational8 minHigher-Order Functions; Binding RulesHigher-Order Functions; Currying & Partial Application2Planned
Iterators & Iterablesiterators-and-iterables.mdJavaScriptIteration ProtocolsCriticalFoundational8 minHigher-Order FunctionsGenerators; Async Iterators2Planned
Generatorsgenerators.mdJavaScriptIteration ProtocolsCriticalFoundational8 minIterators & Iterables; Higher-Order FunctionsIterators & Iterables; Async Iterators2Planned
Async Iteratorsasync-iterators.mdJavaScriptIteration ProtocolsCriticalFoundational8 minIterators & Iterables; Higher-Order FunctionsIterators & Iterables; Generators2Planned
The Callback Modelthe-callback-model.mdJavaScriptAsynchronyCriticalFoundational8 minIterators & IterablesPromises; async / await; Cancellation & AbortController2Planned
Promisespromises.mdJavaScriptAsynchronyCriticalFoundational8 minThe Callback Model; Iterators & IterablesThe Callback Model; async / await; Cancellation & AbortController2Planned
async / awaitasync-await.mdJavaScriptAsynchronyCriticalFoundational8 minThe Callback Model; Iterators & IterablesThe Callback Model; Promises; Cancellation & AbortController2Planned
Cancellation & AbortControllercancellation-and-abortcontroller.mdJavaScriptAsynchronyCriticalFoundational11 minThe Callback Model; Iterators & IterablesThe Callback Model; Promises; async / await2Planned
ES Moduleses-modules.mdJavaScriptModulesCriticalFoundational8 minThe Callback ModelDynamic Import; Module Resolution Semantics2Planned
Dynamic Importdynamic-import.mdJavaScriptModulesCriticalFoundational8 minES Modules; The Callback ModelES Modules; Module Resolution Semantics2Planned
Module Resolution Semanticsmodule-resolution-semantics.mdJavaScriptModulesCriticalFoundational11 minES Modules; The Callback ModelES Modules; Dynamic Import2Planned
Symbols & Well-Known Symbolssymbols-and-well-known-symbols.mdJavaScriptMetaprogrammingCriticalIntermediate15 minES ModulesReflection; Tagged Templates3Planned
Reflectionreflection.mdJavaScriptMetaprogrammingCriticalIntermediate12 minSymbols & Well-Known Symbols; ES ModulesSymbols & Well-Known Symbols; Tagged Templates3Planned
Tagged Templatestagged-templates.mdJavaScriptMetaprogrammingCriticalIntermediate12 minSymbols & Well-Known Symbols; ES ModulesSymbols & Well-Known Symbols; Reflection3Planned

TypeScript (25 articles · ~234 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Structural Typingstructural-typing.mdTypeScriptType FoundationsCriticalFoundational8 minPrimitives & Wrappers · JavaScriptAssignability; unknown, never & any; Literal & Unit Types2Published
Assignabilityassignability.mdTypeScriptType FoundationsCriticalFoundational8 minStructural TypingStructural Typing; unknown, never & any; Literal & Unit Types2Published
unknown, never & anyunknown-never-and-any.mdTypeScriptType FoundationsCriticalFoundational8 minStructural TypingStructural Typing; Assignability; Literal & Unit Types2Published
Literal & Unit Typesliteral-and-unit-types.mdTypeScriptType FoundationsCriticalFoundational8 minStructural TypingStructural Typing; Assignability; unknown, never & any2Published
Unions & Intersectionsunions-and-intersections.mdTypeScriptCompositionCriticalFoundational8 minStructural TypingGenerics; Generic Constraints; Indexed Access & keyof2Published
Genericsgenerics.mdTypeScriptCompositionCriticalFoundational8 minUnions & Intersections; Structural TypingUnions & Intersections; Generic Constraints; Indexed Access & keyof2Published
Generic Constraintsgeneric-constraints.mdTypeScriptCompositionCriticalFoundational8 minUnions & Intersections; Structural TypingUnions & Intersections; Generics; Indexed Access & keyof2Planned
Indexed Access & keyofindexed-access-and-keyof.mdTypeScriptCompositionCriticalFoundational8 minUnions & Intersections; Structural TypingUnions & Intersections; Generics; Generic Constraints2Planned
Conditional Typesconditional-types.mdTypeScriptType TransformationCriticalIntermediate12 minUnions & IntersectionsMapped Types; Template Literal Types; infer & Type Extraction3Planned
Mapped Typesmapped-types.mdTypeScriptType TransformationCriticalIntermediate12 minConditional Types; Unions & IntersectionsConditional Types; Template Literal Types; infer & Type Extraction3Planned
Template Literal Typestemplate-literal-types.mdTypeScriptType TransformationCriticalIntermediate12 minConditional Types; Unions & IntersectionsConditional Types; Mapped Types; infer & Type Extraction3Planned
infer & Type Extractioninfer-and-type-extraction.mdTypeScriptType TransformationCriticalIntermediate12 minConditional Types; Unions & IntersectionsConditional Types; Mapped Types; Template Literal Types3Planned
Type Inferencetype-inference.mdTypeScriptInference & FlowCriticalFoundational8 minConditional TypesControl-Flow Narrowing; Type Guards & Predicates; Discriminated Unions2Planned
Control-Flow Narrowingcontrol-flow-narrowing.mdTypeScriptInference & FlowCriticalFoundational8 minType Inference; Conditional TypesType Inference; Type Guards & Predicates; Discriminated Unions2Planned
Type Guards & Predicatestype-guards-and-predicates.mdTypeScriptInference & FlowCriticalFoundational8 minType Inference; Conditional TypesType Inference; Control-Flow Narrowing; Discriminated Unions2Planned
Discriminated Unionsdiscriminated-unions.mdTypeScriptInference & FlowCriticalFoundational8 minType Inference; Conditional TypesType Inference; Control-Flow Narrowing; Type Guards & Predicates2Planned
Variancevariance.mdTypeScriptSoundness & SafetyCriticalIntermediate12 minType InferenceUnsoundness & Escape Hatches; Strictness Flags3Planned
Unsoundness & Escape Hatchesunsoundness-and-escape-hatches.mdTypeScriptSoundness & SafetyCriticalIntermediate15 minVariance; Type InferenceVariance; Strictness Flags3Planned
Strictness Flagsstrictness-flags.mdTypeScriptSoundness & SafetyCriticalIntermediate12 minVariance; Type InferenceVariance; Unsoundness & Escape Hatches3Planned
Declaration Filesdeclaration-files.mdTypeScriptAmbient & InteropCriticalFoundational8 minVarianceModule Augmentation; Typing Third-Party Code2Planned
Module Augmentationmodule-augmentation.mdTypeScriptAmbient & InteropCriticalFoundational8 minDeclaration Files; VarianceDeclaration Files; Typing Third-Party Code2Planned
Typing Third-Party Codetyping-third-party-code.mdTypeScriptAmbient & InteropCriticalFoundational8 minDeclaration Files; VarianceDeclaration Files; Module Augmentation2Planned
Branded & Nominal Typesbranded-and-nominal-types.mdTypeScriptDomain ModelingCriticalFoundational8 minDeclaration FilesExhaustiveness; Illegal States Unrepresentable2Planned
Exhaustivenessexhaustiveness.mdTypeScriptDomain ModelingCriticalFoundational8 minBranded & Nominal Types; Declaration FilesBranded & Nominal Types; Illegal States Unrepresentable2Planned
Illegal States Unrepresentableillegal-states-unrepresentable.mdTypeScriptDomain ModelingCriticalFoundational11 minBranded & Nominal Types; Declaration FilesBranded & Nominal Types; Exhaustiveness2Planned

02 · Rendering & Frameworks · Priority: Critical · 76 articles

React (33 articles · ~436 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Elements vs Componentselements-vs-components.mdReactThe Component ModelCriticalIntermediate12 minPrimitives & Wrappers · JavaScript; The CSR Model · Rendering Architectures; The Document Outline · HTML & Document SemanticsJSX Semantics; Composition & Children3Published
JSX Semanticsjsx-semantics.mdReactThe Component ModelCriticalIntermediate12 minElements vs ComponentsElements vs Components; Composition & Children3Published
Composition & Childrencomposition-and-children.mdReactThe Component ModelCriticalIntermediate12 minElements vs ComponentsElements vs Components; JSX Semantics3Published
The Render Phasethe-render-phase.mdReactRendering & ReconciliationCriticalIntermediate12 minElements vs ComponentsReconciliation & Diffing; Keys & List Reconciliation; The Commit Phase3Published
Reconciliation & Diffingreconciliation-and-diffing.mdReactRendering & ReconciliationCriticalIntermediate12 minThe Render Phase; Elements vs ComponentsThe Render Phase; Keys & List Reconciliation; The Commit Phase3Published
Keys & List Reconciliationkeys-and-list-reconciliation.mdReactRendering & ReconciliationCriticalIntermediate12 minThe Render Phase; Elements vs ComponentsThe Render Phase; Reconciliation & Diffing; The Commit Phase3Published
The Commit Phasethe-commit-phase.mdReactRendering & ReconciliationCriticalIntermediate12 minThe Render Phase; Elements vs ComponentsThe Render Phase; Reconciliation & Diffing; Keys & List Reconciliation3Published
useStateusestate.mdReactState & HooksCriticalIntermediate12 minThe Render PhaseuseReducer; The Rules of Hooks; State Batching & Updates3Published
useReducerusereducer.mdReactState & HooksCriticalIntermediate12 minuseState; The Render PhaseuseState; The Rules of Hooks; State Batching & Updates3Planned
The Rules of Hooksthe-rules-of-hooks.mdReactState & HooksCriticalIntermediate12 minuseState; The Render PhaseuseState; useReducer; State Batching & Updates3Planned
State Batching & Updatesstate-batching-and-updates.mdReactState & HooksCriticalIntermediate12 minuseState; The Render PhaseuseState; useReducer; The Rules of Hooks3Planned
useEffect & Synchronizationuseeffect-and-synchronization.mdReactEffects & LifecycleCriticalIntermediate15 minuseStateuseLayoutEffect; Effect Cleanup & Dependencies; Refs & useRef; Error Boundaries3Planned
useLayoutEffectuselayouteffect.mdReactEffects & LifecycleCriticalIntermediate12 minuseEffect & Synchronization; useStateuseEffect & Synchronization; Effect Cleanup & Dependencies; Refs & useRef; Error Boundaries3Planned
Effect Cleanup & Dependencieseffect-cleanup-and-dependencies.mdReactEffects & LifecycleCriticalIntermediate15 minuseEffect & Synchronization; useStateuseEffect & Synchronization; useLayoutEffect; Refs & useRef; Error Boundaries3Planned
Refs & useRefrefs-and-useref.mdReactEffects & LifecycleCriticalIntermediate12 minuseEffect & Synchronization; useStateuseEffect & Synchronization; useLayoutEffect; Effect Cleanup & Dependencies; Error Boundaries3Planned
Error Boundarieserror-boundaries.mdReactEffects & LifecycleCriticalIntermediate12 minuseEffect & Synchronization; useStateuseEffect & Synchronization; useLayoutEffect; Effect Cleanup & Dependencies; Refs & useRef3Planned
Context & Providerscontext-and-providers.mdReactContext & DataCriticalIntermediate12 minuseEffect & SynchronizationContext Performance; useContext Patterns3Planned
Context Performancecontext-performance.mdReactContext & DataCriticalIntermediate12 minContext & Providers; useEffect & SynchronizationContext & Providers; useContext Patterns3Planned
useContext Patternsusecontext-patterns.mdReactContext & DataCriticalIntermediate12 minContext & Providers; useEffect & SynchronizationContext & Providers; Context Performance3Planned
Concurrent Renderingconcurrent-rendering.mdReactConcurrencyCriticalAdvanced16 minContext & ProvidersTransitions & useTransition; useDeferredValue; Suspense4Planned
Transitions & useTransitiontransitions-and-usetransition.mdReactConcurrencyCriticalAdvanced19 minConcurrent Rendering; Context & ProvidersConcurrent Rendering; useDeferredValue; Suspense4Planned
useDeferredValueusedeferredvalue.mdReactConcurrencyCriticalAdvanced16 minConcurrent Rendering; Context & ProvidersConcurrent Rendering; Transitions & useTransition; Suspense4Planned
Suspensesuspense.mdReactConcurrencyCriticalAdvanced16 minConcurrent Rendering; Context & ProvidersConcurrent Rendering; Transitions & useTransition; useDeferredValue4Planned
Server Componentsserver-components.mdReactServer ReactCriticalAdvanced16 minConcurrent RenderingServer Actions; The RSC Payload & Boundaries4Planned
Server Actionsserver-actions.mdReactServer ReactCriticalAdvanced16 minServer Components; Concurrent RenderingServer Components; The RSC Payload & Boundaries4Planned
The RSC Payload & Boundariesthe-rsc-payload-and-boundaries.mdReactServer ReactCriticalAdvanced19 minServer Components; Concurrent RenderingServer Components; Server Actions4Planned
memo, useMemo, useCallbackmemo-usememo-usecallback.mdReactOptimizationCriticalIntermediate12 minServer ComponentsReferential Stability; The React Compiler Model3Planned
Referential Stabilityreferential-stability.mdReactOptimizationCriticalIntermediate12 minmemo, useMemo, useCallback; Server Componentsmemo, useMemo, useCallback; The React Compiler Model3Planned
The React Compiler Modelthe-react-compiler-model.mdReactOptimizationCriticalIntermediate12 minmemo, useMemo, useCallback; Server Componentsmemo, useMemo, useCallback; Referential Stability3Planned
Custom Hookscustom-hooks.mdReactReact CompositionCriticalIntermediate12 minmemo, useMemo, useCallbackPortals; Higher-Order Components; Children Manipulation3Planned
Portalsportals.mdReactReact CompositionCriticalIntermediate12 minCustom Hooks; memo, useMemo, useCallbackCustom Hooks; Higher-Order Components; Children Manipulation3Planned
Higher-Order Componentshigher-order-components.mdReactReact CompositionCriticalIntermediate12 minCustom Hooks; memo, useMemo, useCallbackCustom Hooks; Portals; Children Manipulation3Planned
Children Manipulationchildren-manipulation.mdReactReact CompositionCriticalIntermediate12 minCustom Hooks; memo, useMemo, useCallbackCustom Hooks; Portals; Higher-Order Components3Planned

Reactivity & Framework Models (10 articles · ~169 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Signals & Fine-Grained Reactivitysignals-and-fine-grained-reactivity.mdReactivity & Framework ModelsReactivity ParadigmsCriticalAdvanced19 minPrimitives & Wrappers · JavaScript; The CSR Model · Rendering ArchitecturesThe Virtual DOM; Compiled Reactivity; Push-Based vs Dirty Checking4Planned
The Virtual DOMthe-virtual-dom.mdReactivity & Framework ModelsReactivity ParadigmsCriticalAdvanced16 minSignals & Fine-Grained ReactivitySignals & Fine-Grained Reactivity; Compiled Reactivity; Push-Based vs Dirty Checking4Planned
Compiled Reactivitycompiled-reactivity.mdReactivity & Framework ModelsReactivity ParadigmsCriticalAdvanced16 minSignals & Fine-Grained ReactivitySignals & Fine-Grained Reactivity; The Virtual DOM; Push-Based vs Dirty Checking4Planned
Push-Based vs Dirty Checkingpush-based-vs-dirty-checking.mdReactivity & Framework ModelsReactivity ParadigmsCriticalAdvanced19 minSignals & Fine-Grained ReactivitySignals & Fine-Grained Reactivity; The Virtual DOM; Compiled Reactivity4Planned
Observablesobservables.mdReactivity & Framework ModelsPrimitivesCriticalAdvanced16 minSignals & Fine-Grained ReactivityAtoms & Derived Values; Effects & Reactions4Planned
Atoms & Derived Valuesatoms-and-derived-values.mdReactivity & Framework ModelsPrimitivesCriticalAdvanced16 minObservables; Signals & Fine-Grained ReactivityObservables; Effects & Reactions4Planned
Effects & Reactionseffects-and-reactions.mdReactivity & Framework ModelsPrimitivesCriticalAdvanced16 minObservables; Signals & Fine-Grained ReactivityObservables; Atoms & Derived Values4Planned
Declarative vs Imperative UIdeclarative-vs-imperative-ui.mdReactivity & Framework ModelsMental ModelsCriticalAdvanced19 minObservablesData Binding Models; Framework Comparison Axes4Planned
Data Binding Modelsdata-binding-models.mdReactivity & Framework ModelsMental ModelsCriticalAdvanced16 minDeclarative vs Imperative UI; ObservablesDeclarative vs Imperative UI; Framework Comparison Axes4Planned
Framework Comparison Axesframework-comparison-axes.mdReactivity & Framework ModelsMental ModelsCriticalAdvanced16 minDeclarative vs Imperative UI; ObservablesDeclarative vs Imperative UI; Data Binding Models4Planned

Rendering Architectures (17 articles · ~225 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
The CSR Modelthe-csr-model.mdRendering ArchitecturesClient RenderingCriticalIntermediate12 minProcess & Thread Architecture · The Web Platform; HTTP/1.1 Semantics · Networking & ProtocolsThe App Shell Pattern; Client-Side Data Loading3Planned
The App Shell Patternthe-app-shell-pattern.mdRendering ArchitecturesClient RenderingCriticalIntermediate12 minThe CSR ModelThe CSR Model; Client-Side Data Loading3Planned
Client-Side Data Loadingclient-side-data-loading.mdRendering ArchitecturesClient RenderingCriticalIntermediate12 minThe CSR ModelThe CSR Model; The App Shell Pattern3Planned
The SSR Modelthe-ssr-model.mdRendering ArchitecturesServer RenderingCriticalIntermediate12 minThe CSR ModelHydration; Selective & Progressive Hydration; Hydration Mismatches3Planned
Hydrationhydration.mdRendering ArchitecturesServer RenderingCriticalIntermediate12 minThe SSR Model; The CSR ModelThe SSR Model; Selective & Progressive Hydration; Hydration Mismatches3Planned
Selective & Progressive Hydrationselective-and-progressive-hydration.mdRendering ArchitecturesServer RenderingCriticalIntermediate15 minThe SSR Model; The CSR ModelThe SSR Model; Hydration; Hydration Mismatches3Planned
Hydration Mismatcheshydration-mismatches.mdRendering ArchitecturesServer RenderingCriticalIntermediate12 minThe SSR Model; The CSR ModelThe SSR Model; Hydration; Selective & Progressive Hydration3Planned
Static Site Generationstatic-site-generation.mdRendering ArchitecturesStatic & HybridCriticalIntermediate12 minThe SSR ModelIncremental Static Regeneration; On-Demand Revalidation3Planned
Incremental Static Regenerationincremental-static-regeneration.mdRendering ArchitecturesStatic & HybridCriticalIntermediate15 minStatic Site Generation; The SSR ModelStatic Site Generation; On-Demand Revalidation3Planned
On-Demand Revalidationon-demand-revalidation.mdRendering ArchitecturesStatic & HybridCriticalIntermediate12 minStatic Site Generation; The SSR ModelStatic Site Generation; Incremental Static Regeneration3Planned
Streaming SSRstreaming-ssr.mdRendering ArchitecturesStreamingCriticalAdvanced16 minStatic Site GenerationProgressive Rendering & Flushing; Out-of-Order Streaming4Planned
Progressive Rendering & Flushingprogressive-rendering-and-flushing.mdRendering ArchitecturesStreamingCriticalAdvanced19 minStreaming SSR; Static Site GenerationStreaming SSR; Out-of-Order Streaming4Planned
Out-of-Order Streamingout-of-order-streaming.mdRendering ArchitecturesStreamingCriticalAdvanced16 minStreaming SSR; Static Site GenerationStreaming SSR; Progressive Rendering & Flushing4Planned
The Server/Client Boundarythe-server-client-boundary.mdRendering ArchitecturesBoundaries & ModelsCriticalIntermediate12 minStreaming SSRIslands Architecture; Resumability vs Hydration; Edge vs Origin Rendering3Planned
Islands Architectureislands-architecture.mdRendering ArchitecturesBoundaries & ModelsCriticalIntermediate12 minThe Server/Client Boundary; Streaming SSRThe Server/Client Boundary; Resumability vs Hydration; Edge vs Origin Rendering3Planned
Resumability vs Hydrationresumability-vs-hydration.mdRendering ArchitecturesBoundaries & ModelsCriticalIntermediate12 minThe Server/Client Boundary; Streaming SSRThe Server/Client Boundary; Islands Architecture; Edge vs Origin Rendering3Planned
Edge vs Origin Renderingedge-vs-origin-rendering.mdRendering ArchitecturesBoundaries & ModelsCriticalIntermediate12 minThe Server/Client Boundary; Streaming SSRThe Server/Client Boundary; Islands Architecture; Resumability vs Hydration3Planned

Routing (16 articles · ~204 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Client-Side Routingclient-side-routing.mdRoutingRouting ModelsCriticalIntermediate12 minThe CSR Model · Rendering Architectures; Web Storage · Browser APIsFile-Based & Server Routing; Hybrid Routing3Planned
File-Based & Server Routingfile-based-and-server-routing.mdRoutingRouting ModelsCriticalIntermediate15 minClient-Side RoutingClient-Side Routing; Hybrid Routing3Planned
Hybrid Routinghybrid-routing.mdRoutingRouting ModelsCriticalIntermediate12 minClient-Side RoutingClient-Side Routing; File-Based & Server Routing3Planned
Route Matching & Paramsroute-matching-and-params.mdRoutingRoute StructureCriticalIntermediate12 minClient-Side RoutingNested Routes & Layouts; Parallel & Intercepting Routes; The URL as State3Planned
Nested Routes & Layoutsnested-routes-and-layouts.mdRoutingRoute StructureCriticalIntermediate12 minRoute Matching & Params; Client-Side RoutingRoute Matching & Params; Parallel & Intercepting Routes; The URL as State3Planned
Parallel & Intercepting Routesparallel-and-intercepting-routes.mdRoutingRoute StructureCriticalIntermediate15 minRoute Matching & Params; Client-Side RoutingRoute Matching & Params; Nested Routes & Layouts; The URL as State3Planned
The URL as Statethe-url-as-state.mdRoutingRoute StructureCriticalIntermediate12 minRoute Matching & Params; Client-Side RoutingRoute Matching & Params; Nested Routes & Layouts; Parallel & Intercepting Routes3Planned
Route Loaders & Dependenciesroute-loaders-and-dependencies.mdRoutingRoute DataCriticalIntermediate15 minRoute Matching & ParamsDeferred & Streaming Route Data; Route Actions & Mutations3Planned
Deferred & Streaming Route Datadeferred-and-streaming-route-data.mdRoutingRoute DataCriticalIntermediate15 minRoute Loaders & Dependencies; Route Matching & ParamsRoute Loaders & Dependencies; Route Actions & Mutations3Planned
Route Actions & Mutationsroute-actions-and-mutations.mdRoutingRoute DataCriticalIntermediate12 minRoute Loaders & Dependencies; Route Matching & ParamsRoute Loaders & Dependencies; Deferred & Streaming Route Data3Planned
Navigation & Linkingnavigation-and-linking.mdRoutingNavigationCriticalIntermediate12 minRoute Loaders & DependenciesTransitions & Pending UI; Scroll Restoration; Route Prefetching3Planned
Transitions & Pending UItransitions-and-pending-ui.mdRoutingNavigationCriticalIntermediate12 minNavigation & Linking; Route Loaders & DependenciesNavigation & Linking; Scroll Restoration; Route Prefetching3Planned
Scroll Restorationscroll-restoration.mdRoutingNavigationCriticalIntermediate12 minNavigation & Linking; Route Loaders & DependenciesNavigation & Linking; Transitions & Pending UI; Route Prefetching3Planned
Route Prefetchingroute-prefetching.mdRoutingNavigationCriticalIntermediate12 minNavigation & Linking; Route Loaders & DependenciesNavigation & Linking; Transitions & Pending UI; Scroll Restoration3Planned
Route-Based Code Splittingroute-based-code-splitting.mdRoutingCode OrganizationCriticalIntermediate12 minNavigation & LinkingRoute Guards & Redirects3Planned
Route Guards & Redirectsroute-guards-and-redirects.mdRoutingCode OrganizationCriticalIntermediate12 minRoute-Based Code Splitting; Navigation & LinkingRoute-Based Code Splitting3Planned

03 · Application Architecture · Priority: Critical · 84 articles

API Design & Contracts (14 articles · ~233 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
RESTrest.mdAPI Design & ContractsParadigmsCriticalAdvanced16 minHTTP/1.1 Semantics · Networking & Protocols; Structural Typing · TypeScriptGraphQL; RPC; Realtime & Subscriptions4Planned
GraphQLgraphql.mdAPI Design & ContractsParadigmsCriticalAdvanced16 minRESTREST; RPC; Realtime & Subscriptions4Planned
RPCrpc.mdAPI Design & ContractsParadigmsCriticalAdvanced16 minRESTREST; GraphQL; Realtime & Subscriptions4Planned
Realtime & Subscriptionsrealtime-and-subscriptions.mdAPI Design & ContractsParadigmsCriticalAdvanced16 minRESTREST; GraphQL; RPC4Planned
Resource & Schema Designresource-and-schema-design.mdAPI Design & ContractsContract DesignCriticalAdvanced16 minRESTVersioning Strategies; Pagination & Filtering Conventions; Error Contract Design4Planned
Versioning Strategiesversioning-strategies.mdAPI Design & ContractsContract DesignCriticalAdvanced16 minResource & Schema Design; RESTResource & Schema Design; Pagination & Filtering Conventions; Error Contract Design4Planned
Pagination & Filtering Conventionspagination-and-filtering-conventions.mdAPI Design & ContractsContract DesignCriticalAdvanced19 minResource & Schema Design; RESTResource & Schema Design; Versioning Strategies; Error Contract Design4Planned
Error Contract Designerror-contract-design.mdAPI Design & ContractsContract DesignCriticalAdvanced16 minResource & Schema Design; RESTResource & Schema Design; Versioning Strategies; Pagination & Filtering Conventions4Planned
End-to-End Type Safety (tRPC)end-to-end-type-safety-trpc.mdAPI Design & ContractsType Safety Across the WireCriticalAdvanced19 minResource & Schema DesignCode Generation from Schemas; Contract Testing4Planned
Code Generation from Schemascode-generation-from-schemas.mdAPI Design & ContractsType Safety Across the WireCriticalAdvanced19 minEnd-to-End Type Safety (tRPC); Resource & Schema DesignEnd-to-End Type Safety (tRPC); Contract Testing4Planned
Contract Testingcontract-testing.mdAPI Design & ContractsType Safety Across the WireCriticalAdvanced16 minEnd-to-End Type Safety (tRPC); Resource & Schema DesignEnd-to-End Type Safety (tRPC); Code Generation from Schemas4Planned
Backend-for-Frontendbackend-for-frontend.mdAPI Design & ContractsBFF & AggregationCriticalAdvanced16 minEnd-to-End Type Safety (tRPC)API Gateways & Aggregation; Response Shaping4Planned
API Gateways & Aggregationapi-gateways-and-aggregation.mdAPI Design & ContractsBFF & AggregationCriticalAdvanced16 minBackend-for-Frontend; End-to-End Type Safety (tRPC)Backend-for-Frontend; Response Shaping4Planned
Response Shapingresponse-shaping.mdAPI Design & ContractsBFF & AggregationCriticalAdvanced16 minBackend-for-Frontend; End-to-End Type Safety (tRPC)Backend-for-Frontend; API Gateways & Aggregation4Planned

Frontend Architecture (16 articles · ~210 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Separation of Concernsseparation-of-concerns.mdFrontend ArchitectureStructure & BoundariesCriticalIntermediate12 minElements vs Components · React; Structural Typing · TypeScriptLayered Architecture; Module Boundaries; Dependency Direction & Inversion3Planned
Layered Architecturelayered-architecture.mdFrontend ArchitectureStructure & BoundariesCriticalIntermediate12 minSeparation of ConcernsSeparation of Concerns; Module Boundaries; Dependency Direction & Inversion3Planned
Module Boundariesmodule-boundaries.mdFrontend ArchitectureStructure & BoundariesCriticalIntermediate12 minSeparation of ConcernsSeparation of Concerns; Layered Architecture; Dependency Direction & Inversion3Planned
Dependency Direction & Inversiondependency-direction-and-inversion.mdFrontend ArchitectureStructure & BoundariesCriticalIntermediate15 minSeparation of ConcernsSeparation of Concerns; Layered Architecture; Module Boundaries3Planned
Feature-Based Structurefeature-based-structure.mdFrontend ArchitectureOrganizing CodeCriticalIntermediate12 minSeparation of ConcernsDomain-Driven Frontend; Colocation Principles3Planned
Domain-Driven Frontenddomain-driven-frontend.mdFrontend ArchitectureOrganizing CodeCriticalIntermediate12 minFeature-Based Structure; Separation of ConcernsFeature-Based Structure; Colocation Principles3Planned
Colocation Principlescolocation-principles.mdFrontend ArchitectureOrganizing CodeCriticalIntermediate12 minFeature-Based Structure; Separation of ConcernsFeature-Based Structure; Domain-Driven Frontend3Planned
Micro-Frontendsmicro-frontends.mdFrontend ArchitectureComposition at ScaleCriticalAdvanced16 minFeature-Based StructureModule Federation; Shared Kernel & Contracts4Planned
Module Federationmodule-federation.mdFrontend ArchitectureComposition at ScaleCriticalAdvanced16 minMicro-Frontends; Feature-Based StructureMicro-Frontends; Shared Kernel & Contracts4Planned
Shared Kernel & Contractsshared-kernel-and-contracts.mdFrontend ArchitectureComposition at ScaleCriticalAdvanced16 minMicro-Frontends; Feature-Based StructureMicro-Frontends; Module Federation4Planned
Rendering Boundariesrendering-boundaries.mdFrontend ArchitectureCross-Cutting BoundariesCriticalIntermediate12 minMicro-FrontendsData-Fetching Boundaries; Client/Server Split3Planned
Data-Fetching Boundariesdata-fetching-boundaries.mdFrontend ArchitectureCross-Cutting BoundariesCriticalIntermediate12 minRendering Boundaries; Micro-FrontendsRendering Boundaries; Client/Server Split3Planned
Client/Server Splitclient-server-split.mdFrontend ArchitectureCross-Cutting BoundariesCriticalIntermediate12 minRendering Boundaries; Micro-FrontendsRendering Boundaries; Data-Fetching Boundaries3Planned
Architectural Decision Recordsarchitectural-decision-records.mdFrontend ArchitectureDecision-MakingCriticalIntermediate15 minRendering BoundariesTrade-off Analysis; Evolutionary Architecture3Planned
Trade-off Analysistrade-off-analysis.mdFrontend ArchitectureDecision-MakingCriticalIntermediate12 minArchitectural Decision Records; Rendering BoundariesArchitectural Decision Records; Evolutionary Architecture3Planned
Evolutionary Architectureevolutionary-architecture.mdFrontend ArchitectureDecision-MakingCriticalIntermediate12 minArchitectural Decision Records; Rendering BoundariesArchitectural Decision Records; Trade-off Analysis3Planned

Data & Server State (20 articles · ~255 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Fetch-on-Render vs Render-as-You-Fetchfetch-on-render-vs-render-as-you-fetch.mdData & Server StateFetching StrategiesCriticalIntermediate15 minHTTP/1.1 Semantics · Networking & Protocols; Elements vs Components · React; Categories of State · State ManagementParallel vs Waterfall Requests; Request Deduplication; Data Prefetching3Published
Parallel vs Waterfall Requestsparallel-vs-waterfall-requests.mdData & Server StateFetching StrategiesCriticalIntermediate15 minFetch-on-Render vs Render-as-You-FetchFetch-on-Render vs Render-as-You-Fetch; Request Deduplication; Data Prefetching3Published
Request Deduplicationrequest-deduplication.mdData & Server StateFetching StrategiesCriticalIntermediate12 minFetch-on-Render vs Render-as-You-FetchFetch-on-Render vs Render-as-You-Fetch; Parallel vs Waterfall Requests; Data Prefetching3Published
Data Prefetchingdata-prefetching.mdData & Server StateFetching StrategiesCriticalIntermediate12 minFetch-on-Render vs Render-as-You-FetchFetch-on-Render vs Render-as-You-Fetch; Parallel vs Waterfall Requests; Request Deduplication3Published
Cache Keys & Query Identitycache-keys-and-query-identity.mdData & Server StateServer-State CacheCriticalIntermediate15 minFetch-on-Render vs Render-as-You-FetchStaleness & Revalidation; Cache Invalidation; Background Refetching3Published
Staleness & Revalidationstaleness-and-revalidation.mdData & Server StateServer-State CacheCriticalIntermediate12 minCache Keys & Query Identity; Fetch-on-Render vs Render-as-You-FetchCache Keys & Query Identity; Cache Invalidation; Background Refetching3Published
Cache Invalidationcache-invalidation.mdData & Server StateServer-State CacheCriticalIntermediate12 minCache Keys & Query Identity; Fetch-on-Render vs Render-as-You-FetchCache Keys & Query Identity; Staleness & Revalidation; Background Refetching3Published
Background Refetchingbackground-refetching.mdData & Server StateServer-State CacheCriticalIntermediate12 minCache Keys & Query Identity; Fetch-on-Render vs Render-as-You-FetchCache Keys & Query Identity; Staleness & Revalidation; Cache Invalidation3Published
Mutation Lifecyclemutation-lifecycle.mdData & Server StateMutationsCriticalIntermediate12 minCache Keys & Query IdentityOptimistic Updates; Rollback & Conflict Resolution3Published
Optimistic Updatesoptimistic-updates.mdData & Server StateMutationsCriticalIntermediate12 minMutation Lifecycle; Cache Keys & Query IdentityMutation Lifecycle; Rollback & Conflict Resolution3Published
Rollback & Conflict Resolutionrollback-and-conflict-resolution.mdData & Server StateMutationsCriticalIntermediate15 minMutation Lifecycle; Cache Keys & Query IdentityMutation Lifecycle; Optimistic Updates3Published
Paginationpagination.mdData & Server StateLarge Data SetsCriticalIntermediate12 minMutation LifecycleInfinite & Cursor Loading; List Virtualization3Published
Infinite & Cursor Loadinginfinite-and-cursor-loading.mdData & Server StateLarge Data SetsCriticalIntermediate12 minPagination; Mutation LifecyclePagination; List Virtualization3Published
List Virtualizationlist-virtualization.mdData & Server StateLarge Data SetsCriticalIntermediate12 minPagination; Mutation LifecyclePagination; Infinite & Cursor Loading3Published
Normalizing Server Responsesnormalizing-server-responses.mdData & Server StateData ModelingCriticalIntermediate15 minPaginationClient-Side Relations; Derived Server Data3Published
Client-Side Relationsclient-side-relations.mdData & Server StateData ModelingCriticalIntermediate12 minNormalizing Server Responses; PaginationNormalizing Server Responses; Derived Server Data3Published
Derived Server Dataderived-server-data.mdData & Server StateData ModelingCriticalIntermediate12 minNormalizing Server Responses; PaginationNormalizing Server Responses; Client-Side Relations3Published
Retries & Backoffretries-and-backoff.mdData & Server StateResilienceCriticalIntermediate12 minNormalizing Server ResponsesLoading & Error States; Offline & Local-First Sync3Published
Loading & Error Statesloading-and-error-states.mdData & Server StateResilienceCriticalIntermediate12 minRetries & Backoff; Normalizing Server ResponsesRetries & Backoff; Offline & Local-First Sync3Published
Offline & Local-First Syncoffline-and-local-first-sync.mdData & Server StateResilienceCriticalIntermediate12 minRetries & Backoff; Normalizing Server ResponsesRetries & Backoff; Loading & Error States3Planned

Forms & Validation (16 articles · ~213 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Controlled Inputscontrolled-inputs.mdForms & ValidationForm StateCriticalIntermediate12 minElements vs Components · React; Structural Typing · TypeScript; Categories of State · State ManagementUncontrolled Inputs & Refs; Form Libraries & State Models; Field Arrays & Dynamic Fields3Published
Uncontrolled Inputs & Refsuncontrolled-inputs-and-refs.mdForms & ValidationForm StateCriticalIntermediate12 minControlled InputsControlled Inputs; Form Libraries & State Models; Field Arrays & Dynamic Fields3Planned
Form Libraries & State Modelsform-libraries-and-state-models.mdForms & ValidationForm StateCriticalIntermediate15 minControlled InputsControlled Inputs; Uncontrolled Inputs & Refs; Field Arrays & Dynamic Fields3Published
Field Arrays & Dynamic Fieldsfield-arrays-and-dynamic-fields.mdForms & ValidationForm StateCriticalIntermediate15 minControlled InputsControlled Inputs; Uncontrolled Inputs & Refs; Form Libraries & State Models3Planned
Client-Side Validation Strategiesclient-side-validation-strategies.mdForms & ValidationValidationCriticalIntermediate15 minControlled InputsSchema Validation; Async & Server Validation; Cross-Field Validation3Planned
Schema Validationschema-validation.mdForms & ValidationValidationCriticalIntermediate12 minClient-Side Validation Strategies; Controlled InputsClient-Side Validation Strategies; Async & Server Validation; Cross-Field Validation3Published
Async & Server Validationasync-and-server-validation.mdForms & ValidationValidationCriticalIntermediate12 minClient-Side Validation Strategies; Controlled InputsClient-Side Validation Strategies; Schema Validation; Cross-Field Validation3Planned
Cross-Field Validationcross-field-validation.mdForms & ValidationValidationCriticalIntermediate12 minClient-Side Validation Strategies; Controlled InputsClient-Side Validation Strategies; Schema Validation; Async & Server Validation3Planned
Schema-Inferred Typesschema-inferred-types.mdForms & ValidationType-Safe ContractsCriticalIntermediate12 minClient-Side Validation StrategiesShared Client/Server Schemas3Published
Shared Client/Server Schemasshared-client-server-schemas.mdForms & ValidationType-Safe ContractsCriticalIntermediate15 minSchema-Inferred Types; Client-Side Validation StrategiesSchema-Inferred Types3Planned
Error Messagingerror-messaging.mdForms & ValidationFeedback & UXCriticalIntermediate12 minSchema-Inferred TypesInline vs Submit Validation; Dirty, Touched & Submit State3Published
Inline vs Submit Validationinline-vs-submit-validation.mdForms & ValidationFeedback & UXCriticalIntermediate15 minError Messaging; Schema-Inferred TypesError Messaging; Dirty, Touched & Submit State3Planned
Dirty, Touched & Submit Statedirty-touched-and-submit-state.mdForms & ValidationFeedback & UXCriticalIntermediate15 minError Messaging; Schema-Inferred TypesError Messaging; Inline vs Submit Validation3Planned
Composite & Custom Inputscomposite-and-custom-inputs.mdForms & ValidationComplex FlowsCriticalIntermediate12 minError MessagingMulti-Step Wizards; Autosave & Draft Persistence3Planned
Multi-Step Wizardsmulti-step-wizards.mdForms & ValidationComplex FlowsCriticalIntermediate12 minComposite & Custom Inputs; Error MessagingComposite & Custom Inputs; Autosave & Draft Persistence3Planned
Autosave & Draft Persistenceautosave-and-draft-persistence.mdForms & ValidationComplex FlowsCriticalIntermediate15 minComposite & Custom Inputs; Error MessagingComposite & Custom Inputs; Multi-Step Wizards3Planned

State Management (18 articles · ~231 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Categories of Statecategories-of-state.mdState ManagementState TaxonomyCriticalIntermediate12 minElements vs Components · React; Primitives & Wrappers · JavaScriptServer vs Client State; UI vs Domain State; Ephemeral vs Persistent State3Published
Server vs Client Stateserver-vs-client-state.mdState ManagementState TaxonomyCriticalIntermediate12 minCategories of StateCategories of State; UI vs Domain State; Ephemeral vs Persistent State3Published
UI vs Domain Stateui-vs-domain-state.mdState ManagementState TaxonomyCriticalIntermediate12 minCategories of StateCategories of State; Server vs Client State; Ephemeral vs Persistent State3Published
Ephemeral vs Persistent Stateephemeral-vs-persistent-state.mdState ManagementState TaxonomyCriticalIntermediate15 minCategories of StateCategories of State; Server vs Client State; UI vs Domain State3Published
Local Statelocal-state.mdState ManagementState OwnershipCriticalIntermediate12 minCategories of StateLifting State Up; Global State; Colocation vs Centralization3Published
Lifting State Uplifting-state-up.mdState ManagementState OwnershipCriticalIntermediate12 minLocal State; Categories of StateLocal State; Global State; Colocation vs Centralization3Published
Global Stateglobal-state.mdState ManagementState OwnershipCriticalIntermediate12 minLocal State; Categories of StateLocal State; Lifting State Up; Colocation vs Centralization3Planned
Colocation vs Centralizationcolocation-vs-centralization.mdState ManagementState OwnershipCriticalIntermediate15 minLocal State; Categories of StateLocal State; Lifting State Up; Global State3Planned
Computed Valuescomputed-values.mdState ManagementDerived StateCriticalIntermediate12 minLocal StateSelectors & Memoized Selectors; Store Shape & Normalization3Planned
Selectors & Memoized Selectorsselectors-and-memoized-selectors.mdState ManagementDerived StateCriticalIntermediate15 minComputed Values; Local StateComputed Values; Store Shape & Normalization3Planned
Store Shape & Normalizationstore-shape-and-normalization.mdState ManagementDerived StateCriticalIntermediate15 minComputed Values; Local StateComputed Values; Selectors & Memoized Selectors3Planned
The Reducer Patternthe-reducer-pattern.mdState ManagementState PatternsCriticalIntermediate12 minComputed ValuesUnidirectional Data Flow; Event Sourcing & Commands; Modeling UI with State Machines3Planned
Unidirectional Data Flowunidirectional-data-flow.mdState ManagementState PatternsCriticalIntermediate12 minThe Reducer Pattern; Computed ValuesThe Reducer Pattern; Event Sourcing & Commands; Modeling UI with State Machines3Planned
Event Sourcing & Commandsevent-sourcing-and-commands.mdState ManagementState PatternsCriticalIntermediate12 minThe Reducer Pattern; Computed ValuesThe Reducer Pattern; Unidirectional Data Flow; Modeling UI with State Machines3Planned
Modeling UI with State Machinesmodeling-ui-with-state-machines.mdState ManagementState PatternsCriticalIntermediate15 minThe Reducer Pattern; Computed ValuesThe Reducer Pattern; Unidirectional Data Flow; Event Sourcing & Commands3Planned
Store-Based Librariesstore-based-libraries.mdState ManagementLibraries & ModelsCriticalIntermediate12 minThe Reducer PatternAtom-Based Libraries; Proxy-Based Reactivity3Planned
Atom-Based Librariesatom-based-libraries.mdState ManagementLibraries & ModelsCriticalIntermediate12 minStore-Based Libraries; The Reducer PatternStore-Based Libraries; Proxy-Based Reactivity3Planned
Proxy-Based Reactivityproxy-based-reactivity.mdState ManagementLibraries & ModelsCriticalIntermediate12 minStore-Based Libraries; The Reducer PatternStore-Based Libraries; Atom-Based Libraries3Planned

04 · Interface Engineering · Priority: High · 64 articles

Accessibility (19 articles · ~237 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
WCAG Principles (POUR)wcag-principles-pour.mdAccessibilityStandardsHighIntermediate12 minThe Document Outline · HTML & Document Semantics; Prop Design & Contracts · Component & Interaction DesignConformance Levels; The ARIA Model; Accessible Name Computation3Published
Conformance Levelsconformance-levels.mdAccessibilityStandardsHighIntermediate12 minWCAG Principles (POUR)WCAG Principles (POUR); The ARIA Model; Accessible Name Computation3Published
The ARIA Modelthe-aria-model.mdAccessibilityStandardsHighIntermediate12 minWCAG Principles (POUR)WCAG Principles (POUR); Conformance Levels; Accessible Name Computation3Published
Accessible Name Computationaccessible-name-computation.mdAccessibilityStandardsHighIntermediate15 minWCAG Principles (POUR)WCAG Principles (POUR); Conformance Levels; The ARIA Model3Published
Role, Name, Staterole-name-state.mdAccessibilityThe Accessibility TreeHighIntermediate12 minWCAG Principles (POUR)The Tree & Assistive Tech; Screen Reader Behavior3Published
The Tree & Assistive Techthe-tree-and-assistive-tech.mdAccessibilityThe Accessibility TreeHighIntermediate12 minRole, Name, State; WCAG Principles (POUR)Role, Name, State; Screen Reader Behavior3Planned
Screen Reader Behaviorscreen-reader-behavior.mdAccessibilityThe Accessibility TreeHighIntermediate12 minRole, Name, State; WCAG Principles (POUR)Role, Name, State; The Tree & Assistive Tech3Planned
Keyboard Navigationkeyboard-navigation.mdAccessibilityKeyboard & FocusHighIntermediate12 minRole, Name, StateFocus Management; Focus Order & Tab Trapping; Skip Links & Landmarks3Planned
Focus Managementfocus-management.mdAccessibilityKeyboard & FocusHighIntermediate12 minKeyboard Navigation; Role, Name, StateKeyboard Navigation; Focus Order & Tab Trapping; Skip Links & Landmarks3Planned
Focus Order & Tab Trappingfocus-order-and-tab-trapping.mdAccessibilityKeyboard & FocusHighIntermediate12 minKeyboard Navigation; Role, Name, StateKeyboard Navigation; Focus Management; Skip Links & Landmarks3Planned
Skip Links & Landmarksskip-links-and-landmarks.mdAccessibilityKeyboard & FocusHighIntermediate12 minKeyboard Navigation; Role, Name, StateKeyboard Navigation; Focus Management; Focus Order & Tab Trapping3Planned
Color Contrast Conformancecolor-contrast-conformance.mdAccessibilityPerceivable UIHighIntermediate12 minKeyboard NavigationText Alternatives; Reduced Motion & Vestibular Safety3Planned
Text Alternativestext-alternatives.mdAccessibilityPerceivable UIHighIntermediate12 minColor Contrast Conformance; Keyboard NavigationColor Contrast Conformance; Reduced Motion & Vestibular Safety3Planned
Reduced Motion & Vestibular Safetyreduced-motion-and-vestibular-safety.mdAccessibilityPerceivable UIHighIntermediate15 minColor Contrast Conformance; Keyboard NavigationColor Contrast Conformance; Text Alternatives3Planned
WAI-ARIA Widget Patternswai-aria-widget-patterns.mdAccessibilityAccessible PatternsHighIntermediate12 minColor Contrast ConformanceAccessible Forms; Live Regions & Announcements3Planned
Accessible Formsaccessible-forms.mdAccessibilityAccessible PatternsHighIntermediate12 minWAI-ARIA Widget Patterns; Color Contrast ConformanceWAI-ARIA Widget Patterns; Live Regions & Announcements3Planned
Live Regions & Announcementslive-regions-and-announcements.mdAccessibilityAccessible PatternsHighIntermediate15 minWAI-ARIA Widget Patterns; Color Contrast ConformanceWAI-ARIA Widget Patterns; Accessible Forms3Planned
Automated Auditingautomated-auditing.mdAccessibilityVerificationHighIntermediate12 minWAI-ARIA Widget PatternsManual & AT Testing3Planned
Manual & AT Testingmanual-and-at-testing.mdAccessibilityVerificationHighIntermediate12 minAutomated Auditing; WAI-ARIA Widget PatternsAutomated Auditing3Planned

Animation & Motion (14 articles · ~168 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Easing & Timingeasing-and-timing.mdAnimation & MotionMotion PrinciplesHighIntermediate12 minSpecificity · CSS & Visual Systems; Process & Thread Architecture · The Web PlatformChoreography & Sequencing; Purposeful Motion3Planned
Choreography & Sequencingchoreography-and-sequencing.mdAnimation & MotionMotion PrinciplesHighIntermediate12 minEasing & TimingEasing & Timing; Purposeful Motion3Planned
Purposeful Motionpurposeful-motion.mdAnimation & MotionMotion PrinciplesHighIntermediate12 minEasing & TimingEasing & Timing; Choreography & Sequencing3Planned
CSS Transitionscss-transitions.mdAnimation & MotionTechniquesHighIntermediate12 minEasing & TimingCSS Animations & Keyframes; The Web Animations API; The View Transitions API; Spring & Physics Animation3Planned
CSS Animations & Keyframescss-animations-and-keyframes.mdAnimation & MotionTechniquesHighIntermediate12 minCSS Transitions; Easing & TimingCSS Transitions; The Web Animations API; The View Transitions API; Spring & Physics Animation3Planned
The Web Animations APIthe-web-animations-api.mdAnimation & MotionTechniquesHighIntermediate12 minCSS Transitions; Easing & TimingCSS Transitions; CSS Animations & Keyframes; The View Transitions API; Spring & Physics Animation3Planned
The View Transitions APIthe-view-transitions-api.mdAnimation & MotionTechniquesHighIntermediate12 minCSS Transitions; Easing & TimingCSS Transitions; CSS Animations & Keyframes; The Web Animations API; Spring & Physics Animation3Planned
Spring & Physics Animationspring-and-physics-animation.mdAnimation & MotionTechniquesHighIntermediate12 minCSS Transitions; Easing & TimingCSS Transitions; CSS Animations & Keyframes; The Web Animations API; The View Transitions API3Planned
Compositor-Only Propertiescompositor-only-properties.mdAnimation & MotionPerformanceHighIntermediate12 minCSS TransitionsAvoiding Layout Thrash; The FLIP Technique3Planned
Avoiding Layout Thrashavoiding-layout-thrash.mdAnimation & MotionPerformanceHighIntermediate12 minCompositor-Only Properties; CSS TransitionsCompositor-Only Properties; The FLIP Technique3Planned
The FLIP Techniquethe-flip-technique.mdAnimation & MotionPerformanceHighIntermediate12 minCompositor-Only Properties; CSS TransitionsCompositor-Only Properties; Avoiding Layout Thrash3Planned
Gesture-Driven Animationgesture-driven-animation.mdAnimation & MotionInteraction MotionHighIntermediate12 minCompositor-Only PropertiesScroll-Linked Animation; Shared-Element Transitions3Planned
Scroll-Linked Animationscroll-linked-animation.mdAnimation & MotionInteraction MotionHighIntermediate12 minGesture-Driven Animation; Compositor-Only PropertiesGesture-Driven Animation; Shared-Element Transitions3Planned
Shared-Element Transitionsshared-element-transitions.mdAnimation & MotionInteraction MotionHighIntermediate12 minGesture-Driven Animation; Compositor-Only PropertiesGesture-Driven Animation; Scroll-Linked Animation3Planned

Component & Interaction Design (16 articles · ~207 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Prop Design & Contractsprop-design-and-contracts.mdComponent & Interaction DesignComponent APIsHighIntermediate12 minElements vs Components · React; Specificity · CSS & Visual SystemsComposition vs Configuration; Polymorphic Components (as); Slots & Children APIs3Planned
Composition vs Configurationcomposition-vs-configuration.mdComponent & Interaction DesignComponent APIsHighIntermediate15 minProp Design & ContractsProp Design & Contracts; Polymorphic Components (as); Slots & Children APIs3Planned
Polymorphic Components (as)polymorphic-components-as.mdComponent & Interaction DesignComponent APIsHighIntermediate15 minProp Design & ContractsProp Design & Contracts; Composition vs Configuration; Slots & Children APIs3Planned
Slots & Children APIsslots-and-children-apis.mdComponent & Interaction DesignComponent APIsHighIntermediate12 minProp Design & ContractsProp Design & Contracts; Composition vs Configuration; Polymorphic Components (as)3Planned
Headless Componentsheadless-components.mdComponent & Interaction DesignBehavior PatternsHighIntermediate12 minProp Design & ContractsControlled vs Uncontrolled Pattern; Compound Components; Render Props3Planned
Controlled vs Uncontrolled Patterncontrolled-vs-uncontrolled-pattern.mdComponent & Interaction DesignBehavior PatternsHighIntermediate15 minHeadless Components; Prop Design & ContractsHeadless Components; Compound Components; Render Props3Planned
Compound Componentscompound-components.mdComponent & Interaction DesignBehavior PatternsHighIntermediate12 minHeadless Components; Prop Design & ContractsHeadless Components; Controlled vs Uncontrolled Pattern; Render Props3Planned
Render Propsrender-props.mdComponent & Interaction DesignBehavior PatternsHighIntermediate12 minHeadless Components; Prop Design & ContractsHeadless Components; Controlled vs Uncontrolled Pattern; Compound Components3Planned
Pointer & Mouse Interactionpointer-and-mouse-interaction.mdComponent & Interaction DesignInteractionHighIntermediate15 minHeadless ComponentsDrag & Drop; Hover, Press & Long-Press States; Gesture Handling3Planned
Drag & Dropdrag-and-drop.mdComponent & Interaction DesignInteractionHighIntermediate12 minPointer & Mouse Interaction; Headless ComponentsPointer & Mouse Interaction; Hover, Press & Long-Press States; Gesture Handling3Planned
Hover, Press & Long-Press Stateshover-press-and-long-press-states.mdComponent & Interaction DesignInteractionHighIntermediate15 minPointer & Mouse Interaction; Headless ComponentsPointer & Mouse Interaction; Drag & Drop; Gesture Handling3Planned
Gesture Handlinggesture-handling.mdComponent & Interaction DesignInteractionHighIntermediate12 minPointer & Mouse Interaction; Headless ComponentsPointer & Mouse Interaction; Drag & Drop; Hover, Press & Long-Press States3Planned
Loading & Skeleton Statesloading-and-skeleton-states.mdComponent & Interaction DesignInterface StateHighIntermediate12 minPointer & Mouse InteractionEmpty States; Error & Retry States; Disabled & Busy States3Planned
Empty Statesempty-states.mdComponent & Interaction DesignInterface StateHighIntermediate12 minLoading & Skeleton States; Pointer & Mouse InteractionLoading & Skeleton States; Error & Retry States; Disabled & Busy States3Planned
Error & Retry Stateserror-and-retry-states.mdComponent & Interaction DesignInterface StateHighIntermediate12 minLoading & Skeleton States; Pointer & Mouse InteractionLoading & Skeleton States; Empty States; Disabled & Busy States3Planned
Disabled & Busy Statesdisabled-and-busy-states.mdComponent & Interaction DesignInterface StateHighIntermediate12 minLoading & Skeleton States; Pointer & Mouse InteractionLoading & Skeleton States; Empty States; Error & Retry States3Planned

Design Systems (15 articles · ~192 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Design Primitivesdesign-primitives.mdDesign SystemsFoundationsHighIntermediate12 minSpecificity · CSS & Visual Systems; Prop Design & Contracts · Component & Interaction DesignSpacing & Layout Scales; Elevation & Surfaces3Planned
Spacing & Layout Scalesspacing-and-layout-scales.mdDesign SystemsFoundationsHighIntermediate12 minDesign PrimitivesDesign Primitives; Elevation & Surfaces3Planned
Elevation & Surfaceselevation-and-surfaces.mdDesign SystemsFoundationsHighIntermediate12 minDesign PrimitivesDesign Primitives; Spacing & Layout Scales3Planned
Token Architecturetoken-architecture.mdDesign SystemsTokensHighIntermediate12 minDesign PrimitivesSemantic Token Layers; Token Transformation & Distribution3Planned
Semantic Token Layerssemantic-token-layers.mdDesign SystemsTokensHighIntermediate12 minToken Architecture; Design PrimitivesToken Architecture; Token Transformation & Distribution3Planned
Token Transformation & Distributiontoken-transformation-and-distribution.mdDesign SystemsTokensHighIntermediate15 minToken Architecture; Design PrimitivesToken Architecture; Semantic Token Layers3Planned
Light/Dark & Color Modeslight-dark-and-color-modes.mdDesign SystemsThemingHighIntermediate12 minToken ArchitectureMulti-Brand Theming; Runtime vs Build-Time Theming3Planned
Multi-Brand Themingmulti-brand-theming.mdDesign SystemsThemingHighIntermediate12 minLight/Dark & Color Modes; Token ArchitectureLight/Dark & Color Modes; Runtime vs Build-Time Theming3Planned
Runtime vs Build-Time Themingruntime-vs-build-time-theming.mdDesign SystemsThemingHighIntermediate15 minLight/Dark & Color Modes; Token ArchitectureLight/Dark & Color Modes; Multi-Brand Theming3Planned
Contribution Modelcontribution-model.mdDesign SystemsGovernanceHighIntermediate12 minLight/Dark & Color ModesVersioning & Deprecation; Breaking Changes & Migration3Planned
Versioning & Deprecationversioning-and-deprecation.mdDesign SystemsGovernanceHighIntermediate12 minContribution Model; Light/Dark & Color ModesContribution Model; Breaking Changes & Migration3Planned
Breaking Changes & Migrationbreaking-changes-and-migration.mdDesign SystemsGovernanceHighIntermediate15 minContribution Model; Light/Dark & Color ModesContribution Model; Versioning & Deprecation3Planned
Usage Guidelinesusage-guidelines.mdDesign SystemsAdoptionHighIntermediate12 minContribution ModelLiving Docs & Playgrounds; Adoption & Coverage Metrics3Planned
Living Docs & Playgroundsliving-docs-and-playgrounds.mdDesign SystemsAdoptionHighIntermediate12 minUsage Guidelines; Contribution ModelUsage Guidelines; Adoption & Coverage Metrics3Planned
Adoption & Coverage Metricsadoption-and-coverage-metrics.mdDesign SystemsAdoptionHighIntermediate15 minUsage Guidelines; Contribution ModelUsage Guidelines; Living Docs & Playgrounds3Planned

05 · Reliability & Quality · Priority: Critical · 79 articles

Observability & Reliability (15 articles · ~255 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Client Error Captureclient-error-capture.mdObservability & ReliabilityError TrackingCriticalAdvanced16 minCore Web Vitals (LCP, INP, CLS) · Performance Engineering; Static Hosting · Delivery & InfrastructureSource Maps & Symbolication; Error Grouping & Alerting4Planned
Source Maps & Symbolicationsource-maps-and-symbolication.mdObservability & ReliabilityError TrackingCriticalAdvanced19 minClient Error CaptureClient Error Capture; Error Grouping & Alerting4Planned
Error Grouping & Alertingerror-grouping-and-alerting.mdObservability & ReliabilityError TrackingCriticalAdvanced16 minClient Error CaptureClient Error Capture; Source Maps & Symbolication4Planned
RUM & Field Vitalsrum-and-field-vitals.mdObservability & ReliabilityReal-User MonitoringCriticalAdvanced16 minClient Error CaptureSession Replay; Sampling Strategies4Planned
Session Replaysession-replay.mdObservability & ReliabilityReal-User MonitoringCriticalAdvanced16 minRUM & Field Vitals; Client Error CaptureRUM & Field Vitals; Sampling Strategies4Planned
Sampling Strategiessampling-strategies.mdObservability & ReliabilityReal-User MonitoringCriticalAdvanced16 minRUM & Field Vitals; Client Error CaptureRUM & Field Vitals; Session Replay4Planned
Structured Loggingstructured-logging.mdObservability & ReliabilityInstrumentationCriticalAdvanced16 minRUM & Field VitalsFrontend Tracing & Spans; Custom Metrics & Events4Planned
Frontend Tracing & Spansfrontend-tracing-and-spans.mdObservability & ReliabilityInstrumentationCriticalAdvanced16 minStructured Logging; RUM & Field VitalsStructured Logging; Custom Metrics & Events4Planned
Custom Metrics & Eventscustom-metrics-and-events.mdObservability & ReliabilityInstrumentationCriticalAdvanced16 minStructured Logging; RUM & Field VitalsStructured Logging; Frontend Tracing & Spans4Planned
Analytics Eventsanalytics-events.mdObservability & ReliabilityProduct TelemetryCriticalAdvanced16 minStructured LoggingFunnels & Conversion; Privacy-Safe Analytics4Planned
Funnels & Conversionfunnels-and-conversion.mdObservability & ReliabilityProduct TelemetryCriticalAdvanced16 minAnalytics Events; Structured LoggingAnalytics Events; Privacy-Safe Analytics4Planned
Privacy-Safe Analyticsprivacy-safe-analytics.mdObservability & ReliabilityProduct TelemetryCriticalAdvanced16 minAnalytics Events; Structured LoggingAnalytics Events; Funnels & Conversion4Planned
On-Call & Alertingon-call-and-alerting.mdObservability & ReliabilityIncident ResponseCriticalStaff20 minAnalytics EventsPostmortems & RCA; Error Budgets & SLOs1Planned
Postmortems & RCApostmortems-and-rca.mdObservability & ReliabilityIncident ResponseCriticalStaff20 minOn-Call & Alerting; Analytics EventsOn-Call & Alerting; Error Budgets & SLOs1Planned
Error Budgets & SLOserror-budgets-and-slos.mdObservability & ReliabilityIncident ResponseCriticalStaff20 minOn-Call & Alerting; Analytics EventsOn-Call & Alerting; Postmortems & RCA1Planned

Performance Engineering (22 articles · ~303 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Core Web Vitals (LCP, INP, CLS)core-web-vitals-lcp-inp-cls.mdPerformance EngineeringMetricsCriticalIntermediate15 minProcess & Thread Architecture · The Web Platform; Parsing & Bytecode · Runtime & Execution; HTTP/1.1 Semantics · Networking & ProtocolsPerceived vs Actual Performance; Custom Performance Metrics; Lab vs Field Measurement3Published
Perceived vs Actual Performanceperceived-vs-actual-performance.mdPerformance EngineeringMetricsCriticalIntermediate15 minCore Web Vitals (LCP, INP, CLS)Core Web Vitals (LCP, INP, CLS); Custom Performance Metrics; Lab vs Field Measurement3Planned
Custom Performance Metricscustom-performance-metrics.mdPerformance EngineeringMetricsCriticalIntermediate12 minCore Web Vitals (LCP, INP, CLS)Core Web Vitals (LCP, INP, CLS); Perceived vs Actual Performance; Lab vs Field Measurement3Planned
Lab vs Field Measurementlab-vs-field-measurement.mdPerformance EngineeringMetricsCriticalIntermediate12 minCore Web Vitals (LCP, INP, CLS)Core Web Vitals (LCP, INP, CLS); Perceived vs Actual Performance; Custom Performance Metrics3Planned
The Critical Rendering Paththe-critical-rendering-path.mdPerformance EngineeringLoading PerformanceCriticalIntermediate15 minCore Web Vitals (LCP, INP, CLS)Code Splitting; Resource Prefetch & Preload; Critical CSS & Above-the-Fold; Font & Asset Loading Strategy3Published
Code Splittingcode-splitting.mdPerformance EngineeringLoading PerformanceCriticalIntermediate12 minThe Critical Rendering Path; Core Web Vitals (LCP, INP, CLS)The Critical Rendering Path; Resource Prefetch & Preload; Critical CSS & Above-the-Fold; Font & Asset Loading Strategy3Published
Resource Prefetch & Preloadresource-prefetch-and-preload.mdPerformance EngineeringLoading PerformanceCriticalIntermediate15 minThe Critical Rendering Path; Core Web Vitals (LCP, INP, CLS)The Critical Rendering Path; Code Splitting; Critical CSS & Above-the-Fold; Font & Asset Loading Strategy3Published
Critical CSS & Above-the-Foldcritical-css-and-above-the-fold.mdPerformance EngineeringLoading PerformanceCriticalIntermediate15 minThe Critical Rendering Path; Core Web Vitals (LCP, INP, CLS)The Critical Rendering Path; Code Splitting; Resource Prefetch & Preload; Font & Asset Loading Strategy3Planned
Font & Asset Loading Strategyfont-and-asset-loading-strategy.mdPerformance EngineeringLoading PerformanceCriticalIntermediate15 minThe Critical Rendering Path; Core Web Vitals (LCP, INP, CLS)The Critical Rendering Path; Code Splitting; Resource Prefetch & Preload; Critical CSS & Above-the-Fold3Planned
Image Optimizationimage-optimization.mdPerformance EngineeringAsset OptimizationCriticalIntermediate12 minThe Critical Rendering PathMedia & Video Optimization; Bundle Size Optimization; Asset Minification & Compression3Planned
Media & Video Optimizationmedia-and-video-optimization.mdPerformance EngineeringAsset OptimizationCriticalIntermediate12 minImage Optimization; The Critical Rendering PathImage Optimization; Bundle Size Optimization; Asset Minification & Compression3Planned
Bundle Size Optimizationbundle-size-optimization.mdPerformance EngineeringAsset OptimizationCriticalIntermediate12 minImage Optimization; The Critical Rendering PathImage Optimization; Media & Video Optimization; Asset Minification & Compression3Planned
Asset Minification & Compressionasset-minification-and-compression.mdPerformance EngineeringAsset OptimizationCriticalIntermediate15 minImage Optimization; The Critical Rendering PathImage Optimization; Media & Video Optimization; Bundle Size Optimization3Planned
Rendering Cost & Re-rendersrendering-cost-and-re-renders.mdPerformance EngineeringRuntime PerformanceCriticalIntermediate15 minImage OptimizationLong Tasks & Main-Thread Work; Debounce, Throttle & Scheduling; Offloading to Workers3Planned
Long Tasks & Main-Thread Worklong-tasks-and-main-thread-work.mdPerformance EngineeringRuntime PerformanceCriticalIntermediate15 minRendering Cost & Re-renders; Image OptimizationRendering Cost & Re-renders; Debounce, Throttle & Scheduling; Offloading to Workers3Planned
Debounce, Throttle & Schedulingdebounce-throttle-and-scheduling.mdPerformance EngineeringRuntime PerformanceCriticalIntermediate15 minRendering Cost & Re-renders; Image OptimizationRendering Cost & Re-renders; Long Tasks & Main-Thread Work; Offloading to Workers3Planned
Offloading to Workersoffloading-to-workers.mdPerformance EngineeringRuntime PerformanceCriticalIntermediate12 minRendering Cost & Re-renders; Image OptimizationRendering Cost & Re-renders; Long Tasks & Main-Thread Work; Debounce, Throttle & Scheduling3Planned
Memory Profiling in Practicememory-profiling-in-practice.mdPerformance EngineeringMemory PerformanceCriticalIntermediate15 minRendering Cost & Re-rendersLong-Session Memory Growth3Planned
Long-Session Memory Growthlong-session-memory-growth.mdPerformance EngineeringMemory PerformanceCriticalIntermediate12 minMemory Profiling in Practice; Rendering Cost & Re-rendersMemory Profiling in Practice3Planned
Performance Budgetsperformance-budgets.mdPerformance EngineeringPerformance CultureCriticalIntermediate12 minMemory Profiling in PracticeRegression Prevention & CI Gates; Caching for Performance (cross-layer)3Planned
Regression Prevention & CI Gatesregression-prevention-and-ci-gates.mdPerformance EngineeringPerformance CultureCriticalIntermediate15 minPerformance Budgets; Memory Profiling in PracticePerformance Budgets; Caching for Performance (cross-layer)3Planned
Caching for Performance (cross-layer)caching-for-performance-cross-layer.mdPerformance EngineeringPerformance CultureCriticalIntermediate15 minPerformance Budgets; Memory Profiling in PracticePerformance Budgets; Regression Prevention & CI Gates3Planned

Security (24 articles · ~387 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Same-Origin Policysame-origin-policy.mdSecurityThe Security ModelCriticalAdvanced16 minHTTP/1.1 Semantics · Networking & Protocols; Web Storage · Browser APIsCORS; Isolation (COOP/COEP)4Published
CORScors.mdSecurityThe Security ModelCriticalAdvanced16 minSame-Origin PolicySame-Origin Policy; Isolation (COOP/COEP)4Published
Isolation (COOP/COEP)isolation-coop-coep.mdSecurityThe Security ModelCriticalAdvanced16 minSame-Origin PolicySame-Origin Policy; CORS4Planned
Cross-Site Scripting (XSS)cross-site-scripting-xss.mdSecurityInjection AttacksCriticalAdvanced16 minSame-Origin PolicyDOM-Based XSS; HTML/Template Injection; Sanitization & Encoding4Planned
DOM-Based XSSdom-based-xss.mdSecurityInjection AttacksCriticalAdvanced16 minCross-Site Scripting (XSS); Same-Origin PolicyCross-Site Scripting (XSS); HTML/Template Injection; Sanitization & Encoding4Planned
HTML/Template Injectionhtml-template-injection.mdSecurityInjection AttacksCriticalAdvanced16 minCross-Site Scripting (XSS); Same-Origin PolicyCross-Site Scripting (XSS); DOM-Based XSS; Sanitization & Encoding4Planned
Sanitization & Encodingsanitization-and-encoding.mdSecurityInjection AttacksCriticalAdvanced16 minCross-Site Scripting (XSS); Same-Origin PolicyCross-Site Scripting (XSS); DOM-Based XSS; HTML/Template Injection4Planned
Cross-Site Request Forgerycross-site-request-forgery.mdSecurityRequest AttacksCriticalAdvanced16 minCross-Site Scripting (XSS)Clickjacking; Client-Edge SSRF4Planned
Clickjackingclickjacking.mdSecurityRequest AttacksCriticalAdvanced16 minCross-Site Request Forgery; Cross-Site Scripting (XSS)Cross-Site Request Forgery; Client-Edge SSRF4Planned
Client-Edge SSRFclient-edge-ssrf.mdSecurityRequest AttacksCriticalAdvanced16 minCross-Site Request Forgery; Cross-Site Scripting (XSS)Cross-Site Request Forgery; Clickjacking4Planned
Content Security Policycontent-security-policy.mdSecurityContent SecurityCriticalAdvanced16 minCross-Site Request ForgeryTrusted Types; Subresource Integrity4Planned
Trusted Typestrusted-types.mdSecurityContent SecurityCriticalAdvanced16 minContent Security Policy; Cross-Site Request ForgeryContent Security Policy; Subresource Integrity4Planned
Subresource Integritysubresource-integrity.mdSecurityContent SecurityCriticalAdvanced16 minContent Security Policy; Cross-Site Request ForgeryContent Security Policy; Trusted Types4Planned
Session Managementsession-management.mdSecurityAuthentication & SessionsCriticalAdvanced16 minContent Security PolicyToken Types (JWT, opaque); Token Storage Trade-offs; OAuth & OIDC Flows; Client Auth (guards, refresh)4Planned
Token Types (JWT, opaque)token-types-jwt-opaque.mdSecurityAuthentication & SessionsCriticalAdvanced16 minSession Management; Content Security PolicySession Management; Token Storage Trade-offs; OAuth & OIDC Flows; Client Auth (guards, refresh)4Planned
Token Storage Trade-offstoken-storage-trade-offs.mdSecurityAuthentication & SessionsCriticalAdvanced16 minSession Management; Content Security PolicySession Management; Token Types (JWT, opaque); OAuth & OIDC Flows; Client Auth (guards, refresh)4Planned
OAuth & OIDC Flowsoauth-and-oidc-flows.mdSecurityAuthentication & SessionsCriticalAdvanced16 minSession Management; Content Security PolicySession Management; Token Types (JWT, opaque); Token Storage Trade-offs; Client Auth (guards, refresh)4Planned
Client Auth (guards, refresh)client-auth-guards-refresh.mdSecurityAuthentication & SessionsCriticalAdvanced19 minSession Management; Content Security PolicySession Management; Token Types (JWT, opaque); Token Storage Trade-offs; OAuth & OIDC Flows4Planned
Dependency Vulnerabilitiesdependency-vulnerabilities.mdSecuritySupply ChainCriticalAdvanced16 minSession ManagementLockfiles & Provenance; Third-Party Script Risk4Planned
Lockfiles & Provenancelockfiles-and-provenance.mdSecuritySupply ChainCriticalAdvanced16 minDependency Vulnerabilities; Session ManagementDependency Vulnerabilities; Third-Party Script Risk4Planned
Third-Party Script Riskthird-party-script-risk.mdSecuritySupply ChainCriticalAdvanced16 minDependency Vulnerabilities; Session ManagementDependency Vulnerabilities; Lockfiles & Provenance4Planned
Data Handling & PIIdata-handling-and-pii.mdSecurityPrivacyCriticalAdvanced16 minDependency VulnerabilitiesConsent & Tracking; Regulatory Compliance4Planned
Consent & Trackingconsent-and-tracking.mdSecurityPrivacyCriticalAdvanced16 minData Handling & PII; Dependency VulnerabilitiesData Handling & PII; Regulatory Compliance4Planned
Regulatory Complianceregulatory-compliance.mdSecurityPrivacyCriticalAdvanced16 minData Handling & PII; Dependency VulnerabilitiesData Handling & PII; Consent & Tracking4Planned

Testing & Quality (18 articles · ~231 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
The Testing Pyramid/Trophythe-testing-pyramid-trophy.mdTesting & QualityStrategyCriticalIntermediate12 minElements vs Components · React; Primitives & Wrappers · JavaScriptWhat to Test & Coverage Goals; Test Doubles (mocks, stubs, fakes)3Published
What to Test & Coverage Goalswhat-to-test-and-coverage-goals.mdTesting & QualityStrategyCriticalIntermediate15 minThe Testing Pyramid/TrophyThe Testing Pyramid/Trophy; Test Doubles (mocks, stubs, fakes)3Published
Test Doubles (mocks, stubs, fakes)test-doubles-mocks-stubs-fakes.mdTesting & QualityStrategyCriticalIntermediate15 minThe Testing Pyramid/TrophyThe Testing Pyramid/Trophy; What to Test & Coverage Goals3Published
Pure Logic Testingpure-logic-testing.mdTesting & QualityUnit TestingCriticalIntermediate12 minThe Testing Pyramid/TrophyTesting Hooks & Utilities; Property-Based Testing3Published
Testing Hooks & Utilitiestesting-hooks-and-utilities.mdTesting & QualityUnit TestingCriticalIntermediate12 minPure Logic Testing; The Testing Pyramid/TrophyPure Logic Testing; Property-Based Testing3Planned
Property-Based Testingproperty-based-testing.mdTesting & QualityUnit TestingCriticalIntermediate12 minPure Logic Testing; The Testing Pyramid/TrophyPure Logic Testing; Testing Hooks & Utilities3Planned
Rendering & Queryingrendering-and-querying.mdTesting & QualityComponent TestingCriticalIntermediate12 minPure Logic TestingUser-Event Simulation; Accessibility-Tree Assertions3Planned
User-Event Simulationuser-event-simulation.mdTesting & QualityComponent TestingCriticalIntermediate12 minRendering & Querying; Pure Logic TestingRendering & Querying; Accessibility-Tree Assertions3Planned
Accessibility-Tree Assertionsaccessibility-tree-assertions.mdTesting & QualityComponent TestingCriticalIntermediate15 minRendering & Querying; Pure Logic TestingRendering & Querying; User-Event Simulation3Planned
Testing with Real Providerstesting-with-real-providers.mdTesting & QualityIntegration TestingCriticalIntermediate15 minRendering & QueryingNetwork Mocking; Testing State & Data Flows3Planned
Network Mockingnetwork-mocking.mdTesting & QualityIntegration TestingCriticalIntermediate12 minTesting with Real Providers; Rendering & QueryingTesting with Real Providers; Testing State & Data Flows3Planned
Testing State & Data Flowstesting-state-and-data-flows.mdTesting & QualityIntegration TestingCriticalIntermediate12 minTesting with Real Providers; Rendering & QueryingTesting with Real Providers; Network Mocking3Planned
E2E User Flowse2e-user-flows.mdTesting & QualityEnd-to-EndCriticalIntermediate12 minTesting with Real ProvidersCross-Browser Testing; Visual Regression Testing3Planned
Cross-Browser Testingcross-browser-testing.mdTesting & QualityEnd-to-EndCriticalIntermediate12 minE2E User Flows; Testing with Real ProvidersE2E User Flows; Visual Regression Testing3Planned
Visual Regression Testingvisual-regression-testing.mdTesting & QualityEnd-to-EndCriticalIntermediate12 minE2E User Flows; Testing with Real ProvidersE2E User Flows; Cross-Browser Testing3Planned
Flakiness & Determinismflakiness-and-determinism.mdTesting & QualityTest HealthCriticalIntermediate12 minE2E User FlowsTest Performance & Parallelism; Test Maintenance3Planned
Test Performance & Parallelismtest-performance-and-parallelism.mdTesting & QualityTest HealthCriticalIntermediate15 minFlakiness & Determinism; E2E User FlowsFlakiness & Determinism; Test Maintenance3Planned
Test Maintenancetest-maintenance.mdTesting & QualityTest HealthCriticalIntermediate12 minFlakiness & Determinism; E2E User FlowsFlakiness & Determinism; Test Performance & Parallelism3Planned

06 · Engineering Systems · Priority: High · 69 articles

Build Systems & Tooling (16 articles · ~216 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
The Dependency Graphthe-dependency-graph.mdBuild Systems & ToolingModule BundlingHighIntermediate12 minPrimitives & Wrappers · JavaScript; Dependency Resolution · Package ArchitectureBundler Models; Entry Points & Output3Planned
Bundler Modelsbundler-models.mdBuild Systems & ToolingModule BundlingHighIntermediate12 minThe Dependency GraphThe Dependency Graph; Entry Points & Output3Planned
Entry Points & Outputentry-points-and-output.mdBuild Systems & ToolingModule BundlingHighIntermediate12 minThe Dependency GraphThe Dependency Graph; Bundler Models3Planned
Transpilation & Targetstranspilation-and-targets.mdBuild Systems & ToolingCompilationHighAdvanced16 minThe Dependency GraphSource-to-Source Compilers; AST Transforms & Plugins4Planned
Source-to-Source Compilerssource-to-source-compilers.mdBuild Systems & ToolingCompilationHighAdvanced16 minTranspilation & Targets; The Dependency GraphTranspilation & Targets; AST Transforms & Plugins4Planned
AST Transforms & Pluginsast-transforms-and-plugins.mdBuild Systems & ToolingCompilationHighAdvanced16 minTranspilation & Targets; The Dependency GraphTranspilation & Targets; Source-to-Source Compilers4Planned
Tree Shakingtree-shaking.mdBuild Systems & ToolingOptimizationHighIntermediate12 minTranspilation & TargetsDead Code Elimination; Chunking & Split Points; Scope Hoisting3Planned
Dead Code Eliminationdead-code-elimination.mdBuild Systems & ToolingOptimizationHighIntermediate12 minTree Shaking; Transpilation & TargetsTree Shaking; Chunking & Split Points; Scope Hoisting3Planned
Chunking & Split Pointschunking-and-split-points.mdBuild Systems & ToolingOptimizationHighIntermediate12 minTree Shaking; Transpilation & TargetsTree Shaking; Dead Code Elimination; Scope Hoisting3Planned
Scope Hoistingscope-hoisting.mdBuild Systems & ToolingOptimizationHighIntermediate12 minTree Shaking; Transpilation & TargetsTree Shaking; Dead Code Elimination; Chunking & Split Points3Planned
Source Mapssource-maps.mdBuild Systems & ToolingDeveloper AidsHighIntermediate12 minTree ShakingHot Module Replacement; Dev Server Architecture3Planned
Hot Module Replacementhot-module-replacement.mdBuild Systems & ToolingDeveloper AidsHighIntermediate12 minSource Maps; Tree ShakingSource Maps; Dev Server Architecture3Planned
Dev Server Architecturedev-server-architecture.mdBuild Systems & ToolingDeveloper AidsHighIntermediate12 minSource Maps; Tree ShakingSource Maps; Hot Module Replacement3Planned
Incremental Buildsincremental-builds.mdBuild Systems & ToolingBuild CacheHighAdvanced16 minSource MapsPersistent & Remote Cache; Cache Invalidation Keys4Planned
Persistent & Remote Cachepersistent-and-remote-cache.mdBuild Systems & ToolingBuild CacheHighAdvanced16 minIncremental Builds; Source MapsIncremental Builds; Cache Invalidation Keys4Planned
Cache Invalidation Keyscache-invalidation-keys.mdBuild Systems & ToolingBuild CacheHighAdvanced16 minIncremental Builds; Source MapsIncremental Builds; Persistent & Remote Cache4Planned

Delivery & Infrastructure (17 articles · ~278 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Static Hostingstatic-hosting.mdDelivery & InfrastructureHosting ModelsHighAdvanced16 minThe Dependency Graph · Build Systems & Tooling; HTTP/1.1 Semantics · Networking & ProtocolsServer & SSR Hosting; Serverless Functions; Edge Runtimes4Planned
Server & SSR Hostingserver-and-ssr-hosting.mdDelivery & InfrastructureHosting ModelsHighAdvanced16 minStatic HostingStatic Hosting; Serverless Functions; Edge Runtimes4Planned
Serverless Functionsserverless-functions.mdDelivery & InfrastructureHosting ModelsHighAdvanced16 minStatic HostingStatic Hosting; Server & SSR Hosting; Edge Runtimes4Planned
Edge Runtimesedge-runtimes.mdDelivery & InfrastructureHosting ModelsHighAdvanced16 minStatic HostingStatic Hosting; Server & SSR Hosting; Serverless Functions4Planned
CDN Architecturecdn-architecture.mdDelivery & InfrastructureContent DeliveryHighAdvanced16 minStatic HostingEdge Compute & Routing; Immutable Asset URLs4Planned
Edge Compute & Routingedge-compute-and-routing.mdDelivery & InfrastructureContent DeliveryHighAdvanced16 minCDN Architecture; Static HostingCDN Architecture; Immutable Asset URLs4Planned
Immutable Asset URLsimmutable-asset-urls.mdDelivery & InfrastructureContent DeliveryHighAdvanced16 minCDN Architecture; Static HostingCDN Architecture; Edge Compute & Routing4Planned
Environment Configurationenvironment-configuration.mdDelivery & InfrastructureConfigurationHighAdvanced16 minCDN ArchitectureSecrets Management; Feature Configuration4Planned
Secrets Managementsecrets-management.mdDelivery & InfrastructureConfigurationHighAdvanced16 minEnvironment Configuration; CDN ArchitectureEnvironment Configuration; Feature Configuration4Planned
Feature Configurationfeature-configuration.mdDelivery & InfrastructureConfigurationHighAdvanced16 minEnvironment Configuration; CDN ArchitectureEnvironment Configuration; Secrets Management4Planned
Deployment Strategies (canary, blue-green)deployment-strategies-canary-blue-green.mdDelivery & InfrastructureRelease ManagementHighAdvanced19 minEnvironment ConfigurationRollbacks & Kill Switches; Feature Flags; Progressive Delivery & Experiments4Planned
Rollbacks & Kill Switchesrollbacks-and-kill-switches.mdDelivery & InfrastructureRelease ManagementHighAdvanced16 minDeployment Strategies (canary, blue-green); Environment ConfigurationDeployment Strategies (canary, blue-green); Feature Flags; Progressive Delivery & Experiments4Planned
Feature Flagsfeature-flags.mdDelivery & InfrastructureRelease ManagementHighAdvanced16 minDeployment Strategies (canary, blue-green); Environment ConfigurationDeployment Strategies (canary, blue-green); Rollbacks & Kill Switches; Progressive Delivery & Experiments4Planned
Progressive Delivery & Experimentsprogressive-delivery-and-experiments.mdDelivery & InfrastructureRelease ManagementHighAdvanced19 minDeployment Strategies (canary, blue-green); Environment ConfigurationDeployment Strategies (canary, blue-green); Rollbacks & Kill Switches; Feature Flags4Planned
Scaling & Capacityscaling-and-capacity.mdDelivery & InfrastructureOperationsHighAdvanced16 minDeployment Strategies (canary, blue-green)Cost Optimization; Uptime & Health Checks4Planned
Cost Optimizationcost-optimization.mdDelivery & InfrastructureOperationsHighAdvanced16 minScaling & Capacity; Deployment Strategies (canary, blue-green)Scaling & Capacity; Uptime & Health Checks4Planned
Uptime & Health Checksuptime-and-health-checks.mdDelivery & InfrastructureOperationsHighAdvanced16 minScaling & Capacity; Deployment Strategies (canary, blue-green)Scaling & Capacity; Cost Optimization4Planned

Developer Experience & Workflow (23 articles · ~285 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Monorepo Architecturemonorepo-architecture.mdDeveloper Experience & WorkflowMonorepoHighIntermediate12 minThe Dependency Graph · Build Systems & Tooling; The Testing Pyramid/Trophy · Testing & QualityTask Orchestration & Pipelines; Workspace Dependency Graphs; Remote Caching & Affected Builds3Planned
Task Orchestration & Pipelinestask-orchestration-and-pipelines.mdDeveloper Experience & WorkflowMonorepoHighIntermediate15 minMonorepo ArchitectureMonorepo Architecture; Workspace Dependency Graphs; Remote Caching & Affected Builds3Planned
Workspace Dependency Graphsworkspace-dependency-graphs.mdDeveloper Experience & WorkflowMonorepoHighIntermediate15 minMonorepo ArchitectureMonorepo Architecture; Task Orchestration & Pipelines; Remote Caching & Affected Builds3Planned
Remote Caching & Affected Buildsremote-caching-and-affected-builds.mdDeveloper Experience & WorkflowMonorepoHighIntermediate15 minMonorepo ArchitectureMonorepo Architecture; Task Orchestration & Pipelines; Workspace Dependency Graphs3Planned
Lintinglinting.mdDeveloper Experience & WorkflowCode QualityHighIntermediate12 minMonorepo ArchitectureFormatting; Type Checking in CI3Planned
Formattingformatting.mdDeveloper Experience & WorkflowCode QualityHighIntermediate12 minLinting; Monorepo ArchitectureLinting; Type Checking in CI3Planned
Type Checking in CItype-checking-in-ci.mdDeveloper Experience & WorkflowCode QualityHighIntermediate12 minLinting; Monorepo ArchitectureLinting; Formatting3Planned
Fast Feedback Loopsfast-feedback-loops.mdDeveloper Experience & WorkflowLocal DevelopmentHighIntermediate12 minLintingEnvironment Consistency; Local Service Mocking3Planned
Environment Consistencyenvironment-consistency.mdDeveloper Experience & WorkflowLocal DevelopmentHighIntermediate12 minFast Feedback Loops; LintingFast Feedback Loops; Local Service Mocking3Planned
Local Service Mockinglocal-service-mocking.mdDeveloper Experience & WorkflowLocal DevelopmentHighIntermediate12 minFast Feedback Loops; LintingFast Feedback Loops; Environment Consistency3Planned
Browser DevToolsbrowser-devtools.mdDeveloper Experience & WorkflowDebuggingHighIntermediate12 minFast Feedback LoopsDebugging Techniques; Framework DevTools3Planned
Debugging Techniquesdebugging-techniques.mdDeveloper Experience & WorkflowDebuggingHighIntermediate12 minBrowser DevTools; Fast Feedback LoopsBrowser DevTools; Framework DevTools3Planned
Framework DevToolsframework-devtools.mdDeveloper Experience & WorkflowDebuggingHighIntermediate12 minBrowser DevTools; Fast Feedback LoopsBrowser DevTools; Debugging Techniques3Planned
Branching Modelsbranching-models.mdDeveloper Experience & WorkflowVersion ControlHighIntermediate12 minBrowser DevToolsCommit Conventions; PR & Review Tooling3Planned
Commit Conventionscommit-conventions.mdDeveloper Experience & WorkflowVersion ControlHighIntermediate12 minBranching Models; Browser DevToolsBranching Models; PR & Review Tooling3Planned
PR & Review Toolingpr-and-review-tooling.mdDeveloper Experience & WorkflowVersion ControlHighIntermediate12 minBranching Models; Browser DevToolsBranching Models; Commit Conventions3Planned
CI Pipeline Designci-pipeline-design.mdDeveloper Experience & WorkflowContinuous DeliveryHighIntermediate12 minBranching ModelsBuild & Test Automation; Deployment Automation; Pipeline Caching & Speed3Planned
Build & Test Automationbuild-and-test-automation.mdDeveloper Experience & WorkflowContinuous DeliveryHighIntermediate12 minCI Pipeline Design; Branching ModelsCI Pipeline Design; Deployment Automation; Pipeline Caching & Speed3Planned
Deployment Automationdeployment-automation.mdDeveloper Experience & WorkflowContinuous DeliveryHighIntermediate12 minCI Pipeline Design; Branching ModelsCI Pipeline Design; Build & Test Automation; Pipeline Caching & Speed3Planned
Pipeline Caching & Speedpipeline-caching-and-speed.mdDeveloper Experience & WorkflowContinuous DeliveryHighIntermediate12 minCI Pipeline Design; Branching ModelsCI Pipeline Design; Build & Test Automation; Deployment Automation3Planned
Codemods & Migrationscodemods-and-migrations.mdDeveloper Experience & WorkflowAutomationHighIntermediate12 minCI Pipeline DesignScaffolding & Generators; Git Hooks & Pre-commit3Planned
Scaffolding & Generatorsscaffolding-and-generators.mdDeveloper Experience & WorkflowAutomationHighIntermediate12 minCodemods & Migrations; CI Pipeline DesignCodemods & Migrations; Git Hooks & Pre-commit3Planned
Git Hooks & Pre-commitgit-hooks-and-pre-commit.mdDeveloper Experience & WorkflowAutomationHighIntermediate12 minCodemods & Migrations; CI Pipeline DesignCodemods & Migrations; Scaffolding & Generators3Planned

Package Architecture (13 articles · ~220 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Dependency Resolutiondependency-resolution.mdPackage ArchitecturePackage ManagementHighAdvanced16 minPrimitives & Wrappers · JavaScriptLockfiles & Determinism; Node Modules & Hoisting Models4Planned
Lockfiles & Determinismlockfiles-and-determinism.mdPackage ArchitecturePackage ManagementHighAdvanced16 minDependency ResolutionDependency Resolution; Node Modules & Hoisting Models4Planned
Node Modules & Hoisting Modelsnode-modules-and-hoisting-models.mdPackage ArchitecturePackage ManagementHighAdvanced19 minDependency ResolutionDependency Resolution; Lockfiles & Determinism4Planned
Exports Map & Entry Pointsexports-map-and-entry-points.mdPackage ArchitecturePackage DesignHighAdvanced16 minDependency ResolutionModule Formats (ESM/CJS/UMD); Conditional & Dual Exports; Types Distribution4Planned
Module Formats (ESM/CJS/UMD)module-formats-esm-cjs-umd.mdPackage ArchitecturePackage DesignHighAdvanced19 minExports Map & Entry Points; Dependency ResolutionExports Map & Entry Points; Conditional & Dual Exports; Types Distribution4Planned
Conditional & Dual Exportsconditional-and-dual-exports.mdPackage ArchitecturePackage DesignHighAdvanced16 minExports Map & Entry Points; Dependency ResolutionExports Map & Entry Points; Module Formats (ESM/CJS/UMD); Types Distribution4Planned
Types Distributiontypes-distribution.mdPackage ArchitecturePackage DesignHighAdvanced16 minExports Map & Entry Points; Dependency ResolutionExports Map & Entry Points; Module Formats (ESM/CJS/UMD); Conditional & Dual Exports4Planned
Semantic Versioningsemantic-versioning.mdPackage ArchitecturePublishingHighAdvanced16 minExports Map & Entry PointsRelease Automation & Changelogs; Provenance & Signing4Planned
Release Automation & Changelogsrelease-automation-and-changelogs.mdPackage ArchitecturePublishingHighAdvanced19 minSemantic Versioning; Exports Map & Entry PointsSemantic Versioning; Provenance & Signing4Planned
Provenance & Signingprovenance-and-signing.mdPackage ArchitecturePublishingHighAdvanced16 minSemantic Versioning; Exports Map & Entry PointsSemantic Versioning; Release Automation & Changelogs4Planned
Peer Dependenciespeer-dependencies.mdPackage ArchitectureDependency StrategyHighAdvanced16 minSemantic VersioningBundling vs Externalizing; Dependency Hygiene & Updates4Planned
Bundling vs Externalizingbundling-vs-externalizing.mdPackage ArchitectureDependency StrategyHighAdvanced16 minPeer Dependencies; Semantic VersioningPeer Dependencies; Dependency Hygiene & Updates4Planned
Dependency Hygiene & Updatesdependency-hygiene-and-updates.mdPackage ArchitectureDependency StrategyHighAdvanced19 minPeer Dependencies; Semantic VersioningPeer Dependencies; Bundling vs Externalizing4Planned

07 · Platform Reach · Priority: Medium · 45 articles

Graphics & Immersive (14 articles · ~283 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
The 2D Canvas Modelthe-2d-canvas-model.mdGraphics & ImmersiveCanvasMediumStaff20 minProcess & Thread Architecture · The Web Platform; Parsing & Bytecode · Runtime & ExecutionOffscreenCanvas; Text & Path Rendering1Planned
OffscreenCanvasoffscreencanvas.mdGraphics & ImmersiveCanvasMediumStaff20 minThe 2D Canvas ModelThe 2D Canvas Model; Text & Path Rendering1Planned
Text & Path Renderingtext-and-path-rendering.mdGraphics & ImmersiveCanvasMediumStaff20 minThe 2D Canvas ModelThe 2D Canvas Model; OffscreenCanvas1Planned
SVG Rendering & Scriptingsvg-rendering-and-scripting.mdGraphics & ImmersiveVectorMediumStaff20 minThe 2D Canvas ModelSVG Performance1Planned
SVG Performancesvg-performance.mdGraphics & ImmersiveVectorMediumStaff20 minSVG Rendering & Scripting; The 2D Canvas ModelSVG Rendering & Scripting1Planned
WebGL Fundamentalswebgl-fundamentals.mdGraphics & ImmersiveGPUMediumStaff20 minSVG Rendering & ScriptingWebGPU; Shaders & Pipelines1Planned
WebGPUwebgpu.mdGraphics & ImmersiveGPUMediumStaff20 minWebGL Fundamentals; SVG Rendering & ScriptingWebGL Fundamentals; Shaders & Pipelines1Planned
Shaders & Pipelinesshaders-and-pipelines.mdGraphics & ImmersiveGPUMediumStaff20 minWebGL Fundamentals; SVG Rendering & ScriptingWebGL Fundamentals; WebGPU1Planned
Data-Viz Rendering Modelsdata-viz-rendering-models.mdGraphics & ImmersiveVisualizationMediumStaff20 minWebGL FundamentalsCoordinate Systems & Scales; Large-Dataset Rendering1Planned
Coordinate Systems & Scalescoordinate-systems-and-scales.mdGraphics & ImmersiveVisualizationMediumStaff23 minData-Viz Rendering Models; WebGL FundamentalsData-Viz Rendering Models; Large-Dataset Rendering1Planned
Large-Dataset Renderinglarge-dataset-rendering.mdGraphics & ImmersiveVisualizationMediumStaff20 minData-Viz Rendering Models; WebGL FundamentalsData-Viz Rendering Models; Coordinate Systems & Scales1Planned
WebXRwebxr.mdGraphics & ImmersiveImmersiveMediumStaff20 minData-Viz Rendering ModelsSpatial Interaction; 3D Scene Models1Planned
Spatial Interactionspatial-interaction.mdGraphics & ImmersiveImmersiveMediumStaff20 minWebXR; Data-Viz Rendering ModelsWebXR; 3D Scene Models1Planned
3D Scene Models3d-scene-models.mdGraphics & ImmersiveImmersiveMediumStaff20 minWebXR; Data-Viz Rendering ModelsWebXR; Spatial Interaction1Planned

Internationalization & Localization (16 articles · ~265 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Locale Modeling & Negotiationlocale-modeling-and-negotiation.mdInternationalization & LocalizationLocaleMediumAdvanced19 minSpecificity · CSS & Visual Systems; Primitives & Wrappers · JavaScriptLanguage Detection4Planned
Language Detectionlanguage-detection.mdInternationalization & LocalizationLocaleMediumAdvanced16 minLocale Modeling & NegotiationLocale Modeling & Negotiation4Planned
Number, Date & Currency Formattingnumber-date-and-currency-formatting.mdInternationalization & LocalizationFormattingMediumAdvanced19 minLocale Modeling & NegotiationThe Intl API; Relative & Duration Formatting4Planned
The Intl APIthe-intl-api.mdInternationalization & LocalizationFormattingMediumAdvanced16 minNumber, Date & Currency Formatting; Locale Modeling & NegotiationNumber, Date & Currency Formatting; Relative & Duration Formatting4Planned
Relative & Duration Formattingrelative-and-duration-formatting.mdInternationalization & LocalizationFormattingMediumAdvanced19 minNumber, Date & Currency Formatting; Locale Modeling & NegotiationNumber, Date & Currency Formatting; The Intl API4Planned
Message Catalogsmessage-catalogs.mdInternationalization & LocalizationTranslationMediumAdvanced16 minNumber, Date & Currency FormattingTranslation Workflow & TMS; Interpolation & Rich Text4Planned
Translation Workflow & TMStranslation-workflow-and-tms.mdInternationalization & LocalizationTranslationMediumAdvanced16 minMessage Catalogs; Number, Date & Currency FormattingMessage Catalogs; Interpolation & Rich Text4Planned
Interpolation & Rich Textinterpolation-and-rich-text.mdInternationalization & LocalizationTranslationMediumAdvanced16 minMessage Catalogs; Number, Date & Currency FormattingMessage Catalogs; Translation Workflow & TMS4Planned
Pluralizationpluralization.mdInternationalization & LocalizationGrammarMediumAdvanced16 minMessage CatalogsGender & Select; Collation & Sorting4Planned
Gender & Selectgender-and-select.mdInternationalization & LocalizationGrammarMediumAdvanced16 minPluralization; Message CatalogsPluralization; Collation & Sorting4Planned
Collation & Sortingcollation-and-sorting.mdInternationalization & LocalizationGrammarMediumAdvanced16 minPluralization; Message CatalogsPluralization; Gender & Select4Planned
Bidirectional Text (RTL)bidirectional-text-rtl.mdInternationalization & LocalizationLayoutMediumAdvanced16 minPluralizationLogical Properties; Complex Scripts & Shaping4Planned
Logical Propertieslogical-properties.mdInternationalization & LocalizationLayoutMediumAdvanced16 minBidirectional Text (RTL); PluralizationBidirectional Text (RTL); Complex Scripts & Shaping4Planned
Complex Scripts & Shapingcomplex-scripts-and-shaping.mdInternationalization & LocalizationLayoutMediumAdvanced16 minBidirectional Text (RTL); PluralizationBidirectional Text (RTL); Logical Properties4Planned
Locale-Aware Routinglocale-aware-routing.mdInternationalization & LocalizationContentMediumAdvanced16 minBidirectional Text (RTL)Cultural Adaptation4Planned
Cultural Adaptationcultural-adaptation.mdInternationalization & LocalizationContentMediumAdvanced16 minLocale-Aware Routing; Bidirectional Text (RTL)Locale-Aware Routing4Planned

Progressive & Cross-Platform Web (15 articles · ~246 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
The Service Worker Lifecyclethe-service-worker-lifecycle.mdProgressive & Cross-Platform WebService WorkersMediumAdvanced19 minWeb Storage · Browser APIs; HTTP/1.1 Semantics · Networking & Protocols; Core Web Vitals (LCP, INP, CLS) · Performance EngineeringFetch Interception; Update & Activation Strategy4Planned
Fetch Interceptionfetch-interception.mdProgressive & Cross-Platform WebService WorkersMediumAdvanced16 minThe Service Worker LifecycleThe Service Worker Lifecycle; Update & Activation Strategy4Planned
Update & Activation Strategyupdate-and-activation-strategy.mdProgressive & Cross-Platform WebService WorkersMediumAdvanced19 minThe Service Worker LifecycleThe Service Worker Lifecycle; Fetch Interception4Planned
Runtime Caching Strategiesruntime-caching-strategies.mdProgressive & Cross-Platform WebOfflineMediumAdvanced16 minThe Service Worker LifecyclePrecaching & Offline Shell; Background Sync; Cache Versioning & Cleanup4Planned
Precaching & Offline Shellprecaching-and-offline-shell.mdProgressive & Cross-Platform WebOfflineMediumAdvanced16 minRuntime Caching Strategies; The Service Worker LifecycleRuntime Caching Strategies; Background Sync; Cache Versioning & Cleanup4Planned
Background Syncbackground-sync.mdProgressive & Cross-Platform WebOfflineMediumAdvanced16 minRuntime Caching Strategies; The Service Worker LifecycleRuntime Caching Strategies; Precaching & Offline Shell; Cache Versioning & Cleanup4Planned
Cache Versioning & Cleanupcache-versioning-and-cleanup.mdProgressive & Cross-Platform WebOfflineMediumAdvanced16 minRuntime Caching Strategies; The Service Worker LifecycleRuntime Caching Strategies; Precaching & Offline Shell; Background Sync4Planned
Web App Manifestweb-app-manifest.mdProgressive & Cross-Platform WebInstallabilityMediumAdvanced16 minRuntime Caching StrategiesInstall Prompts & Criteria; Standalone & Display Modes4Planned
Install Prompts & Criteriainstall-prompts-and-criteria.mdProgressive & Cross-Platform WebInstallabilityMediumAdvanced16 minWeb App Manifest; Runtime Caching StrategiesWeb App Manifest; Standalone & Display Modes4Planned
Standalone & Display Modesstandalone-and-display-modes.mdProgressive & Cross-Platform WebInstallabilityMediumAdvanced16 minWeb App Manifest; Runtime Caching StrategiesWeb App Manifest; Install Prompts & Criteria4Planned
Push Notificationspush-notifications.mdProgressive & Cross-Platform WebEngagementMediumAdvanced16 minWeb App ManifestBadging & Periodic Sync4Planned
Badging & Periodic Syncbadging-and-periodic-sync.mdProgressive & Cross-Platform WebEngagementMediumAdvanced16 minPush Notifications; Web App ManifestPush Notifications4Planned
Web Views & Hybrid Appsweb-views-and-hybrid-apps.mdProgressive & Cross-Platform WebNative BoundariesMediumAdvanced16 minPush NotificationsWrapper Models (Capacitor); Web-to-Native Bridges4Planned
Wrapper Models (Capacitor)wrapper-models-capacitor.mdProgressive & Cross-Platform WebNative BoundariesMediumAdvanced16 minWeb Views & Hybrid Apps; Push NotificationsWeb Views & Hybrid Apps; Web-to-Native Bridges4Planned
Web-to-Native Bridgesweb-to-native-bridges.mdProgressive & Cross-Platform WebNative BoundariesMediumAdvanced16 minWeb Views & Hybrid Apps; Push NotificationsWeb Views & Hybrid Apps; Wrapper Models (Capacitor)4Planned

08 · Craft & Leadership · Priority: High · 37 articles

Engineering Practices (20 articles · ~335 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Namingnaming.mdEngineering PracticesReadable CodeHighAdvanced16 minSeparation of Concerns · Frontend Architecture; The Testing Pyramid/Trophy · Testing & QualityFunction & Module Size; Comments & Intent1Planned
Function & Module Sizefunction-and-module-size.mdEngineering PracticesReadable CodeHighAdvanced16 minNamingNaming; Comments & Intent1Planned
Comments & Intentcomments-and-intent.mdEngineering PracticesReadable CodeHighAdvanced16 minNamingNaming; Function & Module Size1Planned
Refactoringrefactoring.mdEngineering PracticesChange & DebtHighAdvanced16 minNamingManaging Technical Debt; Legacy Code Strategy1Planned
Managing Technical Debtmanaging-technical-debt.mdEngineering PracticesChange & DebtHighAdvanced16 minRefactoring; NamingRefactoring; Legacy Code Strategy1Planned
Legacy Code Strategylegacy-code-strategy.mdEngineering PracticesChange & DebtHighAdvanced16 minRefactoring; NamingRefactoring; Managing Technical Debt1Planned
Abstraction & Leaky Abstractionsabstraction-and-leaky-abstractions.mdEngineering PracticesDesign PrinciplesHighAdvanced19 minRefactoringCoupling & Cohesion; SOLID for Frontend; YAGNI & Simplicity1Planned
Coupling & Cohesioncoupling-and-cohesion.mdEngineering PracticesDesign PrinciplesHighAdvanced16 minAbstraction & Leaky Abstractions; RefactoringAbstraction & Leaky Abstractions; SOLID for Frontend; YAGNI & Simplicity1Planned
SOLID for Frontendsolid-for-frontend.mdEngineering PracticesDesign PrinciplesHighAdvanced16 minAbstraction & Leaky Abstractions; RefactoringAbstraction & Leaky Abstractions; Coupling & Cohesion; YAGNI & Simplicity1Planned
YAGNI & Simplicityyagni-and-simplicity.mdEngineering PracticesDesign PrinciplesHighAdvanced16 minAbstraction & Leaky Abstractions; RefactoringAbstraction & Leaky Abstractions; Coupling & Cohesion; SOLID for Frontend1Planned
Code Review as a Disciplinecode-review-as-a-discipline.mdEngineering PracticesReviewHighAdvanced19 minAbstraction & Leaky AbstractionsGiving & Receiving Feedback1Planned
Giving & Receiving Feedbackgiving-and-receiving-feedback.mdEngineering PracticesReviewHighAdvanced19 minCode Review as a Discipline; Abstraction & Leaky AbstractionsCode Review as a Discipline1Planned
Error-Handling Philosophyerror-handling-philosophy.mdEngineering PracticesRobustnessHighAdvanced16 minCode Review as a DisciplineDefensive vs Offensive Programming; Graceful Degradation1Planned
Defensive vs Offensive Programmingdefensive-vs-offensive-programming.mdEngineering PracticesRobustnessHighAdvanced19 minError-Handling Philosophy; Code Review as a DisciplineError-Handling Philosophy; Graceful Degradation1Planned
Graceful Degradationgraceful-degradation.mdEngineering PracticesRobustnessHighAdvanced16 minError-Handling Philosophy; Code Review as a DisciplineError-Handling Philosophy; Defensive vs Offensive Programming1Planned
Documentation Practicesdocumentation-practices.mdEngineering PracticesKnowledgeHighAdvanced16 minError-Handling PhilosophyKnowledge Sharing & Bus Factor1Planned
Knowledge Sharing & Bus Factorknowledge-sharing-and-bus-factor.mdEngineering PracticesKnowledgeHighAdvanced19 minDocumentation Practices; Error-Handling PhilosophyDocumentation Practices1Planned
API & Interface Stabilityapi-and-interface-stability.mdEngineering PracticesInterfacesHighAdvanced16 minDocumentation PracticesBackward Compatibility; Deprecation Strategy1Planned
Backward Compatibilitybackward-compatibility.mdEngineering PracticesInterfacesHighAdvanced16 minAPI & Interface Stability; Documentation PracticesAPI & Interface Stability; Deprecation Strategy1Planned
Deprecation Strategydeprecation-strategy.mdEngineering PracticesInterfacesHighAdvanced16 minAPI & Interface Stability; Documentation PracticesAPI & Interface Stability; Backward Compatibility1Planned

Systems Thinking & Leadership (17 articles · ~364 min)

TitleSlugCategorySubcategoryPriorityDifficultyEst. Reading TimePrerequisitesRelated ArticlesExpected Code ExamplesStatus
Trade-off Analysistrade-off-analysis.mdSystems Thinking & LeadershipDecisionsHighStaff20 minSeparation of Concerns · Frontend Architecture; Naming · Engineering PracticesDecision-Making Under Uncertainty; Build vs Buy1Planned
Decision-Making Under Uncertaintydecision-making-under-uncertainty.mdSystems Thinking & LeadershipDecisionsHighStaff23 minTrade-off AnalysisTrade-off Analysis; Build vs Buy1Planned
Build vs Buybuild-vs-buy.mdSystems Thinking & LeadershipDecisionsHighStaff20 minTrade-off AnalysisTrade-off Analysis; Decision-Making Under Uncertainty1Planned
Technical Design & RFCstechnical-design-and-rfcs.mdSystems Thinking & LeadershipTechnical DirectionHighStaff20 minTrade-off AnalysisSetting Standards & Guardrails; Driving Consistency at Scale1Planned
Setting Standards & Guardrailssetting-standards-and-guardrails.mdSystems Thinking & LeadershipTechnical DirectionHighStaff23 minTechnical Design & RFCs; Trade-off AnalysisTechnical Design & RFCs; Driving Consistency at Scale1Planned
Driving Consistency at Scaledriving-consistency-at-scale.mdSystems Thinking & LeadershipTechnical DirectionHighStaff23 minTechnical Design & RFCs; Trade-off AnalysisTechnical Design & RFCs; Setting Standards & Guardrails1Planned
Estimationestimation.mdSystems Thinking & LeadershipPlanningHighStaff20 minTechnical Design & RFCsScoping & Slicing Work; Risk Management1Planned
Scoping & Slicing Workscoping-and-slicing-work.mdSystems Thinking & LeadershipPlanningHighStaff20 minEstimation; Technical Design & RFCsEstimation; Risk Management1Planned
Risk Managementrisk-management.mdSystems Thinking & LeadershipPlanningHighStaff20 minEstimation; Technical Design & RFCsEstimation; Scoping & Slicing Work1Planned
Cross-Functional Partnershipcross-functional-partnership.mdSystems Thinking & LeadershipCollaborationHighStaff23 minEstimationInfluence Without Authority; Communicating Technical Concepts1Planned
Influence Without Authorityinfluence-without-authority.mdSystems Thinking & LeadershipCollaborationHighStaff23 minCross-Functional Partnership; EstimationCross-Functional Partnership; Communicating Technical Concepts1Planned
Communicating Technical Conceptscommunicating-technical-concepts.mdSystems Thinking & LeadershipCollaborationHighStaff23 minCross-Functional Partnership; EstimationCross-Functional Partnership; Influence Without Authority1Planned
Mentorshipmentorship.mdSystems Thinking & LeadershipGrowthHighStaff20 minCross-Functional PartnershipTechnical Leadership Styles1Planned
Technical Leadership Stylestechnical-leadership-styles.mdSystems Thinking & LeadershipGrowthHighStaff23 minMentorship; Cross-Functional PartnershipMentorship1Planned
Evaluating Technologyevaluating-technology.mdSystems Thinking & LeadershipTechnology StrategyHighStaff20 minMentorshipAdoption & Migration Strategy; Innovation vs Stability1Planned
Adoption & Migration Strategyadoption-and-migration-strategy.mdSystems Thinking & LeadershipTechnology StrategyHighStaff23 minEvaluating Technology; MentorshipEvaluating Technology; Innovation vs Stability1Planned
Innovation vs Stabilityinnovation-vs-stability.mdSystems Thinking & LeadershipTechnology StrategyHighStaff20 minEvaluating Technology; MentorshipEvaluating Technology; Adoption & Migration Strategy1Planned

Peer-reviewed engineering decisions · MIT licensed