Fix the design · Incident triage

Checkout Bundle Bloat: The Page That Froze on Black Friday

During Myntra’s End of Reason Sale, a 4.2MB JavaScript checkout bundle pushed time-to-interactive to about 14 seconds on mid-tier phones and raised abandonment about 31% while the payment API stayed healthy.

You are on Myntra’s checkout team during End of Reason Sale. Checkout ships a 4.2MB JavaScript bundle. On mid-tier phones, users wait about 14 seconds before the page responds.

We need your help. Identify the bottlenecks and failure modes in the current design, then redesign the path from “open checkout” → “Pay is tappable” so only payment code is on the critical path, third-party scripts cannot freeze the main thread, and abandonment drops even when the payment API is healthy.

Problem

Redesign Myntra’s existing checkout page load path — it already ships one shared JavaScript bundle that includes pay, admin, fraud, and third-party scripts.

Incident summary

  • Checkout traffic rose from about 800 to about 2,400 requests per minute.
  • The main JavaScript bundle grew to about 4.2MB transferred.
  • Time to Interactive reached about 14.2s on mid-tier phones.
  • Long tasks blocked the pay button for about 9s on average.
  • Checkout abandonment rose about 31% hour-over-hour while the payment API stayed healthy.

Assumptions made by the team

  • One shared vendor chunk is simpler to cache and is fast enough.
  • Lazy routes are enough — the shared layout adds little JavaScript.
  • Third-party scripts marked async cannot block the page.
  • Shoppers on sale day all have flagship phones.
  • More API replicas will fix checkout abandonment.

Impacted services

  • Checkout page (critical) — Took about 14 seconds to respond on mid-tier phones.
  • Main JS bundle (critical) — About 4.2MB transferred on the critical path.
  • Pay button (critical) — Blocked by long tasks for about 9 seconds on average.
  • Payment API (healthy) — Stayed fast — the problem was the frontend, not payments.
  • Customers (critical) — Abandonment rose about 31% hour-over-hour.

Triage questions

  1. Why did a large JavaScript bundle make checkout unresponsive on mobile during peak traffic?
  2. How would you redesign checkout so admin and fraud code are not on the critical path?
  3. Why did server and API alerts stay quiet while cart abandonment jumped 31%?
  4. How would you load fraud checks without blocking the user from tapping Pay?

← All design challenges

Loading scenario…