A.ArticoteAn Article-Style Note
  • HTML4
    • DOM Render Pipeline: From HTML String to Pixels on Screen
    • Resource Hints
    • async & defer
    • Semantic HTML tags
  • CSS4
    • Building component-level responsive design with Container Queries
    • CSS Architecture Strategies: From BEM to Tailwind CSS and UnoCSS
    • Why top/left animations stutter but transform/opacity stay silky smooth
    • CSS Specificity and the Cascade: Who Actually Wins?
  • JavaScript6
    • JavaScript's this: who is it actually pointing at?
    • A Mental Model for the JavaScript Event Loop
    • A Complete Guide to Promises and Async/Await
    • Understanding JavaScript Closures: Why Can a Function Remember Outer Variables?
    • Hoisting: What's Actually Getting Hoisted
    • var vs let vs const: Which One Should You Actually Use?
  • TypeScript4
    • Teaching TypeScript to Read Your Mind: Type Narrowing and Type Guards
    • Conditional Types and Template Literal Types: Making TypeScript Compute Your Types
    • Generics 101: Reusable Functions and Types Without Sacrificing Type Safety
    • TypeScript's interface vs. type: What's Actually Different?
  • React3
    • React State Management: Context, Props, or an External Store?
    • Rendering and Performance: When to Reach for useMemo, useCallback, and React.memo
    • React Hooks Fundamentals: useState and the useEffect Dependency Array
  • Vue4
    • Vue's Virtual DOM and Diff Algorithm: How PatchFlags and Static Hoisting Speed Up Rendering
    • Vue Component Communication: When to Use props, emit, provide/inject, and Store
    • Vue 3 Reactivity: Why Proxy Replaced Object.defineProperty
    • ref vs. reactive: The Difference, the Internals, and When to Use Each
  • Design Pattern7
    • Strategy: Pulling Algorithms Out So Behavior Stays Swappable
    • Mediator: Untangling Communication Between Objects
    • Observer: Subscriptions and State-Change Notifications
    • Decorator: Extending an Object's Behavior at Runtime Without Touching Its Class
    • Facade: Hiding Complex Subsystems Behind One Unified Interface
    • Factory: Encapsulating and Abstracting Object Creation
    • Singleton: Guaranteeing One Global Instance, and What It Costs You
  • Performance4
    • Slimming Down Your Bundle: Tree-Shaking, Code Splitting, and Bundle Analysis
    • Rendering Long Lists: Why Thousands of Rows Feel Slow, and How Virtualization Works
    • Core Web Vitals: What Drives LCP, INP, and CLS, and How to Fix Them
    • Debounce, Throttle, and requestAnimationFrame
  • Web7
    • From URL to Pixels: What Really Happens Behind the Scenes
    • Browser Caching Strategies Explained: Cache-Control, ETag, and Service Worker
    • CSR vs. SSR vs. SSG: How Rendering Strategies Really Differ
    • CSP: Building the Browser's Last Line of Defense with Content Security Policy
    • XSS: Cross-Site Scripting in the Browser
    • CSRF: How Cross-Site Request Forgery Actually Works
    • CORS: The Browser's Cross-Origin Resource Sharing Mechanism
  • System Design6
    • Sharding: How Databases Scale Horizontally
    • Caching: Put Data Closer, Get Speed — and New Problems
    • Replication: Copying Your Database, Without Sacrificing Performance or Consistency
    • Scalability: How a System Goes From Falling Over to Getting Sturdier as It Grows
    • Idempotency: Why Retrying an API Call Should Not Break Things
    • The CAP Theorem — Why Distributed Systems Can't Have It All
  • AWS7
    • Cloud Infrastructure: Building a Three-Tier Architecture with EC2, S3, and RDS
    • AWS Networking Services: How Do VPC, Security Group, NACL, ELB, and Route 53 Divide the Work?
    • AWS Management Tools: How CloudWatch, CloudTrail, Config, CloudFormation, and EventBridge Divide the Work
    • AWS Security Services: How Do IAM, Secrets Manager, KMS, ACM, WAF, Shield, and Cognito Divide the Work?
    • AWS Database Services: How Do You Choose Between RDS, Aurora, DynamoDB, and Neptune?
    • AWS Storage Services: How Do You Choose Between S3, EBS, EFS, Snow Family, FSx, and Storage Gateway?
    • AWS Compute Services: How Do You Choose Between EC2, ECS, EKS, and Lambda?
  • Docker4
    • From Docker to Production: Multi-Stage Builds, Slim Images, and Security Best Practices
    • Docker Compose in Practice: Networks, Volumes, and Environment Variables
    • Docker Layers and Build Cache: How to Write a Dockerfile That Doesn't Rebuild Everything Every Time
    • How Docker actually works under the hood: namespaces, cgroups, and union filesystems
  • Kubernetes1
    • Kubernetes Under the Hood: How the Control Plane and Node Components Split the Work
  1. Performance

Performance

4 posts

6/16/2026

Slimming Down Your Bundle: Tree-Shaking, Code Splitting, and Bundle Analysis

Measure first, optimize second. We'll look at why tree-shaking sometimes silently fails, where code splitting actually pays off, and how to use analysis tools to find the dependencies that are really weighing you down.

6/19/2025

Rendering Long Lists: Why Thousands of Rows Feel Slow, and How Virtualization Works

Start with what too many DOM nodes actually cost in style, layout, paint, and memory, then see how windowing (virtualization) renders only what's visible, and build a fixed-height virtual list yourself.

1/31/2025

Core Web Vitals: What Drives LCP, INP, and CLS, and How to Fix Them

Starting from the gap between Lighthouse and CrUX numbers, we'll look at where LCP, INP, and CLS each get stuck, and what to do about it.

12/12/2024

Debounce, Throttle, and requestAnimationFrame

Find out why scroll, resize, input, and mousemove can drag down performance, and learn when to reach for debounce, throttle, or requestAnimationFrame, and how to implement each one.