Tuesday, December 09, 2008

IE7 High CPU usage while moving the cursor

If you populate an HTML SELECT element with lots of OPTION tags, say 100+ AND you use CSS to specify the font-family / font-size of OPTION tags, then whenever you move the mouse cursor around the SELECT's parent box, you'll spike your CPU up to 100%.

This happens to me on a very modern 2GHz Core 2 DUO with IE7. Firefox 3 was unaffected.

During a website upgrade, our CSS was modified to include
option { font-family: sans-serif; font-size: 8pt }

About a day after the upgrade, users started emailing in, saying that IE was very slow to respond to mouse clicks on certain pages, which led to this problem being discovered. Once this CSS rule was removed, all was fine.