Performance & Network

Network Throttling

Simulate real-world network conditions using precise, Service Worker-based throttling profiles to test performance under realistic constraints.

Overview

Real-World Network Simulation

Your application may perform beautifully on a developer's 1Gbps office network. But what does a user in a rural area on a 3G connection experience? The Network Throttling panel uses a Service Worker to intercept proxy requests and inject precisely calibrated delays and bandwidth caps that reflect actual, measured real-world network conditions.

  • Fast 4G / LTE: ~50 Mbps, ~20ms RTT — The best mobile experience.
  • Slow 4G: ~4 Mbps, ~100ms RTT — Average LTE coverage in mixed urban/suburban areas.
  • Fast 3G: ~1.5 Mbps, ~150ms RTT — Still common in many regions globally.
  • Slow 3G: ~400 Kbps, ~400ms RTT — Rural or weak signal areas where many users live.
  • Edge / 2G: Very limited bandwidth and very high latency — the critical test for global reach.
  • Offline: Completely blocks all network requests — ideal for testing Service Worker offline fallbacks and PWA behavior.
  • Custom Profile: Define a custom profile with exact download Kbps and RTT delay values for specific testing scenarios.
Workflow

Testing Under Slow Network Conditions

  1. 1

    Open the Network panel

    Click the WiFi/signal icon in the left rail.

  2. 2

    Select a throttling profile

    Click the "Slow 3G" profile card. The active profile is visually highlighted with its color accent.

  3. 3

    Reload the preview frames

    The throttling takes effect on subsequent requests. Click the reload button to load the page fresh under the new constraints.

  4. 4

    Observe the experience

    Watch how long images, fonts, and scripts take to load. Does your loading skeleton appear? Does the page render in a reasonable time? Is the layout stable during loading (no CLS)?

  5. 5

    Remove throttling

    Select "No Throttling" to return to full-speed browsing.

Pro Tips
💡
Combine with the Network Waterfall Load the page under "Slow 3G" and then open the Waterfall panel. Resources that are wide in the waterfall (long load time) on slow networks are your primary optimization targets. These are costing your real users seconds of wait time.
💡
Test PWA offline behavior Switch to "Offline" mode to verify your Service Worker caches the critical resources for offline use. If the app breaks completely, your users without a connection will see a browser error page instead of your offline fallback.