This is my code:
<SymbolOverview colorTheme="light"
autosize
symbols={[["COINBASE:" + symbol1 + "USD"]]}
wickDownColor="#F45B7E" />
<SymbolOverview colorTheme="light"
autosize
symbols={[["COINBASE:" + symbol2 + "USD"]]}
wickDownColor="#F45B7E" />
If I set setSymbole1("BTC"), my component for symbol2 changed too.
I want only re render component for symbol1.
By googling I found useMemo and useCallback, but I cant understand these.
If you components in the same page, When all page will be rendering which mean both of them will be rendering.
What you do it's use debounce to change the state "on the fly" for one component.
ref : https://www.freecodecamp.org/news/javascript-debounce-example/