浏览器如何处理“setInterval”和“Event Listener”？

Question

所以我在想。这段代码有什么区别：

windowHeight = window.innerHeight;
windowWidth = window.innerWidth;
setInterval(function(){
    if(window.innerHeight != windowHeight || window.innerWidth != windowWidth){
         windowWidth = window.innerWidth;
         windowHeight = window.innerHeight;
         // do something here
    }
}, 10)

这段代码？：

document.addEventListener('resize', function(){
    // do something here
})

我知道后面的方法是最好的做法。但我想知道的是，浏览器如何处理事件监听器与以一定时间间隔检查事件变化有什么不同？如果浏览器以不同的方式工作，那么如何？

还有什么是创建自己的监听器的最佳方法？例如，像创建角度的$watch()函数，但在普通的Javascript中。