I do use abstractions to make my life easier. The main abstraction is a function called tag:

    const tag = (tagName, props, ...children) => {
        const el = document.createElement(tagName)
        for(let k in props) el.setAttribute(k, props[k])
        for(let child of children)
            el.appendChild(typeof child == 'string'? document.createTextNode(child) : child)
        return el
    }

This makes the construction of new elments a bit more concise. The rest is just functions, manually adding or removing classes and adding or removing nodes via the direct DOM API.

The main advantage I think React brought is breaking the concept of "separation of concerns" (keeping css, html and js in different files even when they change together). Keeping stuff that belongs together in the same file and mostly pure is what gives the most benefit. You don't need complicated frameworks for that.

    const createSpecialButton = text => tag("button", {style: "background: purple"}, text)

When something becomes a framework is a bit blurry. I consider this more of an utility function. It is only 7 lines long. You call it, it does not call you. It gives you back a concrete element, not some abstract intermediate value. It is completely optional. The amount of these utilities you need in a big project is still tiny.

I wrote a figma clone (see other comment) with couple of these utility functions. It looks a lot like a regular react project really. Mostly functions (which you might call a component if they return HTML), mostly pure or local state.