New Hack: Process Monitor for Google Chrome with icon graphing CPU usage

Update: 30th Nov 2013 — Now requires the Chrome dev channel, but available for install through the Chrome Web Store.

Use Google Chrome? Ever suffer from any of the following:

• Chrome slowing to a crawl?
• Tabs freezing up?
• Your computer’s fan whirring like crazy/laptop heating up?

Particular sites like Gmail and Facebook, and plugins like Gmail Offline are particularly susceptible to maxing out Chrome’s CPU and memory.

Chrome has a Task Manager that’s all well and good, but I wanted a good way to monitor CPU usage during normal use in order to quickly identify when a tab or plugin starts misbehaving.

A search didn’t throw up anything suitable, so I decided to take on the challenge of creating a browser extension to do the job. Without further ado, here’s some screenshots:

You get:

1. An icon in your address bar with current CPU usage and animated graph so you can easily detect when something within Chrome is causing an issue:

2. A detailed popup with list of all processes sorted by CPU or memory usage, historic CPU graphs, and actions to reload or shut down misbehaving processes:

Installation Instructions

The extension utilises some experimental Chrome APIs for accessing and managing processes.

Update: 30th Nov 2013 — The Chrome process APIs have been updated and now require downloading and installing the dev channel version of the Chrome browser.

On the plus side, once you’ve installed the dev channel version of Chrome, you can now install the extension through the Chrome Web Store.

Unfortunately this means it can’t (yet) be distributed through the Chrome Web Store — you need to install it manually. Luckily, this isn’t difficult — and only takes a minute:

1. Enable the experimental APIs
2. Start Google Chrome
3. Open up chrome://flags (copy and paste into a new tab)
4. Search for “Experimental Extension APIs” and enable
5. Relaunch Chrome for this to take effect (use the Relaunch button that appears at the bottom of the screen and all your open tabs will be preserved)
6. Install the extension
7. Download the source (.zip) and unzip.
8. Open chrome://extensions (copy and paste into a new tab) or select Tools > Extensions from the Chrome menu
9. Ensure the “Developer mode” box at the top of the page is ticked, and click the “Load unpacked extension..” button (see screenshot below)
10. Browse to select the folder containing the files you’ve just downloaded and unzipped
11. And you’re done! The extension will appear in your address bar. Keep an eye on it to monitor your CPU usage, and click for further details at any time.
12. <! —
13. –>

Please feel free to check it out, and do let me know how it works out for you.

This was my first attempt at building a Chrome extension, and I found the process pretty interesting. For anyone curious you can find the code on Github at https://github.com/andyyoung/Process-Monitor-for-Chrome