Window resize event problem for Chrome

Question

I'm trying to handle stuff on my site when the window is resized and I have ran into an issue with Chrome that I can't figure out. Here is the code, very simplified:

<script language="javascript" type="text/javascript">
    window.onresize = function()
        {
            alert(1);
            alert(2);
            alert(3);
            alert(4);
        };
    });
</script>

When I click to Restore the window (make is smaller), it works fine (executing twice for some reason). When maximizing the window, the alerts go in this order: 1, 2, 1, 2, 3, 4, 3, 4; or sometimes 1, 1, 2, 3, 4, 2, 3, 4. In IE it seems to work fine (executing three times) and FF is fine (executing only once). I've also tried this with the jQuery equivalent of $(window).resize(...); with the same result. I know that javascript is not multi-threaded, but it almost seems like it is with this situation. Does anyone have any ideas?

Answer 1

Have a look at this question & answer on stackoverflow it might help

Answer 2

It's not so much single vs multi-threaded, an alert() call is one of the few things that locks up the execution thread, so while an alert is up, other things are queuing in the background.

If you didn't use alerts and instead did a console.log() or wrote into the page for your debugging, you'll get much more consistent behavior than with alert() calls...which are really bad for judging threading or race conditions, since they directly interfere and change them.