1. You have your signals and stuff - the actual data you want rendered.
2. React creates a virtual DOM tree thing out of your markup.
3. That virtual DOM gets turned into real DOM.
4. React gives the real DOM to the browser, who probably has to shift a lot of internal data around to accommodate changes.
5. The browser loops through its DOM and draws it on the screen (somehow - another black box).
This is a crazy amount of internal bookkeeping. Compare this with something like Dear ImGui (https://github.com/ocornut/imgui) where it's more like:
1. You have raw data in memory (just ints and char arrays).
2. You loop over your data, generating vertices for the GPU.
3. You give those vertices to the GPU to render a frame.
IMO this is way easier to reason about. It may seem "inefficient" as you're building up the entire screen from scratch for each frame. But if your content is static, who cares? You can draw one frame and leave it there for as long as you need. If your content is animated, you're probably already redrawing each frame from scratch anyway. At least you know that it's happening now that you've removed the endless layers of black box tree structures.