insertionObserver.js

let styleEl;
let keyframeID = 0;
const insertionObserver = function(selector, callback) {
  if (!styleEl) {
    styleEl = document.createElement('style');
    document.head.appendChild(styleEl);
  }
  const curKeyframeName = `insertionObserver${keyframeID++}`;
  const keyframesRule = `@keyframes ${curKeyframeName} { from { opacity: 0.99; } to { opacity: 1; } }`;
  const styleRule = `${selector} { animation-duration: 0.001s; animation-name: ${curKeyframeName}; }`;

  const rulesIdx = styleEl.sheet.length;
  styleEl.sheet.insertRule(keyframesRule);
  styleEl.sheet.insertRule(styleRule);

  const listener = (event) => {
    if (event.animationName === curKeyframeName) {
      callback(event);
    }
  }
  document.addEventListener('animationstart', listener, false);

  return () => {
    styleEl.sheet.deleteRule(rulesIdx);
    styleEl.sheet.deleteRule(rulesIdx + 1);
    document.removeEventListener('animationstart', listener, false);
  }  
}