Question

If an event listener is attached to every cell in a particular column of a table, and then every row is removed from the table, to avoid memory leaks is it necessary for the developer to remove the event-listeners before the rows are deleted, or do the browsers clean things up?

Edit: the article that Michael suggested says event delegation performs better than binding the listener directly to every cell in the table, but I am not sure if it is better from a garbage-collection perspective or just performs better. Please comment. From the article:

        $('table').on('click', 'td', function () {

            $(this).toggleClass('active');

        });

is said to be superior to:

        $('table td').on('click', function () {

            $(this).toggleClass('active');

        });

Edit2: and the jQuery documentation of .on() and event delegation also focuses on performance, but the question of what happens from a garbage-collection perspective when rows are repeatedly deleted en masse from a large table, and the cell-click is being listened to by the delegated mechanism, remains.

Answer 1

I am not sure, but i guess this brilliant article will clean things up (search for “Garbage Collection”): http://coding.smashingmagazine.com/2012/11/05/writing-fast-memory-efficient-javascript/