jQuery empty(),remove() and Thickbox


I am a great fan of thickbox and I have used it for a long time. Recently I came across a situation where trying to close a modal that had a table with around 7000 rows (each 8 columns) crashed the tab in Chrome and took a very long time in Firefox.

I went through the thickbox forum and discovered that other people have had similar issues and they were related to the tb_remove() function. I did my own profiling and came to the same conclusion.Of particular interest was this statement:

$("#TB_window").fadeOut("fast",function({$('#TB_window,#TB_overlay,#TB_HideSelect').
trigger("unload").unbind().remove();}); 

I looked at the documentation and then read through the comments where someone mentioned that remove() can be quite expensive due to stuff that it does and he suggested to use empty() before remove(). Voila, it worked! So for anyone else facing the same issue with thickbox, change the statement above to:

$("#TB_window").fadeOut("fast",function({$('#TB_window,#TB_overlay,#TB_HideSelect').
trigger("unload").unbind().empty().remove();});

and see if that works for you.

, ,

Leave a Reply

Your email address will not be published. Required fields are marked *