Recently I came across this idea that expert should know the limits of their tool. This is not a new idea, I heard it many times, but I thought:
...
For further actions, you may consider blocking this person and/or reporting abuse
I'm not an expert, but for me a real wekness of react is the lack of an event bus. For highly interactive web pages it really annoy me to use chain of callbacks
I'm not following. Can you show code snippet of what you are talking about?
For an event bus or chained callback ?
I know what those terms means in separate, I don't understand your problem
For example, you have that structure:
-> Component A -> Component B -> Component C
-> Component D
If you want C to send something to A, in order to trigger an event in component D, the react way is to send callback to component B which will send it to component A, which will send it to component D. Working like that not only make you pass datas through all your parent components, it also increase the complexity of your code.
With an event bus and the same structure, you can do something like that: Component C -> Event Bus -> Component D. Not only it's less complex, it also reduce component dependency between each other.
The problem you are referring to is called prop drilling and typical solution it to use render prop for composition instead of nesting components. As well you can use Context to pass data deeper in the tree.
I don't want to pass them down, I wan't to pass them up :) For example when a user click a link, I need to trigger a page transition which is contained by an HOC higher in the tree.
To be able to trigger some action from the root component (for example, Router) you need to pass something down (for example, callback), then from the leaf component you can trigger some action, right? You not suppose pass callback on top, you rather elevate component which holds a state, pass down callback and then you can pass data on top using given callback. Do you see it same way?
Of course, would be nice if it was always like that :) I'll take again the example with my page transition. For performance and bandwidth purposes (the component have a video inside) I add this component inside my _app.js (I use Next.js for SSR). So I want that every time a user click an intern link (
<Link as={'/route/page'} href={'/page?slug=${this.props.slug}'}>), the transition start, when first part of transition is finished, do a route change, after route change, play second part of transition.Since can be used everywhere in my website, I can't elevate it as I want. And I don't want to deal with callbacks. This is why I need an event bus to notify my page transition when a link was clicked somewhere in the page, and pass it the necessary data.
This is the simplest way I found. But I'm open to any suggestions as I'm not a React expert
Ok, I got your situation. I feel like there is a good solution for it with a library with declarative animations, but I can't be sure, because I haven't done it.
Not a React expert, but some qualms from my experiences:
Agree that for simple sites, its not a good option, most Javascript Frameworks aren’t.
But as far as frameworks go, I’d say building forms is my biggest qualm.