• Home
  • Learn
  • Feed
  • Ladder
  • Saved
← Paths
🎨

Frontend Mastery

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

Curriculum · 344 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 DOMintro5m35The CSS Box Modelintro4m36Custom Eventsintro4m37Render Blocking Resourcesintro4m38The Lighthouse Auditintro4m39The ARIA Landmarksintro4m40The Virtual DOMintro4m41requestAnimationFrameintro4m42CSS Custom Properties for Themingintro4m43CSS Grid Template Areasintro4m44The Testing Pyramid for Frontendintro4m45Cookie Security Flagsintro4m46The Dependency Array Pitfallsintro4m47The Static Site Generationintro4m48Testing Library Queriesintro4m49The Theming and Dark Modeintro4m50Cookie SameSite Deepintro5m51The Redux Core Conceptsintro5m52Lazy Loading Imagesintro3m53The Prototype Chainintro4m54The Position Propertyintro5m55The useMemo and useCallbackintro4m56Dynamic Route Paramsintro4m57Accessibility Basicsintro4m58ARIA Roles and Propertiesintro5m59The Shadow DOM and Web Componentsintro5m60Code Splitting and Dynamic Importintro4m61Local Storage vs Cookies Tradeoffsintro4m62The Custom Hook Patternintro4m63The Largest Contentful Paint Optimizationintro5m64The Global Store vs Local Stateintro4m65Mocking Network Requestsintro4m66Layout and Reflowintro5m67The IndexedDB Basicsintro5m68The Component Library Architectureintro5m69Secrets In Frontend Bundlesintro4m70The Skip To Content Linkintro4m71The Key Prop and Reconciliationintro4m72Progressive Enhancementintro4m73Internationalization and Localizationintro6m74The Critical Rendering Pathintro5m75Browser Storage Localstorage and Cookiesintro5m76The Skeleton and Loading Statescore4m77The URL as Statecore4m78Git Hooks Pre Commitcore4m79Debounce and Throttlecore4m80The Clipboard APIcore4m81Not Found Handlingcore4m82Clickjacking And Frame Ancestorscore5m83The Zustand Minimal Storecore4m84Focus Managementcore4m85CSS Specificitycore4m86The Cumulative Layout Shift Fixescore5m87The Alt Text Guidelinescore5m88The Source Mapscore4m89Linting And Formattingcore4m90Type Guards and Narrowingcore4m91The Page Visibility APIcore3m92Responsive Image Optimizationcore6m93prefers color scheme and Dark Modecore5m94Lazy Loading with the loading Attributecore4m95Prefetching and Preloadingcore5m96Snapshot Testing Tradeoffscore4m97The Referrer Policycore4m98The Aspect Ratio Propertycore4m99The Time To First Bytecore4m100The Reduced Motion Preferencecore4m101The Stale While Revalidatecore4m102The Module Bundling Basicscore4m103Union and Intersection Typescore4m104The Geolocation APIcore4m105The Responsive Design Breakpointscore5m106Scroll Restorationcore4m107Sanitization Librariescore5m108Responsive Images With Srcsetcore4m109The Rules of Hookscore4m110Tree Shakingcore5m111The Secure Context Requirementcore4m112Lifting State Upcore4m113The Font Display Swapcore4m114The Focus Visible Stylingcore4m115The Form State Managementcore5m116Type Checking In CIcore4m117Paint and Compositecore5m118Prototypes and Inheritancecore5m119The State Colocationcore4m120The CSS Modules Scopingcore4m121The Redux Toolkit Patternscore5m122Flexbox vs Gridcore4m123Web Font Loading Strategiescore5m124Controlled vs Uncontrolled Form Inputscore5m125Immutable Updatescore4m126This Binding Rulescore5m127Source Maps for Debuggingcore4m128The CSS Nestingcore4m129The Cache Invalidation in Query Libscore5m130Utility Types Pick Omit Partialcore4m131Lazy Loading Routescore5m132Subresource Integrity Deepcore5m133Iframe Sandboxcore5m134Controlled vs Uncontrolled Inputscore4m135Right to Left Layoutscore5m136React Portalscore4m137The Interaction To Next Paintcore5m138The Bundle Analysiscore4m139Lazy Loading and Code Splittingcore4m140Finite State Machines for UIcore5m141Islands Architecturecore5m142Passive Event Listenerscore4m143The Cascade and Inheritancecore5m144Cache Control for Assetscore5m145WeakMap and Memorycore4m146Integration Testing the DOMcore5m147The Clickjacking Frame Protectioncore4m148Controlled vs Uncontrolled Revisitedcore5m149The Z Index And Stacking Contextcore5m150Image Lazy Loading And Prioritiescore5m151The Accessible Name Computationcore5m152The Derived State and Selectorscore5m153The Incremental Static Regenerationcore5m154Integration Testingcore5m155The requestAnimationFrame Loopcore5m156Generics in TypeScriptcore5m157The Virtualized Lists Windowingcore5m158The Utility First CSScore5m159Route Guards and Authcore5m160Content Security Policy Deepcore6m161The Redux Middleware Thunkscore5m162Resource Hints Preload and Prefetchcore4m163Focus Management and Keyboard Trapscore6m164Context vs Prop Drillingcore5m165Code Splitting By Routecore5m166The Form Labels And Errorscore5m167The Pagination and Infinite Scroll Datacore5m168Query Params Statecore5m169The Normalized State Shapecore5m170The Browser Event Loopcore5m171CSS Container Queriescore5m172React Error Boundariescore5m173CSS Transitions and Animationscore5m174State Normalization in Storescore5m175Promises and Async Patternscore5m176Mocking and Stubbing in Testscore5m177Content Security Policy For Frontendcore5m178The Compound Component Patterncore5m179The Resource Hints Preconnectcore4m180The Keyboard Navigation Ordercore5m181The Hydration and Partial Hydrationcore5m182Test Driven Development Frontendcore5m183Layer Promotioncore5m184The this Binding Rulescore5m185The Cache API Offlinecore5m186The Code Splitting React Lazycore5m187Route Transitionscore5m188CORS Preflight Deepcore6m189The MobX Observablescore5m190Core Web Vitalscore5m191useMemo and useCallbackcore5m192Virtual Scrolling for Long Listscore5m193Refs and Imperative Handlescore5m194The Reducer Patterncore5m195Garbage Collection in the Browsercore5m196Transpilation and Polyfillscore5m197The Fetch Credentials Modecore4m198Flexbox Grow Shrink And Basiscore5m199The Color Contrast Requirementscore5m200The Optimistic Updatescore5m201The Tree Shakingcore4m202The History API Routingcore5m203The Drag and Dropcore5m204The Jotai Atomic Statecore5m205React Server Componentscore5m206The will change Property and GPU Layerscore5m207Modern Image Formats and srcsetcore5m208Service Worker Caching Strategiescore5m209End to End Testing Strategycore5m210Cross Site Scripting Defense In The Clientcore5m211The Render Props Patterncore5m212Prefetching On Hovercore4m213The Streaming SSRcore5m214End To End Testingcore5m215Microtask Timingcore5m216Discriminated Unionscore5m217The Service Worker Lifecyclecore5m218The Suspense Boundariescore5m219The CSS in JS Tradeoffscore5m220Data Loading on Navigationcore5m221CSRF Protection Deepcore6m222The Recoil Atoms Selectorscore5m223Rendering Strategies CSR SSR and SSGcore5m224CSS Cascade Layerscore5m225Generators and Iteratorscore5m226The Dev Server and Hot Module Replacementcore5m227Sanitizing User HTMLcore5m228The Higher Order Componentcore5m229The Grid Auto Placementcore5m230The Code Splitting Strategiescore5m231The Profiling React DevToolscore5m232Web Workerscore5m233The will change Property and the Compositorcore5m234Derived State and Selectorscore5m235Tree Shaking and Dead Code Eliminationcore5m236The Avoiding Unnecessary Renderscore5m237The Gesture Handlingcore5m238PostMessage Securitycore5m239React Rendering and Reconciliationcore5m240The Typed Array and Array Buffercore5m241The Bundler and Module Graphcore5m242Subresource Integrity For Scriptscore4m243The Reducer With Contextcore5m244Clamp And Fluid Typographycore5m245The Screen Reader Live Regionscore5m246The Islands Architecturecore5m247The Event Loop and Renderingcore6m248The Web Sockets APIcore5m249Deep Linkingcore5m250The Redux Saga Effectscore6m251Suspense and Streamingcore5m252Signals Based Reactivitycore6m253The Fetch API and AbortControllercore5m254The CSS Custom Properties Cascadecore5m255Visual Regression Testingcore4m256The Context Splitting Performancecore5m257The XState State Machinescore6m258The useEffect Dependency Arraycore5m259Optimistic UI Updatescore5m260The Module System ESM vs CJScore5m261Type Checking with TypeScriptcore5m262CORS From The Browser Sidecore5m263The Context Provider Performancecore5m264The Normalized Client Cachecore5m265The Animation Performancecore5m266Optimistic UI with Rollbackcore5m267Stacking Context and Z Indexcore5m268The Suspense For Data Fetchingcore5m269Logical Properties For RTLcore5m270Content Security Policycore5m271The History API and Client Routingcore5m272The Push API Notificationscore6m273Memoization in Reactcore5m274The Concurrent Renderingcore6m275Bundlers and Module Federationadvanced5m276CORS Preflight From the Browseradvanced5m277Incremental Static Regenerationadvanced5m278The Web Share APIadvanced4m279Service Workers and Offline Cachingadvanced6m280The Resize Observeradvanced5m281The Error and Empty Statesadvanced5m282Event Delegationadvanced5m283The Temporal Dead Zoneadvanced4m284Environment Variables and Configadvanced5m285Reducing Main Thread Workadvanced5m286The Mutation Observeradvanced5m287Module Systems ESM and CJSadvanced5m288Service Workersadvanced6m289Accessibility Focus Orderadvanced5m290The Subgrid Featureadvanced5m291The Accessible Tooltipadvanced5m292The WebSocket State Syncadvanced6m293History Stack Managementadvanced6m294Micro Frontendsadvanced6m295Concurrent Rendering and Transitionsadvanced6m296Color Contrast and WCAGadvanced5m297Memoization Pitfallsadvanced5m298Structured Cloneadvanced5m299Feature Policy And Permissionsadvanced5m300The Error Boundary Fallbackadvanced5m301The Scroll Snapadvanced5m302The Accessible Modal Dialogadvanced6m303The Resumability Conceptadvanced6m304Storybook Component Devadvanced5m305The Web Crypto APIadvanced6m306The Optimistic UI Patternsadvanced6m307Redirects and Rewritesadvanced6m308Dependency Supply Chain Frontendadvanced6m309The Signals Reactivityadvanced6m310Server Side Rendering and Hydrationadvanced6m311CSS Containmentadvanced6m312The CI Pipeline for Frontendadvanced6m313The Long Task Breakupadvanced5m314Mapped Typesadvanced5m315The Transitions and Deferred Valuesadvanced6m316The Broadcast Channeladvanced4m317The Container Queries Revisitedadvanced5m318The Render As You Fetch Patternadvanced6m319Optimistic Concurrency in UIsadvanced6m320The prefers reduced motion Queryadvanced4m321List Virtualizationadvanced5m322The Key Prop And List Reconciliationadvanced5m323The Accessible Data Tableadvanced6m324The Offline First and Syncadvanced6m325The Build Cache and Incremental Buildsadvanced6m326Accessibility Testing Automatedadvanced5m327Web Workers Offloadingadvanced6m328Conditional Typesadvanced5m329The Virtualization Deep Diveadvanced6m330Prefetching Routesadvanced6m331Trusted Types Deepadvanced6m332The Immutability And Structural Sharingadvanced6m333The Ref Forwarding Patternadvanced5m334Layout Thrashing and Batchingadvanced6m335Trusted Types APIadvanced5m336The Memory Leak Detectionadvanced6m337The React Compiler Memoizationadvanced6m338The Selector Memoization Deepadvanced6m339The Web Vitals LCP CLS and INPadvanced5m340Performance Testing In CIadvanced5m341Secure Auth Token Storageadvanced6m342The Event Sourcing on the Clientadvanced6m343The OffscreenCanvasadvanced6m344The Lazy Hydration Patternsadvanced6m