ASP .NET Core Blazor ve React Arasındaki Farklılıklar

Herkese selamlar !

Son zamanlar da yazılım geliştirmenleri yani meslektaşlarımız arasında ciddi bir furya dolaşıyor. Blazor ! Tam olarak blazor nedir ve React arasında ki farklılıklar nelerdir bir ona bakacağız.

Blazor Nedir ?

Normalde bir single page applicationa ihtiyacımız olduğunda javascript ya da typescript tabanlı bir yapıya ihtiyaç duyardık. Aklımıza ilk gelenler ise angular ya da react olur bu şekilde devam ederdik. Microsoft ise 2018 yılında bu akıma dahil oldu. Blazor, .net ile interaktif bir şekilde kullanılabilen istemci(client) tabanlı web UI oluşturmamızı sağlayan bir framework geliştirdiğini duyurdu. Üstelik bu zamana kadar  .NET teknolojileri ile çalıştıysanız işinizi ciddi anlamda kolaylaştıracak demektir. Zengin ve kullanıcı ile etkileşimli arayüz tasarımını kurgularken c# kullanabilecek , server tarafı ya da client tarafı içerisinde kodlama yaparken benzer mantık ile kodlayabilecek , html ve cssi entegre bir şekilde tasarlayabilecek, kurguladığı yapıyı ise mobil tarayıcılar dahil olmak üzere her yerde çalıştırabilecektir.Blazor tabiki de yeni çıktı ve hızlı yayılıyor şimdilik göze çarpan ortak noktalar bunlar peki react ile aralarında ki farka bir göz atalım.

Component ?

Blazor içerisinde yer alan component mantığı ile react içerisinde yer alan component mantığı bire bir aynıdır. Componentlerinizi hazırlayıp içe içe bir şekilde kullanarak kullanıcı arayüzünüzü oluşturabilirsiniz.

Blazor içerisinde yer alan componentler tıpkı reactta yer aldığı gibi sınıf şeklinde yazılmıştır ve benzer bir yaşam döngüsüne sahiptir. Bu demek oluyor ki react ya da angular üzerinde çalıştıysanız kolay bir şekilde blazora alışabilirsiniz aynı zamanda asp.net ya da asp.net  mvc içerisinde bir geçmişiniz var ise de razor söz dizimini (syntax) kullandığı için ciddi anlamda kolaylık sağlamaktadır.

Routing ?

React içerisinde routing yapmak istiyorsanız react-router-dom kullanarak kendiniz implemente etmelisiniz. Mevcut yapıyı kullanmak istemiyorsanız ise 3.parti bir kütüphane kullanarak routing işlemini gerçekleştirebilirsiniz. Blazorda ise routing tam olarak frameworkün bir özelliğidir. Componentler arasında tanımlamalar yapmak ve bunları routing içerisinde kullanmak ciddi anlamda kolaydır. React içerisinde 3.parti bir kütüphane kullanmaktansa blazor içerisinde varolan yapıyı kullanmak şu an için tercih edilir gibi duruyor.

Data Binding ?

Data binding kısmında ise öncelikle şunu söylemek istiyorum iki yapı içinde de two-way binding geçerlidir. Zincirleme bir şekilde binding yaparken ise yani x->y->z->…. şeklinde  binding söz konusu ise tartışmasız bir şekilde react tarafının daha başarılı olduğunu söyleyebilirim. Blazor başarısız mı peki kesinlikle hayır fakat ikisi içerisinde debug yapmaya kalktığınızda blazorun bazı noktalarda çok stabil davranmadığını görebiliyoruz. Tabi şu an blazor çok yeni bir platform ve zamanla daha iyi olacaktır diye düşünüyoruz.

Interop ?

