Is this handled efficently? *short code

Is this handled efficently? *short code
0

#1

pen: [ https://codepen.io/ustvarno/pen/oLBQzx ]
have two nodes and controller.
in controller’ render i render this two nodes.
with changing props for first node, it both get rerender.
Is this handled efficently?


#2

You seem to have the right idea. You should have as many stateless components as possible and use props for changing data for children. I would caution against taking this philosophy to an extreme though because it ends up in slightly cluttered code like my game of life project, which was my first attempt at react.

I ended up having only one (massive) component with state and it handled all changes to every element. Try to have few state components but make sure that every component has a well defined function and doesn’t do too much work on its own. To be honest though, I’m not sure if my implementation is effective in terms of performance but it’s better to have one parent with state than 2.4k children with it.


#3

look at foot here [ https://codepen.io/ustvarno/pen/grGJGZ ] :slight_smile:
i tried that effect of fade on :before element and it looks good in chrome, but in firefox, not so much


#4

Oh wow, I’m flattered I provided some inspiration :grin:

As for your shadow in firefox, it seems to work fine for me? I also noticed my game of life is terribly slow on firefox (which I never really use). I really have to appreciate Chrome’s JS engine, and the need to refactor this project later on.


#5

:slight_smile:

my board architecture logic is based on this other link in footer, it is very simple and looks nice


#6

but if we are based on redux pattern for constructing react app, then all need to be stored on ‘head’ of application, and then to update own state for children props? How this can be seen as efficent pattern?


#7

That’s something that confuses me too. As far as I understand, state re renders the component. So wouldn’t it be less efficient to have less stateful components? I need more experience with React to really give a decent answer. I’ll try re making the game of life with the cells having state and see if that works better.


#8

maybe if u generate all cells from once in render then u got slowly render. But if u render just row in what event happend like click etc, then just rerender that row