Ben bir sanal dom modülünün birincil yazarıyım , bu yüzden sorularınızı cevaplayabilirim. Aslında burada çözülmesi gereken 2 sorun var
- Ne zaman yeniden oluştururum? Cevap: Verilerin kirli olduğunu gözlemlediğimde.
- Nasıl verimli bir şekilde yeniden oluşturabilirim? Yanıt: Gerçek bir DOM yaması oluşturmak için sanal bir DOM kullanma
React'te bileşenlerinizin her birinin bir durumu vardır. Bu durum nakavtta veya diğer MVVM tarzı kütüphanelerde bulabileceğiniz gözlemlenebilir bir gibidir. Esasen, React sahneyi ne zaman yeniden oluşturacağını bilir , çünkü bu verilerin ne zaman değiştiğini gözlemleyebilir. Kirli kontrol, gözlemlenebilirlerden daha yavaştır, çünkü verileri düzenli aralıklarla yoklamalı ve veri yapısındaki tüm değerleri tekrar tekrar kontrol etmelisiniz. Karşılaştırma yapmak gerekirse, durum üzerinde bir değer ayarlamak, bir durumun değiştiğini bir dinleyiciye sinyal verecektir, böylece React durumdaki değişiklik olaylarını dinleyebilir ve yeniden oluşturma sırasını sıralayabilir.
Sanal DOM, DOM'un verimli bir şekilde yeniden oluşturulması için kullanılır. Bu gerçekten kirli verilerinizi kontrol etmekle ilgili değildir. Kirli denetimle veya denetlemeden sanal bir DOM kullanarak yeniden oluşturabilirsiniz. İki sanal ağaç arasındaki farkın hesaplanmasında bazı ek yükler olduğunu doğru söylüyorsunuz, ancak sanal DOM farkı, verilerinizin değişip değişmediğini DOM'da güncellemenin gerekip gerekmediğini anlamakla ilgilidir. Aslında, diff algoritması kirli bir denetleyicinin kendisidir ancak bunun yerine DOM'un kirli olup olmadığını görmek için kullanılır.
Sanal ağacı yalnızca devlet değiştiğinde yeniden oluşturmayı amaçlıyoruz. Bu nedenle, durumun değişip değişmediğini kontrol etmek için gözlemlenebilir bir yöntem kullanmak, gereksiz yeniden oluşturmaları önlemenin etkili bir yoludur ve bu da çok sayıda gereksiz ağaç farkına neden olur. Hiçbir şey değişmediyse, hiçbir şey yapmayız.
Sanal bir DOM güzel, çünkü kodumuzu tüm sahneyi yeniden oluşturuyormuş gibi yazmamıza izin veriyor. Perde arkasında, DOM'u nasıl beklediğimize bakacak şekilde güncelleyen bir yama işlemi hesaplamak istiyoruz. Dolayısıyla sanal DOM fark / yama algoritması muhtemelen en uygun çözüm olmasa da , uygulamalarımızı ifade etmemiz için bize çok güzel bir yol sunuyor. Sadece tam olarak ne istediğimizi beyan ederiz ve React / virtual-dom, sahnenizi nasıl bu hale getireceğinizi öğrenir. Manuel DOM manipülasyonu yapmamız veya önceki DOM durumu hakkında kafa karıştırmamız gerekmez. Tüm sahneyi yeniden oluşturmak zorunda değiliz, bu da onu düzeltmekten çok daha az verimli olabilir.