UseMemo veya useCallback VS useRef ile Bağımlılıkları Boşaltma

Bu GitHub sayısında temel olarak değiştirmeyi önerdim:

x = useCallback( ... , []);

Kime:

x = useRef( ... ).current;

İkisi aynı ama useRefReact ile bağımlılıkları karşılaştırmıyor.

Hangi soruya bir cevap geldi:

Bağımlılığı olmayan bir kullanımın, anem veya useCallback'in useRef'ten daha iyi bir seçim olacağı hiç bir durum var mı?

Birini düşünemiyorum, ancak bazı kullanım durumlarını gözden kaçırmış olabilirim.

Herkes böyle bir durumu düşünebilir mi?

reactjs react-functional-component

— Izhaki
kaynak

Yanıtlar:

React Hooks API belgeleri başına:

UseRef'in içeriği değiştiğinde sizi bilgilendirmediğini unutmayın. .Current özelliğini değiştirmek yeniden oluşturmaya neden olmaz ... Geri arama ref'sinin kullanılması, bir alt bileşen ölçülen düğümü daha sonra görüntülerse bile (örneğin, bir tıklamaya yanıt olarak), yine de üst öğede bu konuda bilgilendirilmemizi sağlar. bileşen ve ölçümleri güncelleyebilirsiniz.

Burada ve burada daha fazla bilgi edinebilirsiniz .

— Rasuna Khatami
kaynak

Sanırım bu soruya cevap veriyor, ancak bunun yanlış olduğundan şüpheleniyorum. Sandbox React örneğinde, useCallback(x,[])olarak useRef(x)çalışmak aynı şekilde çalışır.

— Izhaki

useRef(x).currentyani.

— Izhaki

Umarım yanılıyorum, ancak belgelerin neden yanlış olduğuna dair bir dava açtım

— Izhaki

Kendime useCallback(cb, [])karşı tamamen emin useRef(cb).currentdeğilim. Rağmen, bir anlamda useMemo(cb, [])farklı , "sadece bağımlılıklar biri değiştiğinde memoized değeri yeniden hesaplar." Versus ne olursa olsun değeri her zaman yeniden hesaplar. useRef(cb).currentuseMemouseRef

— Rasuna Khatami

useRefasla yeniden hesaplamaz - her zaman başlangıç değerini döndürür.

— Izhaki

UseCallback veya boş bir bağımlılıkla taklit etmek için useRef'i kullanabilirsiniz, ancak bağımlılıklardan herhangi biri değiştiğinde yeniden anımsatmak için tüm olası kullanımCallback senaryoları için kullanamazsınız.

Ayrıca, useCallback with empty dependencyherhangi bir ağır karşılaştırma yapmak zorunda olmadığındanRef kullanırsanız veya kullanırsanız, performans farkı fazla olmaz.

Ayrıca, işlev uygulamasını belirli bir param değişikliğinde yeniden oluşturmanız gerekecek şekilde biraz değiştirirseniz, uygulamayı basitçe güncelleyebilir useCallbackve ekstra parametreyi bağımlılık olarak ekleyebilirsiniz. Bununla birlikte, useRef ile uygularsanız, geri dönmeniz gerekir.useCallback

— Shubham Khatri
kaynak

Teşekkürler. Başlıktan da anlaşılacağı gibi, bu kesinlikle boş bir bağımlılık durumudur.

— Izhaki

@Izhaki Sorunun kesinlikle boş bağımlılıklar olduğunu anlıyorum ve bu yüzden boş bağımlılık durumunda herhangi bir fark olmadığını belirttim. Ancak, daha fazla değişiklik eklemeye çalıştığınızda, biraz refactor gerekebilir

— Shubham Khatri

Çünkü useRef (() => {...}) çıktısı değiştirilebilir.

Bu, kodunuzda garip yan etkilere neden olabilir. Akım değerini istediğim zaman değiştirebilirim. https://codesandbox.io/s/confident-monad-vjeuw

UseRef'i kullanmak istememek için bir kullanıcı tabanı olurdu.

— Daniel Duong
kaynak

Ama x = useRef(value).currentasla değişebilir bir örneği döndürmez - refasla döndürülmez; currentdır-dir. Bu useCallbacksürümle aynı .

— Izhaki