14 puan yazan composite 2023-07-13 | 1 yorum | WhatsApp'ta paylaş

JSX'in öncüsü React ile JSX'ten türeyen ve React'ten farklı olarak sanal DOM kullanmayan Solid.js arasındaki farklara baktık.

Bir React geliştiricisinin Solid.js'e yaklaşması durumu varsayıldığında, temel olarak aşağıdaki farklar öne çıkıyor.

  • React'in hook fonksiyonları yalnızca bileşen fonksiyonu içinde kullanılabilirken, SolidJS'in durum yönetimi fonksiyonları bağımsız bir durum yönetimi tekniği gibi çağrı açısından kısıt olmadan kullanılabiliyor.
  • React'in side-effect fonksiyonu olan useEffect, tek bir fonksiyon içinde yan etki anındaki işlemeyi ve temizlemeyi birlikte sunabilir; ayrıca etkilenecek durumu manuel olarak da belirleyebilirsiniz. Buna karşılık Solid.js'in side-effect fonksiyonu createEffect, Svelte'te olduğu gibi gövde içinde açıkça belirtilen durum yönetiminden etkilenir; etkilenecek durumu manuel olarak vermez ve dönüş fonksiyonu sağlamaz, ancak tek bir durum yönetimi yaşam döngüsü ortamı sunduğu için onCleanup üzerinden temizleme fonksiyonu kullanılabilir.
  • Durum kapsamı yönetimi açısından React ile kullanım farkı yoktur.
  • Dinamik bileşenler, koşullar ve döngüler söz konusu olduğunda React, durum değiştiğinde gövdenin yeniden yazılması özelliği sayesinde JS mantığını kolayca kullanarak çözüm üretebilir; ancak Solid'de gövde korunduğu için bunu sağladığı yerleşik bileşenlerle çözmek mümkündür.
  • React'in lazy ve <Suspense> bileşenleri Solid.js'te de sunuluyor.
  • Solid, React'ten farklı olarak asenkron reaktiviteyi dikkate alan durum yönetimi yardımcı fonksiyonları sunuyor.
  • React'teki ref ile Solid.js'teki ref kullanımı benzerdir; ancak React'te genellikle referans için useRef gibi özel fonksiyonlar kullanılırken, Solid.js'te bunun yerine basitçe let değişkeni kullanılabilir.
  • Solid.js, Svelte gibi vanilla JS'in yaşam döngüsünü yöneten use action özelliği sunuyor.
  • React'te props, destructuring ile tek başına kullanılsa bile özellik değiştiğinde gövde yeniden yazıldığı için sorunsuz çalışır; ancak bu yöntem Solid.js'te reaktif olmadığı için destructuring yoluyla tekil prop kullanımı mümkün değildir. Bunun yerine nesneyi olduğu gibi kullanmak ya da nesne ayırma/birleştirme sağlayan yardımcı fonksiyonlarla (splitProps vb.) ayırıp yine nesne gibi kullanmak gerekir.

1 yorum

 
firea32 2023-07-17

En büyük fark useState ile useSignal arasındaki fark. Verinin nasıl bağlandığı görünür olmadığı için debug ederken çok zorlandığımı hatırlıyorum.