Namaste Frontend System Design is a comprehensive course by Akshay Saini Chirag Goel

• WebSockets for live events.
• Operational Transforms (OT) or CRDTs for conflict resolution. (You don't need to implement CRDTs, but you must know why they beat OT for latency).
• Debouncing & Throttling: A resize or scroll listener that fires once every 16ms (60fps) vs 100ms.
• Idempotency: If the user double-clicks "Save", the system shouldn't duplicate the request.

• Web Vitals: Deep dive into Core Web Vitals—LCP (Largest Contentful Paint), FID/INP (Input Delay), and CLS (Cumulative Layout Shift).
• Optimization Techniques:

  When asked to "Design a platform like YouTube or Facebook" from a frontend perspective, follow this flow: Requirements Clarification: Understand the user and scale.

  • Bundle Budget: max 200kb (gzipped) for initial JS.
  • Image Optimization: WebP/AVIF, lazy loading, responsive srcset.
  • Virtual Scrolling: For lists > 100 items (e.g., an infinite feed). Using react-window or a custom Intersection Observer.
  • Web Workers: Offload heavy computations (data sorting, image processing) to a separate thread so the UI never stutters.

  🙏 Closing thought

  Frontend system design is not about the perfect pattern — it’s about trade-offs made explicit and systems that evolve without pain. Respect the user, respect the next developer, and respect your future self debugging at 2 AM.