Color Jack: IE vs. Firefox

 By Shamus Oct 2, 2007 19 comments

First off, Color Jack is a cool little tool, and fun to manipulate. It’s for anyone who’s ever wondered, “what colors would look good with this?”

Now, when I try it in Firefox is works fine. Just slide the points around and they do their thing. In Internet Explorer, the program runs with an agonizing slowness. You’d think that color sphere was comprised of 10,000 bump-mapped self-shadowing polygons. It gets about a frame a second. How can it possibly be that slow?

Very odd.

19Just 19 comments.


  1. Jeremiah says:

    I’m running IE 7 on my laptop and I don’t think it runs particularly slow.

  2. Hermes says:

    It runs slowly if you drag. It’s fine if you click.

  3. Tango says:

    I see lots of complains from LiveJournal users that IE7 bogs down and appears to freeze trying to finish loading pages with lots of comments or javascript. Probably a related bug.

  4. JKPolk says:

    Hm, that IS odd. I still do tend to swap to IE for most uses of Flash, however, as it runs much smoother for me in IE than Firefox.

  5. James says:

    I just use FireFox and if there’s something IE dependant I change the ‘rendering engine’ so that that tab loads with the IE engine.

  6. scragar says:

    IE only does flash better because it’s integrated, firefox doesn’t integrate it as a [performance/do you need/want it all the time] issue.

    This page has a lot of javascript(several pages worth if you wanted to print it), but I though it was firefox that had problems with large pages on windows not IE?

  7. Katy says:

    OMIGOD thank you so much for this link! I always have trouble finding color matches when I screw around in Photoshop!! *luuuuv*

  8. mark says:

    Works nicely on opera 9.2 as well…

  9. Deoxy says:

    uh, because IE is a POS?

    I’ve heard the “flash is better in IE” thing before, but I’ve not noticed the difference on my own machine (and I’ve tried it).

  10. Gobo says:

    Wow! Very useful utility. Thank you.
    The reason it is slow in IE, I would presume is simply that IE is awfully slow on javascript, and this thing seems to be implemented entirely in javascript. There is no flash involved here at all.

  11. Ian says:

    @Deoxy: Flash does do a lot better in IE than in Firefox, it just doesn’t make a whole lot of difference in some flashes. Try running an intense vector-based Flash movie in a full browser window to get a good test. Basically, if a movie slows down considerably in Firefox, try it in IE.

    A good benchmark that I typically use is Flash Flash Revolution r2 — a web-based DDR simulator (r2 in particular because its requirements are ridiculously high and, more importantly, because it has a framerate counter). In Firefox, it sometimes manages 60 fps, but when arrows start coming on the screen it dips down to 45 fps, going as low as 30 fps in my tests. In IE it never dips below 50, even with a lot of arrows on the screen at once.

  12. Cadamar says:

    As a web developer who has done a lot of heavy, AJAX style javascript, I can tell you it’s because IE’s javascript engine is aginizingly slow. I’ve spent days trying to optimize code for IE that would run very fast in firefox. In many of my tests firefox would run as much as 10 times faster. IE7 does seem to be a little better then IE6 but it still doesn’t hold a candle to FF. I think the problem is in how IE manages the DOM and rerenders the page after adding/changing DOM elements. I’ve seen it peg out my processor for 5-10 seconds and consume hug amounts of memory to do things that happen in less then a second in FF.
    I’ve done a little work with Flash and I don’t think it matters. Flash uses its own engine separate from javascript and it seems to work fine in both environments. This would change, of course, if you are doing a lot of Javascript-Flash communications within the page.

  13. Henebry says:

    That’s a really neat resource. Runs fine in Safari for Mac, by the by. I’m an amateur at visual design, in the sense of actively doing a fair bit of web design at the hobbyist level. I’ve wanted something along these lines for quite a while.

    Thanks for the pointer, Shamus!

  14. TheRedTide says:

    Try Adobe’s Kuler for an even more powerful color picker. Free, of course.
    http://kuler.adobe.com/

  15. Wordblindness says:

    I don’t know if it is still the case, but Microsoft was refusing to implement the canvas tag for IP reasons. Third-party plug-ins can slow down rendering under some conditions.

  16. mud says:

    Hey, the problem is the code is written in AFLAX for Internet Explorer. Whereas in Firefox it uses native canvas.

    AFLAX slows down the process because it compiles flash via javascript… try using Firefox to speed it up. I really need to learn native flash! I’ve got some other projects that are going to need it soon as well.

    Glad you like Sphere :) I would suggest using Kuler if you’re on Internet Explorer, however.

  17. CJG says:

    IE breaks everything.

  18. roxysteve says:

    Years ago I did some work on this using, of all things, Visual Interdev, which showed me that IE registers a staggering number of event contingencies for each ID’d element on a page. ID an element and you’ll immediately get a shirtload of callbacks generated. These do indeed slow everything down to a manageable speed.

    Whether this is relevant to the color picker tool issue (which is indeed a neat thing) I don’t know, but those javascripters who are seeing slow times on IE can get sometimes staggering performance gains by rescripting client-side dynamics to use array-based processing where appropriate and removing all the unneeded ID attributes from the HTML tags.

    Just something I found by brute-force techniques and have tried and proved for myself. I don’t write javascript for a living, so there may be even cleverer ways to pull off the speed trick in the IE DOM.

    Steve.

  19. Martin says:

    Love this. Most functional color system I’ve see yet.

Leave a Reply

Comments are moderated and may not be posted immediately. Required fields are marked *

*
*

Thanks for joining the discussion. Be nice, don't post angry, and enjoy yourself. This is supposed to be fun.

You can enclose spoilers in <strike> tags like so:
<strike>Darth Vader is Luke's father!</strike>

You can make things italics like this:
Can you imagine having Darth Vader as your <i>father</i>?

You can make things bold like this:
I'm <b>very</b> glad Darth Vader isn't my father.

You can make links like this:
I'm reading about <a href="http://en.wikipedia.org/wiki/Darth_Vader">Darth Vader</a> on Wikipedia!