Question

I am coding an image gallery tonight and this led me to a philosophical question

I create a preloaded Image object and set an onload event for it

  ...  onmouseover = function() {
        preloadActive = true;
        imgPreload = new Image();

        imgPreload.onload = function() {
            preloadActive = false;
        }

        imgPreload.src = ...;
      }

Where imgPreload and preloadActive are global variables

Now imagine that a new onmouseover() fires out before onload() executes.

a line of code is run which creates a new image object, the old image object looses the last link and goes to Erebus, and is waiting for garbage collector to eat it.

The question goes here:
The old object instance is not destroyed immediately. Its onload event continues to live nobody knows for how long time? Do you have any cross-browser experience about that?

Thank you!

PS: I don’t worry about IE6

---

PPS: What happens if I have an object with setInterval timeout ID inside?

obj.someVar = setInterval(...)

Is setInterval stopped the very moment I execute

obj = {}

?

Answer 1

Well, for starters, global variables aren’t eligible for garbage collection (which is usually the cause of memory leak issues and is one of many reasons to avoid using global variables all together).

Having said that, please read this article by Eric Lippert. It’s old, but I still think it is quite relevant.