Users report that your single-page app becomes slow and crashes after being open for a few hours. How do you investigate and fix it?
What the interviewer wants to hear
- Reproduce with a repeatable scenario and watch memory in the Performance monitor
- Compare heap snapshots before and after repeating an action to find growing objects
- Look at retainers to find what keeps detached DOM nodes or large objects alive
- Typical causes: missing effect cleanups, global listeners, timers, unbounded caches, third-party widgets
- Fix, add guards such as cache limits, and monitor memory or long tasks in production
Model answer
First I try to turn the report into a repeatable scenario, such as opening and closing a page twenty times, while watching the JS heap and DOM node count in the Performance monitor. If memory keeps climbing after garbage collection, it is a leak, not normal usage. I take a heap snapshot, repeat the action several times, take another, and use the comparison view to see which objects keep growing, often detached DOM elements or large arrays. The retainers panel shows the chain of references keeping them alive, which usually points to the cause: an effect without cleanup, a window or socket listener never removed, an interval still running, a module-level cache with no limit, or a chart or map widget that was never destroyed. I fix the root cause, add limits like an LRU cache size, and write a regression check if possible. In production I track long tasks and errors through RUM so we spot similar issues early.
Can you answer it under time pressure?
Take a timed hard round and get scored on every answer.
More hard Frontend Developer questions
- How would you design and build a shared component library (design system) used by several product teams?
- A page must show a table with 50,000 rows and stay smooth while scrolling and filtering. How would you build it?
- What are the main security risks for a frontend application and how do you protect against them?
- Your company wants to split a large frontend into micro-frontends. What are the trade-offs and how would you approach it?
- What are React Server Components, and how do they change the way you build a React app?
- How would you design a web app that keeps working offline, for example for field workers with poor connectivity?
- You join a team with a large JavaScript React codebase. How would you migrate it to TypeScript without stopping feature work?
- How would you build the frontend for a real-time feature like a shared task board where many users edit at the same time?
- How do you know your frontend is healthy in production? Describe the monitoring you would set up.