resize Event와 ResizeObserver 비교해보기 🙌

브라우저의 창 크기가 변화했을 때, 어떤 액션을 발생시키고 싶다면, 가장 먼저 떠올릴 코드는 다음과 같을 것이다.window.addEventListener('resize', () => { console.log('Window resized!');}); 바로 resize Event이다.위의 코드는 브라우저 창 사이즈 크기를 탐지한다.다만, 특정 DOM의 사이즈 변화는 탐지하지 않기에 개별 Element 사이즈 변화에 대응하지는 않는다. 때문에, 새로운 방법이 등장했는데 그것이 바로 ResizeObserver이다.ResizeObserver는 특정 Element의 크기 변화를 감지할 수 있다.따라서, 브라우저 창 크기 변화뿐만 아니라 특정 요소의 자체 크기가 변화할 때에도 어떠한 액션이 실행되도록 설정할 수 ..