Top Processes Windows Sidebar Gadget

Last weekend I decided that I would try my hand at developing a Windows Sidebar Gadget. I’ve got a few ideas about gadgets that I’d like to make, so I thought I’d whip up a quick, useful gadget to get familiar with the platform. I ended up making the TopProcess gadget. It’s basically a version of the standard UNIX top command. It’ll show the top X processes on your computer, which are the processes taking the most CPU. It just sits there in the sidebar updating that list every few seconds, letting you know what’s chewing up your dual cores.

TopProcess Screenshot

You can grab it from me on my new Sidebar Gadgets page, or from Windows Live Gallery. If you like it, please rate it or review it on Windows Live Gallery, so more people get to see it.

TopProcess is pretty simple. It uses WMI, which is very straightforward, to get the kernel and user time for each process on your system, figures out the difference in times between now and the last time it looked, sorts them, and displays the top X (configurable) on the gadget. I got a little fancy with the display side of things, making the text fade between updates, and making the gadget scale correctly when you change the number of processes to display.

When I first got Windows Vista, I was pretty surprised that there weren’t more gadgets available. As time has passed, not a ton of gadgets have shown up on Windows Live Gallery. I was sure somebody would have made a top process gadget already. But after actually doing it myself, I understand why people haven’t been pumping these things out. Making a Windows Sidebar Gadget is really, really frustrating. First, instead of going with .NET and WPF, two awesome Windows-only technologies, the Sidebar team went with HTML and JavaScript as the basis of all gadgets. And if you do want more capability than JavaScript gives you, you need to start pulling in ActiveX objects, VBScript-style. So if you were dreaming of easy animation, drawing, and UI, and access to the power and ease of use of the .NET platform and Visual Studio, forget it. Think of it more like developing web pages for Internet Explorer (no Firebug here), but without even an error dialog to tell you if your script has failed. It’s a mess of HTML, CSS, and JavaScript bugs and quirks. Compounding this is the fact that the MSDN documentation for Sidebar is some of the worst documentation I’ve ever seen. It ranges from completely unhelpful to misleading, and it’s missing any examples or even code snippets that would give you an idea of how to actually use it. Who goes through the trouble to build what’s essentially an application development platform, and then not even bother to write half-decent documentation?

As an example of how frustrating it was to make this gadget, take the feature of fading text. This should be simple – the new text fades in while the old text fades out. Immediately I was hit by a problem – Internet Explorer doesn’t support the opacity CSS keyword. So I had to insert a filter key that put on some crazy DirectX filter on the text. The most immediate effect of this was disabling ClearType on the text, and inexplicably bolding my font. I still can’t explain this. Frustrated with my subpar text rendering, I turned to the gText object. It took me lots of searching just to figure out that, unlike gBackground, there is no corresponding HTML element for gText. It must be created, in script, from gBackground. So I made myself a gBackground, and struggled for a while before realizing that it’s essentially a stunted version of the canvas object in HTML5. So I needed a gBackground that spanned my whole gadget. But I didn’t have a single background image for the whole gadget – I intended to compose the background of multiple images, so it could scale correctly with more or less processes displayed. gBackground requires you specify a single image before you can add more images onto it. So I had to make a 1px by 1px transparent PNG that I stretched over the background of the gadget. Remember doing that from the old days with table-layout HTML design? It brings me back. Anyway, now I could add my gText objects. These guys do support an opacity property, and after working out how to track them between updates (they aren’t included in the DOM), I had replicated the fading behavior that I had done with HTML. The result? Exactly the same. Except it’s harder to use gText , and there’s no way to remove gText objects once you’ve added them to a gBackground unless you remove all the objects on the gBackground. It’s really nuts. I ended up rolling back all my changes and just going with the HTML fading. Sorry about the awful font rendering, but I think at this point it’s not my fault.

There are more problems with the Sidebar platform of course. For example, in the manifest for a gadget there’s a way to specify your copyright, but no way to link to a license. I know Microsoft is starting to get Open Source – they should understand that licensing is important. And if they want people to be able to find new gadgets for their Sidebar, Windows Live Gallery is not the way to do it. It suffers from the same confusion as all the Live products, including Live Spaces gadgets on the same page as Sidebar gadgets without really indicating which is which. It’s just really depressing that the Sidebar ended up being such a lame feature. I remember the coverage before the “Longhorn reset” that promised the Sidebar as a unification of the disparate notification methods in Windows, replacing the system tray as well as providing hosting for mini WPF applications. Instead we get a lame reimplementation of Yahoo! Widgets or Apple’s Dashboard, without any polish or documentation. It’s really just sad.

