Yazılım Geliştirme Trendleri 2017/7 SPA
Eskiden web sitelerimiz vardı. Sunucudan hangi sayfayı istersek, sunucu onu aynen gönderiyordu. Herkes aynı sayfaları görüyordu. Bir sayfayı kapıyor, diğerini açıyorduk.
Sonra web uygulamalarımız oldu. Sunucu, isteklere göre sayfaları hazırlayarak istemciye gönderir oldu. Her bir istek için, sunucuda bir sayfa dinamik olarak oluşturuluyordu. Sayfa içerikleri, sizin kim olduğunuza, tarihe ve (çoğunlukla veritabanındaki) güncel verilere göre otomatik oluşuyordu.
İkibinlerin başında Ajax (Asynchronous JavaScript and XML) hayatımıza girdi. Artık kullanıcı yeni bir sayfa için istekte bulunmanın dışında, yeni bir tür istekte daha bulunabilir oldu. Üstelik bir Ajax isteğinde bulunduğunda mevcut sayfa kapanmıyor, istek arka planda sunucuya ulaşıyor, sunucu istemciye bir veri ile cevap veriyordu. Single Page’in kapısı aralandı.
Uzun süre jQuery, XMLHttpRequest, CSS Selectors ve JavaScript DOM manüpilasyon fonksiyonları (innerHTML, removeChild, appendChild..) kullanarak, bir sayfayı terk etmeden, sunucu ile arka planda Ajax ile iletişim kurarak, sayfa üzerinde güncellemeler yaparak, sayfayı terk etmeden yapabileceklerimizin sayısını bir hayli arttırdık. Örneğin bir ürünü sepete eklediğimizde, artık sayfanın yenilenmesine gerek kalmıyordu. Artık birçok sayfaya gerek duymaz olduk, birçok sayfa ortadan kalktı, sayfalarımız daha becerikli oldu. Kullanıcılar da işlemlerini daha hızlı hallettiler. Sayfalar arasında savrulmaktan kurtuldular.
Sonra “router” istemci tarafına taşındı. Kullanıcı yeni bir sayfaya gitmek istediğinde, bu isteğin yolu “router” tarafından kesildi. Artık “router” karar verecekti. Ve router kararını verdi: “Yeni bir sayfaya daha gitmeyeceğiz. Ben istediğiniz sayfayı ayağınıza getirir, adres barınızı da güncellerim.”
Böylece Single Page (web) Application (SPA) gerçekleşmiş oldu.
Bugün artık SPA mimarisinin, birçok uygulama için en verimli, en kullanıcı dostu ve en hızlı çözümü sağladığı bir gerçek. SPA mimarisi, masaüstünde kullandığımız programlardaki veya akıllı telefonlarda kullandığımız uygulamalardaki komforu web’e taşıyor. Önümüzdeki birkaç yıl içerisinde, tüm büyük sitelerin SPA mimarisine geçiş yaptığını gözlemleyeceğiz.
SPA’yı ilk ve doğru uygulayanları, büyük bir ödül bekliyor olacak.
Web’de SPA’ya geçiş, son 15 yılda web uygulamaları mimarisinde yaşanan en radikal geçiş olacak. Eskiden sunucu tarafında yapılan işlemlerin büyük çoğunluğu, artık istemci tarafında çalışacak olan (SPA) uygulamamıza devrediliyor. Dolayısıyla istemci tarafındaki uygulamamız artık sayfa üzerinde basit değişiklikler yapan fonksiyonlardan ziyade, bütün sayfayı yöneten, güncelleyen, gerçek uygulama mimarilerine dönüşüyor. Bu dönüşümün öncü çatı uygulamaları Angular ve React. (~Vue, Ember, Knockout? …)
SPA mimarisinde doğal olarak sunucunun sorumluluk alanı da bir hayli değişiyor (daralıyor). Artık sunucu, istemcinin bir isteği doğrultusunda basit bir başlangıç (HTML) sayfası ile, içine gömülü bir istemci uygulaması (SPA) gönderiyor. Bu uygulama, sayfa istemciye ulaşır ulaşmaz, sayfayı (HTML’i) baştan sonra yaratıyor ve kullanıcının isteklerine göre sayfayı (HTML’i) baştan sonra sürekli güncellemeye devam ediyor. Eğer bu süreçte sunucudan ek verilere ihtiyaç duyarsa, bunu arka planda sunucu ile kuracağı (asnyc) Ajax / WebSocket iletişimi ile sağlıyor. SPA mimarisini, akıllı telefonlarda çalışan mobil uygulamalara benzetebiliriz. Önce uygulamayı yüklüyoruz (siteyi ilk ziyaret ettiğimizde) sonra uygulama, gerek duydukça sunucu ile arka planda veri alış-verişinde bulunuyor. Ancak bir daha sunucudan yeni bir sayfa isteğinde bulunmuyoruz.
- SPA mimarisi, kullanıcı deneyiminde, her alanda (hız, kullanılabilirlik, beceri ve verimlilik) kat-kat daha iyi bir deneyim yaşanmasını sağlar.
- Klasik mimaride istemci tarafında yazılan kod, toplam kodun %5'i (sunucudaki kod ~%95) düzeylerinde iken, SPA mimarisinde istemci tarafında yazılan kod, toplam kodun %60–70'i (sunucudaki kod ~%30–%40) bulur.
- SPA mimarisine geçiş yapıldığında sunucu tarafındaki birçok yapıyı da zaman içinde iyileştirmek mümkün olacaktır. Örneğin load balancer istemci tarafına transfer edilebilir, böylece (Sticky session!) istemcinin yoğunluğa göre kendisine en iyi hizmet verecek sunucuyu seçmesi otomatik sağlanabilir.
- SPA mimarisi, WebSockets ve RxJS gibi teknikler ile daha önce mümkün olmayan “real-time” (eşzamanlı) uygulamalar geliştirilebilir.
SPA mimarisine geçiş, mevcut kullanılan tekniklerin birçoğunun ters-düz olması anlamına geleceği için, kurumsal şirketlerin bu hususta deneyimli kişilerden danışmanlık almasını tavsiye etmekteyim. Bu hususta bana da direkt ulaşabilirsiniz: +90 533 357 49 19
**
Eğer sıfırdan yazılım kariyerine başlamak istiyorsanız, 3 aylık yoğun programlar düzenliyorum. Bilgi için: https://www.yenikodyazilimkursu.com/
—
Test Invite online sınav sistemi ile tanışın: İşe alım sınavları, Genel Yetenek Testleri ve İngilizce Seviye Tespit Testleri
Video kayıtlı ve zorunlu tam ekran ile güvenli online sınavlar yapmak için: https://www.testinvite.com/lang/tr/online-sinav-sistemi.html
