JavaScript · Memory Management · Tech Lead · Architecture
How would you set and enforce a client-side memory budget for a complex SPA?
Short Interview Answer
Define per-route/device budgets, measure in RUM/lab, enforce cache limits, dispose on navigation, and gate PRs that add heavy retained structures.
Detailed Explanation
Establish budgets (e.g. JS heap after critical flows on mid-tier mobiles). Instrument: `performance.memory` where available, custom metrics for cache sizes, detached node counts in tests. Architecture: virtualize long lists, paginate, evict LRU caches, prefer WeakMap for element metadata, kill workers when idle, avoid retaining entire API responses. Process: memory regression tests in CI for key journeys; review large static data imports; educate on closures/listeners. Trade-offs: aggressive eviction increases network cost — balance with offline needs. Lead responsibility includes choosing which features degrade first under pressure.
Interview Tip
Combine technical limits with process/CI enforcement.
Common Mistake
Unlimited in-memory client caches 'for performance' without eviction.