Photo by Lautaro Andreani on Unsplash

React

React 19 ile Gelen Yenilikler

React 19 ile birlikte gelen yeniliklere kısaca göz atalım.

Onur Dayıbaşı
Frontend Development With JS
2 min readJun 22, 2024

--

Daha önceden yazmış olduğum blog yazısında React 18 ile birlikte gelen özelliklerden bahsetmiştim. Bu özelliklerin bir çoğu performans, paralelleşme, sunucu tarafındanki veri erişimi ile UI’daki rendering işlemlerinin ve kütüphane yüklenme ihtiyaçlarının azalması üzerine odaklanılmış yeteneklerdi.

React 18 ile birlikte gelen özelliklerin bir kısmı;

  • Concurrency
  • Suspense
  • Streaming
  • Partial Hydration
  • RSC
  • Transition

React 19 ile birlikte

React Compiler ile daha önceden re-rendering konusunda uyguladığımız useMemo, useCallback ve memo yaklaşımlarına gerek kalmayacak. Ve buna benzer DX anlamında kod yazımını basitleştirecek bir çok özellik ekleniyor.

Re-rendering ile ilgili daha detaylı bilgi anlamak için bu linkteki blog yazılarımı okuyabilirsiniz, veya ekranın sağ kısımda yer alan e-kitapları indirebilirsiniz.

Server Components: React Web uygulamalarını Bileşen(Components) ve Sınırlar(Boundary) üzerine kurgular. React sadece istemcide çalışabilen bileşenler üzerine bir yapıdayken artık, sunucuda işletilebilen bileşenleride destekler hale getiriyor. Bu konu hem büyük bir esneklik ve zenginliği , hemde karmaşıklığı beraberinde getiriyor. use server

Actions : React’ın HTML Form elemanlarının onSubmit işlemini hem istemci, hemde sunucu tarafında çalıştırabilmesini sağlayan bir özelliktir.

Document MetaData: SEO işlemleri için SPA’da HTML Meta Tag’ lerini güncellemek için useEffect içerisinde document.title vb.. ifadeler kullanıyorduk, bunun yerine artık JSX içerisinde direk <title> <meta ..> kullanabileceğiz.

Asset Loading: Image, Stylesheet, Script vb dosyaların yüklenmesi sırasında oluşabilen performans problemlerini gidermek adına Resource Preloading API geliştirmişler. Bu sayede ilgili asset’ lerin istemciye indirilip indirilmediğinin kontrolü, arka planda bu asset’ lerin yüklenmesi gibi gerçekleştirilebilecek.

Web Components: React bileşenlerinin Web Component’ları ile birlikte çalışmasını sağlayacak özellikler getiriliyor. Bu sayede Web Bileşenlerinde yer alan Custom elements, shadow DOM, and HTML templates kullanabileceğiz.

New React Hooks: Yeni çıkan React Hook’lar. Bu Hook’lar HTML DOM ve JS ile daha uyumlu çalışarak geliştiricilerin daha fazla React dili ile kod yazmasını sağlayacaktır. use, useFormStatus, useFormState, useOptimistic.

Okumaya Devam Et 😃

Bu yazının devamı veya yazı grubundaki diğer yazılara erişmek için bu linke tıklayabilirsiniz.

--

--