wintercounter / Protip

A new generation jQuery Tooltip plugin
http://protip.rocks
MIT License
359 stars 38 forks source link

Makes tablesorter plugin really slow #32

Closed zenichanin closed 7 years ago

zenichanin commented 7 years ago

Any idea why Protip plugin causes tablesorter plugin to sort table really slow? Once I remove the Protip file, tablesorter plugin goes back to sorting almost immediately. I do have various buttons in the table which use Protip, so just wondering if Protip is somehow re-rendering something each time table is sorted?

wintercounter commented 7 years ago

Yes, there is a global MutationObserver running which is catching all DOM additions/removals and checks if the inserted/removed elements have/had protip attached to them. This handles instance creation/destroy. You can turn this option off $.protip({ observer : false }) but in that case you need to have the tooltip sources in the loaded DOM or you have to handle initialization manually (by calling .protipSet on the element you want to add this to.

In your case, if the buttons with .protip class are in the DOM, you can safely turn off this option, if it's using AJAX (so it has dynamically generated DOM) then you need to loop through your buttons, find elements which doesn't have protip instance yet and initialize them. I would do this in an onSortDone event (probably tablesorter has something similar).

wintercounter commented 7 years ago

I've forked a tablesorter demo, added a button with tooltip to each row and multiplied the number of rows. http://jsfiddle.net/qeq48x5L/1/ You can clearly see the performance gain by switching observer on-off. I've added code to the end of the JS tab :)

zenichanin commented 7 years ago

Awesome, thank you. Yes that was definitely it.