javascript - Why does removing elements take more time than adding elements? -


i have table lot of rows (like 10.000).
when receive new data want clear rows first.
weirdly enough, clearing table takes longer building rows scratch.

right clear table jquery empty():

$(#my-selector).find('table').empty(); 

this takes 1.5 minutes! understood empty, jquery loops on children check if have children themselves.

when change html("") or plain js innerhtml = "" time reduces 1.5 minute 20 seconds, still lot, , more building table itself, takes second.

so few questions:
- why removing elements take more time adding them? happens 'behind scenes'?
- efficient way remove lot of html elements?
- why innterhtml = "" take lot of time?

*i know having table 10.000+ rows doesn't make sense ux-wise, happened dom, , i'd understand it's behavior
*i read below posts, talk more possible solutions, , less why removing elements takes more time adding them, happens when remove them

jquery empty slow
jquery empty slow
what best way remove table row jquery?
deleting table rows in javascript
jquery - fastest way remove rows large table

i'm assuming have bad performance on ie.

i'd that's because $.empty method calls removechild in loop every removed element in table , method had bad performance in ie - see this article short case study performance comparisons , resolutions.

no matter large dom will have bad performance on ie. this article on appendchild in large dom on ie example of how community still befuddled simple fact. :)


Comments

Popular posts from this blog

Sort a complex associative array in PHP -

vb.net - How to ignore if a cell is empty nothing -

recursion - Can every recursive algorithm be improved with dynamic programming? -