浏览器 - 5 种 Observer

浏览器提供了 5 种 Observer 来监听这些变动：
MutationObserver、IntersectionObserver、PerformanceObserver、ResizeObserver、ReportingObserver

浏览器渲染过程中, 会对这些监听事件调用

callback一般会触发两次。一次是目标元素刚刚进入视口（开始可见），另一次是完全离开视口（开始不可见）

function intersection(entries) {
    entries.forEach((entry) => {
        if (entry.isIntersecting) {
            var targetNode = entry.target;
            // do sth
        }
        
    })
}
var intersectionObserver = new IntersectionObserver(intersectionCallback, options);
intersectionObserver.observe(targetNode);

var mutationObserver = new MutationObserver(mutationCallback, options);
mutationObserver.observe(targetNode);

let Options = {
  childList: bool,
  attributes: bool,
  characterData: bool,
  subtree: bool,
  attributeFilter: array,
  att