Blazor .NET runtime altyapısını kullandığından dolayı tabiki de c# ile stabil bir şekilde çalışması şaşırtıcı değildir zaten bir aşama da çıkış amacının o olduğunu düşünürsek bu tarz bir şey olmazsa ciddi bir dezavantaj olurdu. Gerçek avantaj ise hem client hem de server taraflı kodlama yaptığınız zaman ortaya çıkmakta. .Net core ile çalışıyorsanız böyle bir durumda işiniz ciddi anlamda kolay. Peki bunu react ile yapabilir misiniz ? Tabiki de evet fakat react söz konusu ise back-end tarafınız node.js olduğu sürece bunu gerçekleştirebiliyorsunuz. Özellikle eklemek istediğimi bir konu ise siz blazor üzerinde uygulama geliştirirken bir takım eksikliklerle kesinlikle karşılaşacaksınız ama henüz yeni olduğu için bu eksiklikler zamanla giderilecektir diye düşünüyorum. Bunu belirtmemde ki amaç ise şu blazor altında JSRuntime servislerini kullanarak ihtiyaç duyduğunuz js kütüphanesini çağırıp kullanabilmektesiniz. İleride bunlara ne kadar ihtiyaç duyarız tabi biraz tartışmaya açık.

Dependency Injection ?

Blazor çatısı altında dependency injection kullanabilirsiniz. Tam olarak ise bir componentin içerisinde belirli bir işi yaptıracağınız ve çalışma zamanında iş sonucunu yine aynı component altında göstermesini istediğiniz zaman kullanabilirsiniz. Birbirinden farklı amaçlar ile kullanılan fakat sonuçları entegre bir şekilde kullanmak istediğiniz componentler içerisinde özellikle belirtiyorum ki tüm bunları beraber yapmak istediğiniz noktada gerçekten kullanışlı bir yapı sunar bizlere. React içerisinde ise yine aynı durum söz konususudur fakat react blazora göre daha eski olduğu için biraz esneklik söz konusudur.

Prerendering?

Pre-rendering nedir ilk önce bunu cevaplarsak çok iyi olur bu başlıkta. Arama motorlarının çoğu client taraflı javascript kodunu çalıştırmaz ve bu genelde react ya da blazor gibi teknolojiler kullanılarak yapılan web uygulamarı için ve bu uygulamalar özelliklede arama sonuçları içerisinde üst sıralarda çıkmak istiyorlar ise ciddi bir dezavantajdır. Prerendering sayesinde ise çalıştırılmasını istediğiniz js ya da ts önden çalıştırılır. Önden çalıştırılan bu kodların sonucu eğer ki arama motorlarında gözükecek bir takım sonuçlar ortaya çıkartacaksa o zaman prerendering gerçek anlamda işimize yarar. Sonuç olarak ise hem react hem de blazor prerendering destekler.

Debugging ?

Herhangi bir platform içerisinde JS kodunu ne kadar kolay debuglayabiliyorsanız react içerisinde de bu mümkündür. JS üzerinde çalışırken debug yapmak için çoğu browser içerisnde tool vb. yapılar oldukça fazladır. Blazor bu durumda react ile yarışamaz haldedir. Şu an içerisinde ki mevcut debug mekanizması ciddi anlamda sınırlıdır. Tam olarak piyasaya çıktığında browser desteğini ne kadar arkasına alacağı ile de doğru orantılıdır. Framework olgunlaştıkça bu sorunun ortadan kalkacağını düşünsemde bir parça tedirginlik söz konusu.

Özet Olarak ? React ve blazorun çok ortak noktasının olmasına rağmen esas farklılıklar nasıl bir server taraflı kod yazdığınızda ortaya çıkacaktır.Şu an için client side yani istemci taraflı basit bir uygulama yazdığımızı varsaydığımızda ciddi bir fark ortaya çıkmamaktadır. Tabi özellikle tekrar etmek istediğim bir şey var o da blazor henüz tam olarak olgunlaşmamış bir yapıdır. Büyük uygulamalar içerisinde eksikliklerini hissettirecektir. Zamanla bu eksiklikler kapatıldıkça teknoloji açısından neye , nasıl karar vermemiz gerektiğini bir kez daha düşünmekte fayda var.