ASP.NET Core 2.0 Razor vs Angular / React / etc

Ekibim ve ben Kurumsal düzeyde bir web uygulaması geliştirmeye başlamak için fon aldık (ne yaptığının ayrıntılarına girmeyeceğiz). Uygulamanın birçok ayrı web sayfası olacak, ancak bu sayfalardan ikisi daha odaklı ve çok ağır - çok sayıda kullanıcı etkileşiminde olduğu gibi, toplu verileri görüntüleyen modlar, websocket bağlantıları, sohbet vb.

Projede Baş Mimara atandım, bu yüzden en son web çerçeveleri üzerine biraz araştırma yapıyorum. Arka uç için bazı testler yaptık ve Azure SQL platformunu kullanmaya karar verdik. Şimdiye kadar, Core 2.0 ile ASP.NET için yapılan ve yapılmakta olan iyileştirmeleri beğeniyorum. ASP.NET MVC'nin önceki sürümlerine göre özellikle Razor altyapısı.

"Yeni" Razor vs. Angular / React ve benzerleri hakkında bazı uzman görüşleri almak istedim. Özellikle performansla daha çok ilgileniyorum. Core 2.0 Razor, istemci tarafı işleme çerçevelerine nasıl dayanır? Farklar önemsiz mi? Uygulamamız potansiyel 1.000.000 kullanıcıyı (yaklaşık 100.000 eşzamanlı) hedefliyor.

Şimdiden teşekkürler!

Azure SQL kullanarak bir Angular ön uç ve bir ASP.NET Core API arka ucu ile devam ettik. Core Razor'u test ettik ve eski Razor'dan daha iyi olmasına rağmen Angular, sonunda bizim için çok daha hızlıydı. Kullanıcı deneyimi devam ettiği sürece, Angular (veya React) performans açısından çok daha üstündür. Angular'ın model bağlama yönleri, sunucu tarafı görüntülemenin devasa bir avantajı olduğunu gördük. Bununla birlikte, Razor (veya genel olarak sunucu tarafı oluşturma) kullanmak, veriler gittiği sürece daha iyi bir genel bütünlüğe katkıda bulunur ve ön uçtan arka uca daha iyi bir veri geçişi sağlar. Bir ön uç çerçevesi ile bir API arasında gerçek bir bağlantı kopukluğu vardır. Sunucuya aktarılan tüm verilerin yazılı nesnelere dönüştürülmesi gerekir - bu, iki ayrı POCO model setini yönetmeniz gerektiği anlamına gelir. Bu, sunucu nesneleri ve ön uç nesneleri hizalı değilse sorunlara neden olabilir. Şu anda Entity Framework Core çok olgunlaşmadığından nesneleri güncelleme, alt nesneler dahil olmak üzere nesneleri sorgulama vb. Konularda sorun yaşıyoruz.

Genel olarak, bu kurulum şimdiye kadar bizim için harika oldu! Eğer daha rahat ederseniz React'in Angular'ın yerini alacağını düşünürdüm. Çok kolay bir geçiş olan Angular'ı öğrenmem gerekiyordu ve şimdi onu seviyorum!

Sunucu tarafında API ile Angular / React kullanarak:

• sunucu tarafında HTML oluşturma sürecini ortadan kaldırır ve cpu tasarrufu sağlarsınız
• api, bir kursun küçük yük (json) ve Razor (html) üretir, boyut olarak çok daha büyük olur, sürekli tam sayfa yeniden yüklemeler ve geri gönderme gidiş-dönüşü olur. API ve spa bant genişliğinden tasarruf sağlar
• api ve spa, farklı sürümleme, ölçeklendirme ve dağıtım senaryolarına sahip olabilir
• API kullanarak mobil uygulamayı da destekleyebilirsiniz ve Razor ile başlarsanız gelecekte api'ye ihtiyacınız olabilir.

Ancak Angular / React'i kullanarak müşteriler için endişelenmelisiniz:

• istemci javascript'i etkinleştirmelidir
• istemci modern tarayıcılara sahip olmalıdır
• istemci yeterince güçlü donanıma sahip olmalıdır
• SEO

Kriterlerim yok. Ancak, JQuery, Razor, .NET MVC (C #), AJAX çalıştıran birkaç projem var. Mücadele ettiğin ölçekte değil.

Tavsiye .. Her şeyi iyice düşündüğünüzden ve en iyi uygulamaları takip ettiğinizden emin olun. İşleri sürdürülebilir kılmak için denetleyicileri, görünümleri, modelleri daha küçük ve anlamlı gruplara ayırdığınızdan emin olun. Başladığımda, her şeyi tek bir Ana denetleyiciye ve paylaşılan klasördeki bir ton görüntüyü yerleştirme hatasını yaptım. İlk başta iyiydi, ancak özellik sürünmesi başladığında, bir karmaşa haline geldi ve geri dönüp yeniden tasarlamak zor oldu.

Ayrıca Linq2SQL kullanıyorum. Her şey için model oluşturma hatası yaptım ve sonra sonuç kümesini sorgularımdan bir model olarak döndürebileceğimi fark ettim. duh.

.NET MVC'ye gidiyorsanız ve performans konusunda endişeleriniz varsa, karşılaştığım şeyler bunlar:

Büyük HTML blokları oluşturan kısmi görünümler DÖNDÜRMEYİN! Her şeyi en aza indirdiğinizden emin olun. Tüm beyaz boşluklardan kurtulun. Daha küçük kimlik adları kullanın. Mümkün olduğunca hafif html oluşturmak için zaman ayırın. JSON'u geri verin ve müşterinin işin bir kısmını yapmasını sağlayın.

CSS'nizi nasıl geliştireceğinize dikkat edin. Çok sayıda satır içi stil kullanmayın, daha sonra küçültebileceğiniz CSS dosyalarına dahil etmek için zaman ayırın.

Aynı şey istemci tarafı JS için de geçerli. JS'yi kısmi görünümlerin içine yerleştirmek cazip geliyor. İşleri düzenli tutun.

IE'de görüntü oluşturmak korkunç. Özellikle çok sayıda görüntü varsa. Elbette kaliteyi kaybetmeden görüntüleri olabildiğince sıkıştırdığınızdan emin olun.