Что такое resize и onresize в JS?

Событие onresize в чистом js не устарела и прекрасно работает у всех современных браузерах. Но лучше вызывать событие не просто .onresize (или .resize в jQuery), а через addEventListener('resize', function) (или его аналог .on() в jQuery), так как если нужно будет навешать на событие несколько функций обработчиков, то на .onresize они будут перезаписыватся.

Насчет современных вариантов, да есть. Эта функция вызывается очень часто (при каждом измененном пикселе) из-за может сильно нагружать страницу. Чтобы избежать этого на функцию обработчик ставят так званый "debounce" (https://learn.javascript.ru/task/debounce) который ограничивает вызов функции не больше раза в заданное время.

Вот пример функции без debounce — codepen.io/dimondevelop/pen/abOBOmG. Обратите внимание как часто меняется число, когда вы растягиваете/сужаете окно

А теперь с debounce в 1 секунду — codepen.io/dimondevelop/pen/QWbGbdK (можно ставить и меньше, я обычно ставлю 300ms).