Atomlar: Jotai'de Durum Birimi

Jotai'de durum atomlara ayrılır: bunlar küçük ve bağımsız tepkisel durum parçalarıdır. Her atom tek bir değer tutar ve bileşenlerin dışında atom(initialValue) ile oluşturulur.

Bu yaklaşım, tek bir büyük depo nesnesi yerine durumu anlamlı en küçük birimlere ayıran zihinsel modeli yansıtır.

Bir atomun değeri değiştiğinde yalnızca o belirli atoma abone olan bileşenler yeniden oluşturulur. Başka atomları okuyan bileşenler etkilenmez.

Bu ayrıntılı tepkisellik, herhangi bir değişiklikte tüm tüketicileri yeniden oluşturan React Context'e kıyasla Jotai'nin temel avantajıdır.

Atomları modül düzeyinde tanımlayın: const countAtom = atom(0). Böylece atom kimliği oluşturma işlemleri arasında kararlı kalır ve atom her bileşen bağlandığında yeniden oluşturulmaz.

Atomlar hafif referanslardır; kendi değerlerini tutmazlar. Değer Jotai deposunda bulunur.

Jotai, varsayılan olarak örtük bir genel depo kullanır. Atomları kullanmaya başlamak için uygulamanızı bir sağlayıcıyla sarmanız gerekmez; bu da mevcut projelerde benimsenmesini kolaylaştırır.

Atomlara, özellikleri aktarma zinciri veya bağlamı zincirleme aktarma gerekmeden ağaçtaki herhangi bir bileşenden genel olarak erişilebilir.

Aynı bileşen ağacının birden çok bağımsız örneğine ihtiyacınız olduğunda (örneğin, her birinin kendi form durumu atomlarına sahip olduğu iki ayrı form), her birini bir Jotai sağlayıcısıyla sarın. Her sağlayıcı yalıtılmış bir depo oluşturur.

Bu yaklaşım, mikro ön yüz mimarileri veya bağımsız durum adalarına sahip karmaşık sayfa düzenleri için kullanışlıdır.

Genel depo, atomları uygulamanın yaşam süresi boyunca korur. Kapsamı sınırlı sağlayıcı deposu, sağlayıcı bileşen ağacından kaldırıldığında sıfırlanır; bu, genel olarak kalıcı olmaması gereken iletişim kutuları veya sayfa düzeyindeki durumlar için idealdir.

Sunucu tarafında oluşturma yalıtımı için sağlayıcıya özel bir depo örneği bile geçirebilirsiniz.

Zustand, gereksiz yeniden oluşturma işlemlerini önlemek için seçiciler içeren tek bir depo nesnesi kullanır. Jotai durumu atomlara böler ve her bileşen yalnızca okuduğu atomlara abone olur.

Jotai, ayrıntılı kullanıcı arayüzü durumu (tek tek giriş değerleri, açma-kapama işaretleri) için daha doğaldır. Zustand ise daha büyük ve birbiriyle bağlantılı uygulama durumlarına uygundur.

React Context, bağlam değeri her değiştiğinde, tüketen bileşen bağlam nesnesindeki yalnızca bir alanla ilgilense bile her tüketici bileşeni yeniden oluşturur.

Jotai bu sorunu çözer: useAtom(nameAtom) kullanan bir bileşen yalnızca nameAtom değiştiğinde yeniden oluşturulur; başka herhangi bir atom değiştiğinde oluşturulmaz.

Jotai, bir atomun değerinin değişip değişmediğini belirlemek için varsayılan olarak Object.is karşılaştırmasını kullanır. Bir atomu zaten tuttuğu değerin aynısına ayarlarsanız yeniden oluşturma tetiklenmez.

Karmaşık nesneler için, büyük bir atomdan kararlı bir ilkel değer türetmek ve ilgisiz alanlar değiştiğinde yeniden oluşturmayı önlemek üzere selectAtom yardımcı programını kullanın.

useState tek bir bileşenle sınırlıdır. Atomlar açıkça aktarılmaları gerekmeden tüm bileşen ağacı genelinde paylaşılır. İki kardeş bileşen aynı atomu okuduğunda otomatik olarak eşzamanlı kalırlar.

Bu, bileşenler arası paylaşım için durumu üst bileşene taşıma gereksinimini ortadan kaldırırken yeniden oluşturma işlemlerini en aza indirir.

Yaygın atomlar şunlardır: const themeAtom = atom('light'), const cartItemsAtom = atom([]), const selectedUserIdAtom = atom(null). Bunlar bir kez tanımlanır ve uygulamanın herhangi bir yerinden içe aktarılır.

Her atom bağımsızdır: cartItemsAtom güncellendiğinde yalnızca themeAtom okuyan bileşenlerde yeniden oluşturma tetiklenmez.

Yeniden oluşturma açısından Jotai, React Bağlamından nasıl farklıdır?

Atomlar, Jotai'deki durumun temel birimidir; bileşenlerin dışında atom(initialValue) ile oluşturulur ve varsayılan olarak bir Sağlayıcı olmadan ağaç genelinde paylaşılır. Bir atom değiştiğinde yalnızca ona abone olan bileşenler yeniden oluşturulur.

Bu ince taneli tepkisellik, Jotai'nin React Bağlamına göre temel avantajıdır ve atom başına abonelik modeli, Zustand'ın tek durum deposu yaklaşımından farklıdır.