Tags: , , ,

32 Responses to “Top Processes Windows Sidebar Gadget”

  1. [...] guess I didn’t learn my lesson with the TopProcess Sidebar gadget, because today when I got home from work I was itching to make another. This time I figured I could [...]

  2. David says:

    I don’t think I’d really mind having this gadget without the fading text if it meant I could use it without having every letter be in bold. Is it possible to release a non-strong version of this gadget, or at the least give a guide on how to change the current version? I’m not fluent in Javascript.

  3. Mikey says:

    I really like having this gadget (Top Processes) in my sidebar. But it keeps inexplicably disappearing. I keep it in the 5th position out of 6 gadgets (counting from the top down), and there’s still plenty of room for more gadgets, so it’s not that I’m out of space, nor is it simply moved out of site (the arrows at the top of the sidebar are not enabled… nothing has been moved out of view due to space limitations). The order of gadgets I have are: Vista Orb Clock, Digital World clock, CPU, MultiMeterD124-1, TopProcess, Notes. The sidebar is always on top, and always starts up with the system. (And if I recall correctly Top Processes will usually be visible again upon startup. But closing the sidebar with a right-click and then using the taskbar icon to show it again makes no difference once Top Processes has disappeared; it’s still gone. I have not yet been able to determine any particular action associated with its disappearance. Sometimes it stays there for a long time, other times it simply disappears! Any thoughts?

  4. brh says:

    Mikey,

    That’s really weird. I don’t think I’ve ever seen that. Unfortunately I don’t understand Sidebar enough to troubleshoot it for you.

    David,

    The next version (I’ll release it in a couple days) allows you to disable text fading in order to have non-bold text.

  5. Mikey says:

    Thanks for the reply. I’ve now tried adjusting the options to include the top 5 processes (rather than the default 3), thereby making the gadget bigger. Though it might be too soon to tell, it seems to be more stable (not disappearing from the sidebar, so far). I remember that while browsing for solutions I came across some size issues (about a gadget being too small causing some problem or another), so I figured why not try making it bigger. We’ll see if it holds.

    If it does start disappearing again, maybe I’ll try your new release where I can opt out of the fading text. Maybe it will be a little less fragile without that functionality. (Though I think I’d miss the bold letters, with my aging eyesight!)

  6. Mikey says:

    Okay, I think I’m on to what’s making the gadget disappear from my sidebar. I have a thumb button on my mouse that’s set to “close program”, so that I don’t have to aim for the tiny red x at the upper right corner of open windows whenever I want to close them. When I was closing out my Firefox browser this morning using that thumb button, I saw the Top Processes gadget disappear! So somehow, under certain conditions (yet to be determined), the focus is moving to the sidebar I think (sidebar becomes active), even though I’m engaged in web browsing.

    I hadn’t noticed the link between the thumb button and the gadget disappearing, until I made the gadget bigger (by listing more processes), so it was easier to notice when exactly it disappeared.

    All I’ve gotta do is figure out when/why/how the focus is moving to the sidebar, so that I won’t be closing gadgets instead of the intended window!

    I certainly don’t think it’s your gadget’s fault (besides which I got another gadget to disappear that way), so my search for the focus/active window mystery will have to be described in another thread somewhere.

    But I thought I’d share what I found out up to this point, in case it comes up again.

    Thanks for the great gadget!

  7. brh says:

    I’ve uploaded a new version that lets you turn off the text fading, which un-bolds the text. Hope you like it!

  8. [...] a quick update on the Top Process Windows Sidebar Gadget I made a couple months ago. First, I’ve added an option to disable the crossfade effect whenever the list of processes [...]

  9. Josh says:

    Hi,
    I love you gadget but it seems i get high cpu usage from a process called ‘WmiPrvSE.exe’ when the gadget is on the cpu bounces between 7-10 and 25-30%. When the gadet is off (all other gadets still on) cpu usage is around 4-10%. I was wondering if you would give me an explination or at least look into it?

    Thanks

  10. brh says:

    WmiPrvSE.exe is the WMI service – what the gadget uses to find out what processes are running and how much of a given resource they are consuming. It shouldn’t take much CPU – on my computer it’s 1%-3%. If you have a slow computer or if you have decreased the “Seconds between updates” setting it could use more. I’m afraid I can’t do anything about it though. Try decreasing the “Seconds between updates” setting if it worries you.

  11. Josh says:

    Thanks for the reply I did reduce the seconds to 3 and i have 2 of the gadget running one for cpu and other for memory. I have a Core 2 Duo T547 @ 1.60GHz

  12. Josh says:

    Thanks for the reply I did reduce the seconds to 3 and i have 2 of the gadget running one for cpu and other for memory. I have a Core 2 Duo T547 @ 1.60GHz. I do see a spike now when it updates.

  13. [...] After writing my last two Windows Sidebar gadgets, I really meant to swear them off entirely. They’re really a pain to develop. But when my favorite video game developer, Bungie (recently of Halo fame) launched their new [...]

  14. Matt Kreger says:

    I love this gadget. I’m having an issue though where sometimes when I come back to my pc after being gone for a day there is an error message that ends in “null or not an object” in red text. I can’t make out the first part of the message. I have to close the gadget and re-add it but then it works fine again for a while. It’s a new computer, and my first with Vista. I leave it on all the time and generally only use it in the evenings (and then not every day) so I don’t have a clear picture of the conditions/circumstances leading up to the error. I don’t see anything in the system logs that seems related, and am not having any other issues.

    Thanks

  15. Ben Hollis says:

    Hm, I wish I knew more about the error – I’m afraid that’s not much to go on. I’ve never seen that happen with this gadget.

  16. Matt Kreger says:

    Here is the error:

    Update(): ‘processld’ is null or not an object

    And yes, it does look like it says processld (lowercase L) and not processid.
    Thanks

  17. Ben Hollis says:

    Thanks, I’ll check it out.

  18. Ben Hollis says:

    OK, I’ve uploaded a new version on my site. Give it a shot.

  19. Matt Kreger says:

    Thanks. Just got this installed. I’ve been in and out of town a lot.

    I’ll let you know.

  20. Matt Kreger says:

    It’s been running without a hitch since I installed the update. I can’t say it’s definitivly fixed yet, but I don’t remember it going three days without seeing the error before.

    Thanks for the update!

  21. Matt Kreger says:

    whoops. That was premature. I’ve had the same error twice again this week.

  22. ron says:

    ok so i jut encountered the same exact issue with the red message that makes it stop and it says the exact same thing!!
    it started ONLY after i’ve installed internet explorer 8. new pc. using vista obviously….

    any ideas how to solve it?
    and im not sure if it has to do anything with the IE8, but 100% it never happened before the installation.

  23. Ben Hollis says:

    Yeah, I’m pretty sure IE8 screws up the sidebar – I’m not sure but I’m hoping they just fix IE…

  24. ron says:

    i see “matt kreger” had the same problem on november last year before the release of ie8. are you sure its because of the ie8? its the exact same problem with the exact same error message…..

  25. Ben Hollis says:

    I’ve uploaded a new version of TopProcess at http://brh.numbera.com/software/sidebargadgets/ that should prevent the error even with IE8 installed.

  26. ron says:

    thanks. i’ve installed the new one. ill let you know in a few days if it has any problems or if its working fine.

  27. ron says:

    well im back…. it does seem much more stable, took it a lot longer than usual to stop working…. and im using it twice on myt tab (one time for cpu and another for the memory) and one of them is still working (the cpu). only the ram crashed. with again the same message…..

  28. todd says:

    I’m getting the same red error about once a day. It also started happening for me when I installed IE8 and/or when I started using 64 bit Vista. I have the newest version from 3/31/09 and also have 2 copies of the gadget running (one for memory and one for CPU). But it was happening even when I only had one copy running.

  29. Ben Hollis says:

    Yes, it’s caused by IE8. I’m still trying to track down the problem – every time I think I’ve squished it, it pops up somewhere else. IE8′s JavaScript engine is just doing something really weird.

  30. J-P says:

    Hi Ben,

    I couldn’t find a sidebar gadget to show top processes for disk (I/O) usage, so did a quick hack to extend TopProcesses. I also fixed a small bug with ‘hotprocess’ meant to be highlighted in red.

    Check your email, sent you an update to the mail address on this site.

  31. Ben Hollis says:

    Hey J-P, thanks for the contribution. I’ve been out of town but I should be able to take a look at it in a while.

  32. uzb3k says:

    As Mikey said, mine is disappearing as well. But only when I run multiple instances of it (one for cpu, one for memory, etc..) – so I think that’s the problem. I wonder if you can install the same gadget under different names maybe to trick windows?

Leave a Reply