Why not react?

Author: mastirCreated Aug 22, 2024Updated Sep 25, 2024

Hey! Thanks for this lib, i have used it in my project and its pretty good, but after some time i started asking myself "why?". And after few days i can not find answer.

We create engine as global context for our elements, state machine, factories. And same do createContext in react.
We use action based state machine for action processing and useReducer in react do absolutly the same and more.
We use serialization to convert our elements into json representation and deserialization with factories to recreate and display our elements. And thats what react components do: take our data and render it.

So we can have something like:

javascript

let node = {
    x: 10,
    y: 10,
    ports: [
        {name: 'First port'},
        {name: 'Second port'},
    ]
}
return <Engine>
    <StateMachine>
        <DefaultState>
            <SelectingState />
        </DefaultSate>
        <DragNodeState />
        <CreateLinkState allowLooseLinks={false} />
    </StateMachine>
    <Canvas>
        <LinksLayer />
        <Node model={node}>
            <h1>Hello world!</h1>
           
            {node.ports.map( port =>  <div>
                <Port align={"left"} model={port}>
                    <div style={{background:'#00F',width:16,height:16,display:'inline-block'}}></div>
                </Port>
                {port.name}
            </div>)}
        </Node>
    </Canvas>

With absolutly same result, but simple

So is there any real reason not to do so?

Source: projectstorm/react-diagrams

View original on GitHub View discussion on GitHub