Your app is getting slower over time. Scroll position jumps. Tabs are consuming 800 MB of RAM. You open Task Manager and watch Chrome eat memory like it’s buffet day. Something is leaking — but where? The Chrome DevTools Memory tab is sitting right there, and most developers either ignore it or open it once, get confused by “Shallow Size” and “Retainers,” and quietly close it. This guide is for people who want to actually use it.
Your web app is probably doing things you’ve never actually debugged. Pages being prerendered before the user clicks anything, form submissions silently queued while offline, push notifications arriving at a sleeping service worker, sessions cryptographically bound to hardware keys — all of this happens through Chrome’s background service APIs, running completely invisibly. The Background Services panel in Chrome DevTools is where you finally get to watch all of it.
Finding the Panel Open DevTools (F12 or right-click > Inspect), go to the Application tab, and scroll the left sidebar until you hit the “Background Services” section. You’ll find a list covering essentially every “invisible” API Chrome supports:
Everyone conflates these three concepts. You see them mentioned together constantly, people use the words interchangeably, and most articles mix them up or bury the differences in jargon. Here’s what they actually are, why they’re different, and when to use them. [1]
Debouncing: Wait Until The Storm Passes Debouncing delays execution until after a period of inactivity.
Imagine someone typing into a search box. Every keystroke is an event. Without debouncing, you’d fire an API request with every single keystroke — character 1, character 2, character 3, and so on. That’s wasteful.