Jak stosować zamienniki dla useMemo()?

Znalazlem taki wariant do stosowania zamiast useMemo(). Jakie przypadki mają zastosowanie do tego rodzaju konstrukcji ?

const BgProvider = ({ children }) => {
  let [backgroundColor, setBackgroundColor] = useState("white");
  return (
    <div style={{ backgroundColor }}>
      <input onChange={(e) => setBackgroundColor(e.target.value)} />
      {children}
    </div>
  );
};
const Component=()=>{
return (     <BgProvider>
        <Expensive />
        <App />
      </BgProvider>)
} 

PS: brakujacy komponent to:

const Expensive = () => {
  console.log("expensive compenent rendered!");

  let total = 0;
  for (let i = 0; i < 1000000000; i++) {
    total += i;
  }

  return <div>Expensive</div>;
};

To jest cały przyklad?

Widać tutaj jedynie użycie hooka useState, który nie jest zamiennikiem do useMemo, a raczej sposobem przechowywania stanu w komponencie.

No a gdzie ten zamiennik useMemo? Wskaż go palcem?

Poza tym jeżeli renderowanie jest ciężkie, a nie obliczenia jakieś to zapewne chodziło Ci o React.memo, a nie hooka useMemo? Ale nawet dla React.memo nie widzę tu zamiennika

artur2015 napisał(a):

Znalazlem taki wariant do stosowania zamiast useMemo(). Jakie przypadki mają zastosowanie do tego rodzaju konstrukcji ?

Najlepiej zacznij od podania informacji gdzie znalazłeś taki wariant, podaj pełny kontekst, wklej linki.

Riddle napisał(a):

artur2015 napisał(a):

Znalazlem taki wariant do stosowania zamiast useMemo(). Jakie przypadki mają zastosowanie do tego rodzaju konstrukcji ?

Najlepiej zacznij od podania informacji gdzie znalazłeś taki wariant, podaj pełny kontekst, wklej linki.

na minucie 8:32

No tu masz połączenie useMemo i useEffect. W Twoim kodzie tego nie ma.

Autor przestawia specyficzną sytuację:

• useMemo zwraca obiekt
• obliczenia w ogóle nie są ciężkie
• zmieniają się często tak czy siak
• zmiana danych wejściowych age/country może zwrócić w teorii identyczny wynik - tj te same właściwości underAge i citizen - ale ponieważ było to przeliczane ponownie - to zwróci nowy obiekt

Więc można olać useMemo, bo wielkiego pożytku z niego nie ma i polegać na zmianie właściwości obiektu userType, zamiast na zmianie instancji obiektu.

I pewnie nic nie zrozumiałeś z powyższego, prawda? Generalnie do zrozumienia tego problemu trzeba relatywnie dobrze znać podstawy javascriptu, a widzę, że wklejasz tu losowe kawałki bez ładu, więc zakładam, że zacząłeś naukę od złej strony - od frameworka, nie znając języka.

dzek69 napisał(a):

No tu masz połączenie useMemo i useEffect. W Twoim kodzie tego nie ma.

Autor przestawia specyficzną sytuację:

• useMemo zwraca obiekt
• obliczenia w ogóle nie są ciężkie
• zmieniają się często tak czy siak
• zmiana danych wejściowych age/country może zwrócić w teorii identyczny wynik - tj te same właściwości underAge i citizen - ale ponieważ było to przeliczane ponownie - to zwróci nowy obiekt

Więc można olać useMemo, bo wielkiego pożytku z niego nie ma i polegać na zmianie właściwości obiektu userType, zamiast na zmianie instancji obiektu.

I pewnie nic nie zrozumiałeś z powyższego, prawda? Generalnie do zrozumienia tego problemu trzeba relatywnie dobrze znać podstawy javascriptu, a widzę, że wklejasz tu losowe kawałki bez ładu, więc zakładam, że zacząłeś naukę od złej strony - od frameworka, nie znając języka.

chodzi o ten moment na minucie 8:32, nie o citizen i underAge, chodzi o zmiane tla:

<BgProvider>
        <Expensive />
        <App />
      </BgProvider>

I pewnie nic nie zrozumiałeś z powyższego, prawda?
troche umie ale tworze nieczytelny workflow i ponownie renderuja mi sie komponenty