React: Frage: Kann useMemo anstelle von useRef verwendet werden?
Hallo, nur aus Neugier kann useMemo anstelle von useRef wenn man es wie folgt macht:
Beispiel:
const ref = useRef(null);
const ref2 = useMemo(() => { current: null }, []);
Mir scheint, dass beide Refs als DOM-Ref und als veränderlicher Wert ähnlich wie Instanzfelder in Klassen einwandfrei funktionieren. Warum wird useRef dann anders implementiert als useMemo wenn man den Code von useRef und useMemo berücksichtigt?
Vielen Dank!
svsool
Alle 3 Kommentare
Sie könnten auf diese Weise ein ref-Objekt erstellen, dies wäre jedoch weniger effizient, da useMemo auch Abhängigkeiten verfolgt und vergleicht. (Auch wenn Sie ein leeres Abhängigkeitsarray angeben, bietet die zugrunde liegende Datenstruktur für einen Memo-Hook Platz für den zusätzlichen Wert.)
Um dies zu veranschaulichen, können Sie die Implementierung von useRef :
https://github.com/facebook/react/blob/434770c3b4b94315c789234c27ed9dc2ec8a78ad/packages/react-reconciler/src/ReactFiberHooks.js#L907 -L920
Zu useMemo :
https://github.com/facebook/react/blob/434770c3b4b94315c789234c27ed9dc2ec8a78ad/packages/react-reconciler/src/ReactFiberHooks.js#L1126 -L1156
Da beide Hooks häufig verwendet werden, ist es wichtig, dass sie eine optimale Leistung erbringen: smile: Sie werden also unterschiedlich implementiert.
bvaughn
am 3. Feb. 2020
Sie könnten auf diese Weise ein Referenzobjekt erstellen, dies wäre jedoch weniger effizient, da
useMemoauch Abhängigkeiten verfolgt und vergleicht. (Auch wenn Sie ein leeres Abhängigkeitsarray angeben, bietet die zugrunde liegende Datenstruktur für einen Memo-Hook Platz für den zusätzlichen Wert.)Um dies zu veranschaulichen, können Sie die Implementierung von
useRef:
https://github.com/facebook/react/blob/434770c3b4b94315c789234c27ed9dc2ec8a78ad/packages/react-reconciler/src/ReactFiberHooks.js#L907 -L920Zu
useMemo:
https://github.com/facebook/react/blob/434770c3b4b94315c789234c27ed9dc2ec8a78ad/packages/react-reconciler/src/ReactFiberHooks.js#L1126 -L1156Da beide Hooks häufig verwendet werden, ist es wichtig, dass sie eine optimale Leistung erbringen, damit sie unterschiedlich implementiert werden.
Hallo, wie formatiere ich den Code so?
yaofly2012
am 21. Sept. 2020
@ yaofly2012 GitHub formatiert Links auf diese Weise, wenn Sie auf eine bestimmte
- Öffne einen Ordner
- Klicken Sie auf eine Zeilennummer
- Halten Sie die UMSCHALTTASTE gedrückt und klicken Sie auf eine andere Zeilennummer, um einen Bereich auszuwählen
- Geben Sie "y" ein, um die aktuelle Version zu verwenden
- Kopieren Sie die URL und fügen Sie sie in GitHub ein
bvaughn
am 21. Sept. 2020
Verwandte Themen
Prinzhorn
·
3Kommentare
UnbearableBear
·
3Kommentare
zpao
·
3Kommentare
kocokolo
·
3Kommentare
trusktr
·
3Kommentare
Hilfreichster Kommentar
Sie könnten auf diese Weise ein ref-Objekt erstellen, dies wäre jedoch weniger effizient, da
useMemoauch Abhängigkeiten verfolgt und vergleicht. (Auch wenn Sie ein leeres Abhängigkeitsarray angeben, bietet die zugrunde liegende Datenstruktur für einen Memo-Hook Platz für den zusätzlichen Wert.)Um dies zu veranschaulichen, können Sie die Implementierung von
useRef:https://github.com/facebook/react/blob/434770c3b4b94315c789234c27ed9dc2ec8a78ad/packages/react-reconciler/src/ReactFiberHooks.js#L907 -L920
Zu
useMemo:https://github.com/facebook/react/blob/434770c3b4b94315c789234c27ed9dc2ec8a78ad/packages/react-reconciler/src/ReactFiberHooks.js#L1126 -L1156
Da beide Hooks häufig verwendet werden, ist es wichtig, dass sie eine optimale Leistung erbringen: smile: Sie werden also unterschiedlich implementiert.