#952 bug
Recep Uzun

IE 8 Memory Leak - Observe

Reported by Recep Uzun | November 30th, 2009 @ 05:32 PM

Dear Community,

following Problem occurs only on my IE 8 i know IE (all Versions) has strange Problems with such Memory Leaks i used before IE 6.

I create a Overlay (DIV) on my website and put a Click Observe on it to close this Overlay. Mozilla (latest version) has no leaks only my IE 8 eats on each call slowly but sure my Memory and i can watch how it increase with each call.
I remove all created "new Element" at the end of my Class too - and set my via ajax.update loaded JSON Obeject this.data=null in my Class.
So i removed the Observers and put a Button who call the close option direct = and see it doesnt leak anymore Memory so it can only be the Observe Option

a) i do something wrong ?
b) it is a bug ?
c) is it cause i use a New Element appendchild way ? but i remove it @ the End of my Class.


...

build: function() {
    getbody = document.getElementsByTagName('body')[0];
    var overlay = new Element('div', { 'id': 'overlay' });
    getbody.appendChild(overlay);
    },
prepareObservation: function() {
    this.mouseClickObserver = this.mouseClickEvent.bindAsEventListener(this);
    $('overlay').observe('click', this.mouseClickObserver)
},
mouseClickEvent: function(event) {
    $('overlay').stopObserving('click', this.mouseClickObserver);
    },

...

Comments and changes to this ticket

  • Tobie Langel

    Tobie Langel November 30th, 2009 @ 06:42 PM

    Please kindly advise which version of Prototype you are using.

  • Recep Uzun

    Recep Uzun November 30th, 2009 @ 07:20 PM

    Sry lastest for sure. Version: '1.6.1',

  • Recep Uzun

    Recep Uzun November 30th, 2009 @ 07:35 PM

    So if i "Refresh the Website"- F5 the Memory Usage goes down.
    But Recalling the Class (through a button as example) again and again the memory usage goes up and up...
    The Overlay is a Lightbox like DIV wich appears when i call it.

    Open Overlay

    myClass = Class.create({

    initialize: function() {
        this.build();
    },
    build: function() {
        getbody = document.getElementsByTagName('body')[0];
        var overlay = new Element('div', { 'id': 'overlay' });
        getbody.appendChild(overlay);
        );
        this.protorious_prepareObservation();
    },
    prepareObservation: function() {
        this.mouseClickObserver = this.mouseClickEvent.bindAsEventListener(this);
        $('overlay').observe('click', this.mouseClickObserver)
    },
        mouseClickEvent: function(event) {
        $('overlay').stopObserving('click', this.mouseClickObserver);
        this.close();
    },
    close: function() {
        $('overlay').remove();
    }
    

    });

  • Recep Uzun

    Recep Uzun December 2nd, 2009 @ 04:02 AM

    Possible i misunderstand the Event.Observe Function or the implementation regarding i found out that the Event Cache is only on "onunload" cleaned correctly wich means using any Observe Function on Classes who many Times called on a Website without a "Refresh" will Blow Up on IE Browsers till the Memory usage "explodes"...

    So using this Temporarly Implementation in my Class doesnt Blow up my Memory Usage on Call and i can use it many times i want without having a Memory Blow up or Leak on IE8 at least + Mozilla (tested)...

    build: function() {
    ...

        overlay = new Element('div', { 'style': '', 'id': 'overlay' });
        overlay.onclick=this.close;
    

    ... }, close: function() {

    overlay.onclick=null;
    $('overlay').remove();
    

    }

    -- Hope The Event Observe Function in Prototype get a easier better explanation and Update in the Future cause for Usage like this its worthless where Content is called on a Single Website without refreshes...

  • Victor

    Victor December 2nd, 2009 @ 12:49 PM

    Try to change code to this:

    mouseClickEvent: function(event) {
        $('overlay').stopObserving('click');
        this.close();
    },
    

    Will memory usage grow?

    P.S. Will be better to remember created element in field (e.g. this.overlay) than call $('overlay') every time.

  • Tobie Langel

    Tobie Langel December 2nd, 2009 @ 02:12 PM

    • Assigned user set to “Andrew Dupont”
    • State changed from “new” to “bug”

    This is a known issue related to the use of Element.storage. We'll be looking into it.

  • Juriy Zaytsev

    Juriy Zaytsev December 4th, 2009 @ 04:31 AM

    It would be nice to see a minimal test case demonstrating a leak. It could be a circular reference somewhere in your code; it could be due to not removing event listeners before injecting new content (received via XHR, as I understand); etc.

  • Tobie Langel
  • Tobie Langel

    Tobie Langel December 4th, 2009 @ 06:38 PM

    • no changes were found...
  • Tobie Langel

    Tobie Langel December 4th, 2009 @ 06:40 PM

    Try running both these files in Chrome and observe their respective process' memory consumption.

  • Tisho Georgiev

    Tisho Georgiev March 1st, 2010 @ 06:44 PM

    • Tag set to section:dom
  • MarkRowlands

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile ยป

The Prototype JavaScript library.

Shared Ticket Bins

Attachments

Pages