JSFiddle - React, Tailwind, and code Playground

HTML

<div id="app">
test
</div>

CSS

#app {
  background: pink;
  width: 100%;
  height: 100%;
  padding: 60px;
  font-size: 40px;
  text-align: center;
}

JavaScript

const text = document.querySelector('#app');
let oldWidth = -1;

const myObserver = new ResizeObserver(entries => {
  entries.forEach(entry => {
  	const newWidth = entry.contentRect.width;
  	if (oldWidth !== -1 && oldWidth > newWidth) {
    	app.innerText = 'Shrinking';
    } else if (oldWidth !== -1 && oldWidth < newWidth) {
    	app.innerText = 'Growing';
    }
    oldWidth = newWidth;
  });
});

myObserver.observe(document.body);