Determine the number of times the DOM has been manipulated / added

Question

Is there a way to count the number of times the DOM is added to?

Answer 1

If you strictly follow .append() , you can simply fix it, for example:

 var _origAppend = $.fn.append; $.appendCount = 0; $.fn.append = function() { $.appendCount++; return _origAppend.apply(this, arguments); }; 

Now you can simply access $.appendCount anytime to find out how often it was called. However, keep in mind that there are many functions that can manipulate the DOM. Perhaps a more sensible idea is to plan for jQuery.fn.domManip . This method is called internally mainly during any manipulations with dom (for example, you might suspect because of the name)

Answer 2

You can use mutation events .
Keep in mind that they have a huge impact on performance!

The mutation event module is designed to notify of any changes in the structure of the document, including attr and text changes. It can be noted that none of the listed mutational events is considered canceled. This is due to the fact that it is very difficult to use existing DOM interfaces that cause document modifications if any change in the document may or may not occur due to the cancellation of the associated event. Although this is still the desired ability, it was decided that it would be better to leave it before adding transactions to the DOM.

Spec