title: Angular [Violation] Dom Mutation warnings in Chrome
body: <p>In our Angular 6 project, in Chrome, I'm suddenly noticing these <code>[Violation]</code> warnings in our app stemming from <code>zone.js</code> line 1666. The message:</p>
  
  <p><code>[Violation] Added synchronous DOM mutation listener to a 'DOMNodeInserted' event. Consider using MutationObserver to make the page more responsive.</code></p>
  
  <p>I've never seen these before, but then again they're in a Chrome dev tools tab I've never noticed before (the <code>console sidebar</code>). When I switched over to an older branch and locally served it, these warnings still appear. So perhaps these warnings have always been there and I missed it all this time, or perhaps a merge with a teammate's project changed a file in Angular permanently, causing further builds to always cause these warnings. </p>
  
  <p>I checked line 1666 of zone.js and it involves the following code:</p>
  
  <pre><code>    var customScheduleGlobal = function () {
          // if there is already a task for the eventName + capture,
          // just return, because we use the shared globalZoneAwareCallback here.
          if (taskData.isExisting) {
              return;
          }
          return nativeAddEventListener.call(taskData.target, taskData.eventName, taskData.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, taskData.options);
      };
  </code></pre>
  
  <p>To my knowledge we've never modified zone.js. What are these <code>[Violation]</code> warnings, how can I fix them, consequences of not fixing them? </p>