IntermediateTECHNICAL
Walk me through how you would diagnose and fix a production issue where a key page suddenly becomes very slow to load in modern browsers but works fine locally. What tools and steps would you use to identify the root cause on the frontend side?
Frontend Developer
General

Sample Answer

I’d start by reproducing the issue in production as closely as possible. First step is opening Chrome DevTools in an incognito window, hitting the page with disabled cache, and checking the Network and Performance tabs. I’m looking for sudden jumps in bundle size, long TTFB, or waterfall gaps that point to a blocking script or third-party tag. Next, I’d run a Lighthouse audit and compare against last week’s scores if we have them logged; at my last company we tracked these in Datadog and caught a 2.5s jump in LCP after a marketing script change. I’d also check the Coverage tab to see unused JS/CSS and the Performance/Memory panels for layout thrashing or leaks. Once I find the culprit—say a new analytics script blocking render—I’ll defer or lazy-load it, ship a small hotfix behind a feature flag, and verify improvement via RUM metrics. In a similar case we cut load time from 6s back down to ~2s and reduced JS bundle size by 30%.

Keywords

Use Chrome DevTools (Network, Performance, Coverage, Memory) and Lighthouse in production-like conditionsCompare current metrics against historical/RUM data to spot regressionsLook for blocking scripts, bundle bloat, layout thrashing, or third-party changesImplement targeted, reversible fixes (defer, lazy-load, code-split) and validate via monitoring