← Paths
🎨

Frontend Mastery

Rendering, performance, the browser, and modern UI architecture.

Curriculum · 326 lessons

01The Local and Session Storageintro3m02Event Bubbling and Capturingintro4m03The Critical Rendering Path Revisitedintro4m04The CSS Box Model Deep Diveintro4m05The Semantic HTML Elementsintro4m06Type Inference Basicsintro4m07The DOM and Reflowintro4m08The Box Model and Stacking Contextsintro4m09The Event Loop Microtasks and Macrotasksintro4m10Unit Testing Componentsintro4m11The Same Origin Policy Revisitedintro4m12The Component Lifecycle With Hooksintro4m13The Performance Budgetintro4m14The Client State vs Server Stateintro4m15The Client Side Renderingintro4m16The Browser Rendering Pipelineintro4m17The Fetch API and Abortintro4m18The Design Tokensintro4m19Client Side Routingintro4m20The Flux Architectureintro4m21The Intersection Observerintro4m22Debounce vs Throttleintro3m23Progressive Web Appsintro4m24Rendering Strategies: CSR, SSR, SSG, ISRintro6m25CSS Flexbox Alignment Deep Diveintro4m26Closures and Scopeintro4m27The Linter and Formatterintro4m28Margin Collapsing Explainedintro4m29The Data Fetching Libraries Patternintro4m30The Server Side Renderingintro4m31The DOM and CSSOMintro4m32The Memo and Pure Componentsintro4m33Nested Routesintro4m34XSS Reflected Stored And DOMintro5m35Custom Eventsintro4m36Render Blocking Resourcesintro4m37The Lighthouse Auditintro4m38The ARIA Landmarksintro4m39The Virtual DOMintro4m40requestAnimationFrameintro4m41CSS Custom Properties for Themingintro4m42CSS Grid Template Areasintro4m43The Testing Pyramid for Frontendintro4m44Cookie Security Flagsintro4m45The Dependency Array Pitfallsintro4m46The Static Site Generationintro4m47Testing Library Queriesintro4m48The Theming and Dark Modeintro4m49Cookie SameSite Deepintro5m50The Redux Core Conceptsintro5m51The Prototype Chainintro4m52The Position Propertyintro5m53The useMemo and useCallbackintro4m54Dynamic Route Paramsintro4m55Accessibility Basicsintro4m56ARIA Roles and Propertiesintro5m57The Shadow DOM and Web Componentsintro5m58Code Splitting and Dynamic Importintro4m59Local Storage vs Cookies Tradeoffsintro4m60The Custom Hook Patternintro4m61The Largest Contentful Paint Optimizationintro5m62The Global Store vs Local Stateintro4m63Mocking Network Requestsintro4m64Layout and Reflowintro5m65The IndexedDB Basicsintro5m66The Component Library Architectureintro5m67Secrets In Frontend Bundlesintro4m68The Skip To Content Linkintro4m69The Key Prop and Reconciliationintro4m70Internationalization and Localizationintro6m71The Skeleton and Loading Statescore4m72The URL as Statecore4m73Git Hooks Pre Commitcore4m74Debounce and Throttlecore4m75The Clipboard APIcore4m76Not Found Handlingcore4m77Clickjacking And Frame Ancestorscore5m78The Zustand Minimal Storecore4m79CSS Specificitycore4m80The Cumulative Layout Shift Fixescore5m81The Alt Text Guidelinescore5m82The Source Mapscore4m83Linting And Formattingcore4m84Type Guards and Narrowingcore4m85The Page Visibility APIcore3m86Responsive Image Optimizationcore6m87prefers color scheme and Dark Modecore5m88Lazy Loading with the loading Attributecore4m89Prefetching and Preloadingcore5m90Snapshot Testing Tradeoffscore4m91The Referrer Policycore4m92The Aspect Ratio Propertycore4m93The Time To First Bytecore4m94The Reduced Motion Preferencecore4m95The Stale While Revalidatecore4m96The Module Bundling Basicscore4m97Union and Intersection Typescore4m98The Geolocation APIcore4m99The Responsive Design Breakpointscore5m100Scroll Restorationcore4m101Sanitization Librariescore5m102The Rules of Hookscore4m103Tree Shakingcore5m104The Secure Context Requirementcore4m105Lifting State Upcore4m106The Font Display Swapcore4m107The Focus Visible Stylingcore4m108The Form State Managementcore5m109Type Checking In CIcore4m110Paint and Compositecore5m111Prototypes and Inheritancecore5m112The State Colocationcore4m113The CSS Modules Scopingcore4m114The Redux Toolkit Patternscore5m115Flexbox vs Gridcore4m116Web Font Loading Strategiescore5m117Controlled vs Uncontrolled Form Inputscore5m118Immutable Updatescore4m119This Binding Rulescore5m120Source Maps for Debuggingcore4m121The CSS Nestingcore4m122The Cache Invalidation in Query Libscore5m123Utility Types Pick Omit Partialcore4m124Lazy Loading Routescore5m125Subresource Integrity Deepcore5m126Iframe Sandboxcore5m127Right to Left Layoutscore5m128React Portalscore4m129The Interaction To Next Paintcore5m130The Bundle Analysiscore4m131Lazy Loading and Code Splittingcore4m132Finite State Machines for UIcore5m133Islands Architecturecore5m134Passive Event Listenerscore4m135The Cascade and Inheritancecore5m136Cache Control for Assetscore5m137WeakMap and Memorycore4m138Integration Testing the DOMcore5m139The Clickjacking Frame Protectioncore4m140Controlled vs Uncontrolled Revisitedcore5m141The Z Index And Stacking Contextcore5m142Image Lazy Loading And Prioritiescore5m143The Accessible Name Computationcore5m144The Derived State and Selectorscore5m145The Incremental Static Regenerationcore5m146Integration Testingcore5m147The requestAnimationFrame Loopcore5m148Generics in TypeScriptcore5m149The Virtualized Lists Windowingcore5m150The Utility First CSScore5m151Route Guards and Authcore5m152Content Security Policy Deepcore6m153The Redux Middleware Thunkscore5m154Focus Management and Keyboard Trapscore6m155Context vs Prop Drillingcore5m156Code Splitting By Routecore5m157The Form Labels And Errorscore5m158The Pagination and Infinite Scroll Datacore5m159Query Params Statecore5m160The Normalized State Shapecore5m161The Browser Event Loopcore5m162CSS Container Queriescore5m163React Error Boundariescore5m164CSS Transitions and Animationscore5m165State Normalization in Storescore5m166Promises and Async Patternscore5m167Mocking and Stubbing in Testscore5m168Content Security Policy For Frontendcore5m169The Compound Component Patterncore5m170The Resource Hints Preconnectcore4m171The Keyboard Navigation Ordercore5m172The Hydration and Partial Hydrationcore5m173Test Driven Development Frontendcore5m174Layer Promotioncore5m175The this Binding Rulescore5m176The Cache API Offlinecore5m177The Code Splitting React Lazycore5m178Route Transitionscore5m179CORS Preflight Deepcore6m180The MobX Observablescore5m181useMemo and useCallbackcore5m182Virtual Scrolling for Long Listscore5m183Refs and Imperative Handlescore5m184The Reducer Patterncore5m185Garbage Collection in the Browsercore5m186Transpilation and Polyfillscore5m187The Fetch Credentials Modecore4m188Flexbox Grow Shrink And Basiscore5m189The Color Contrast Requirementscore5m190The Optimistic Updatescore5m191The Tree Shakingcore4m192The History API Routingcore5m193The Drag and Dropcore5m194The Jotai Atomic Statecore5m195React Server Componentscore5m196The will change Property and GPU Layerscore5m197Modern Image Formats and srcsetcore5m198Service Worker Caching Strategiescore5m199End to End Testing Strategycore5m200Cross Site Scripting Defense In The Clientcore5m201The Render Props Patterncore5m202Prefetching On Hovercore4m203The Streaming SSRcore5m204End To End Testingcore5m205Microtask Timingcore5m206Discriminated Unionscore5m207The Service Worker Lifecyclecore5m208The Suspense Boundariescore5m209The CSS in JS Tradeoffscore5m210Data Loading on Navigationcore5m211CSRF Protection Deepcore6m212The Recoil Atoms Selectorscore5m213CSS Cascade Layerscore5m214Generators and Iteratorscore5m215The Dev Server and Hot Module Replacementcore5m216Sanitizing User HTMLcore5m217The Higher Order Componentcore5m218The Grid Auto Placementcore5m219The Code Splitting Strategiescore5m220The Profiling React DevToolscore5m221Web Workerscore5m222The will change Property and the Compositorcore5m223Derived State and Selectorscore5m224Tree Shaking and Dead Code Eliminationcore5m225The Avoiding Unnecessary Renderscore5m226The Gesture Handlingcore5m227PostMessage Securitycore5m228React Rendering and Reconciliationcore5m229The Typed Array and Array Buffercore5m230The Bundler and Module Graphcore5m231Subresource Integrity For Scriptscore4m232The Reducer With Contextcore5m233Clamp And Fluid Typographycore5m234The Screen Reader Live Regionscore5m235The Islands Architecturecore5m236The Event Loop and Renderingcore6m237The Web Sockets APIcore5m238Deep Linkingcore5m239The Redux Saga Effectscore6m240Suspense and Streamingcore5m241Signals Based Reactivitycore6m242The Fetch API and AbortControllercore5m243The CSS Custom Properties Cascadecore5m244Visual Regression Testingcore4m245The Context Splitting Performancecore5m246The XState State Machinescore6m247Optimistic UI Updatescore5m248The Module System ESM vs CJScore5m249Type Checking with TypeScriptcore5m250CORS From The Browser Sidecore5m251The Context Provider Performancecore5m252The Normalized Client Cachecore5m253The Animation Performancecore5m254Optimistic UI with Rollbackcore5m255The Suspense For Data Fetchingcore5m256Logical Properties For RTLcore5m257Content Security Policycore5m258The History API and Client Routingcore5m259The Push API Notificationscore6m260The Concurrent Renderingcore6m261The Web Share APIadvanced4m262The Resize Observeradvanced5m263The Error and Empty Statesadvanced5m264Event Delegationadvanced5m265The Temporal Dead Zoneadvanced4m266Environment Variables and Configadvanced5m267Reducing Main Thread Workadvanced5m268The Mutation Observeradvanced5m269Module Systems ESM and CJSadvanced5m270Service Workersadvanced6m271Accessibility Focus Orderadvanced5m272The Subgrid Featureadvanced5m273The Accessible Tooltipadvanced5m274The WebSocket State Syncadvanced6m275History Stack Managementadvanced6m276Micro Frontendsadvanced6m277Concurrent Rendering and Transitionsadvanced6m278Color Contrast and WCAGadvanced5m279Memoization Pitfallsadvanced5m280Structured Cloneadvanced5m281Feature Policy And Permissionsadvanced5m282The Error Boundary Fallbackadvanced5m283The Scroll Snapadvanced5m284The Accessible Modal Dialogadvanced6m285The Resumability Conceptadvanced6m286Storybook Component Devadvanced5m287The Web Crypto APIadvanced6m288The Optimistic UI Patternsadvanced6m289Redirects and Rewritesadvanced6m290Dependency Supply Chain Frontendadvanced6m291The Signals Reactivityadvanced6m292Server Side Rendering and Hydrationadvanced6m293CSS Containmentadvanced6m294The CI Pipeline for Frontendadvanced6m295The Long Task Breakupadvanced5m296Mapped Typesadvanced5m297The Transitions and Deferred Valuesadvanced6m298The Broadcast Channeladvanced4m299The Container Queries Revisitedadvanced5m300The Render As You Fetch Patternadvanced6m301Optimistic Concurrency in UIsadvanced6m302The prefers reduced motion Queryadvanced4m303List Virtualizationadvanced5m304The Key Prop And List Reconciliationadvanced5m305The Accessible Data Tableadvanced6m306The Offline First and Syncadvanced6m307The Build Cache and Incremental Buildsadvanced6m308Accessibility Testing Automatedadvanced5m309Web Workers Offloadingadvanced6m310Conditional Typesadvanced5m311The Virtualization Deep Diveadvanced6m312Prefetching Routesadvanced6m313Trusted Types Deepadvanced6m314The Immutability And Structural Sharingadvanced6m315The Ref Forwarding Patternadvanced5m316Layout Thrashing and Batchingadvanced6m317Trusted Types APIadvanced5m318The Memory Leak Detectionadvanced6m319The React Compiler Memoizationadvanced6m320The Selector Memoization Deepadvanced6m321The Web Vitals LCP CLS and INPadvanced5m322Performance Testing In CIadvanced5m323Secure Auth Token Storageadvanced6m324The Event Sourcing on the Clientadvanced6m325The OffscreenCanvasadvanced6m326The Lazy Hydration Patternsadvanced6m