Why does React.js have such a terrible DOM management model? How to get along with it?

Question

JavaScript

Hello! I'll warn you right away - this is not a holivar. I've been coding in vanilla JS for a long time, making sophisticated use of design patterns and turning in projects with a bang. Over the years, I learned how to use the DOM well: I wrote a lot of plugins for various scrollers, scrolling, parallax, list filtering.
And then the reaction came to the market in the form of a trend. I agree, react + redux is convenient to use when we have static in the DOM, and react-redux simply gives its piece of some information to the component. I recently needed to rewrite one of our projects that we've been maintaining for a long time, and had to do it with react + redux (customer requirement). When I started writing an audio player with a bunch of custom scrollbars, timebars, etc. my eyes just bled from what kind of DOM control model to provide React. And yes, Redux does not save here. You have to constantly use EventEmitters, refuse to encapsulate components in order to share ref for all child elements. It's really a big hassle to get the properties of an element that isn't a member of a component's parent relationship.
My question is how do you, dear people, feel about this model and how to stop spitting on it? I've been reading the Facebook documentation for the hundredth time, but I still can't figure out how to really work effectively with the DOM in React. I'm waiting for your help.

Answer 1

refs, EventEmitter - they say that you have a problem with building the application architecture and a misunderstanding of dataflow in redux in general.
Take a look at one of the implementations of audio players, maybe you will pick up something.
https://github.com/andrewngu/sound-redux

Answer 2

I'll try to play telepath. A couple of moments.
First, Redux has nothing to do with the DOM. It's just a store of your state. Actually for a separate component, I'm not at all sure that Redux is needed
Second. Passing refs is some very strange approach. The component on the action must either change its state, or pull the callback to change the state of the environment. All. Any further rendering relies on the state.