WEB API
Service Workers — 1 (PWA Nedir)
Web Workers bir türü olarak geliştirilen Service Worker API sini anlatmadan önce bu ihtiyacın nereden ortaya çıktığını ve hangi alanda kullanılacağını anlatarak bu yazı serisine başlayalım. PWA (Progressive Web App) Nedir ?
Bu yazı daha önceden başlamış olduğum Web API yazı serisinin devamı niteliğindedir. Web App (Web Uygulamaları) son dönemde masa üstü içi geliştirilen uygulamaların bir çoğu tarayıcı ortamına taşınarak buradan erişebilir hale getirilmeye başlamıştır.
Bunun yanında mobilin gelişmesi ile bir çok uygulamada Native uygulama olarak geliştirildi. Native uygulamalar 2 türde geliştirilebilir Apple ve Android önerdiği araçlar ve diller ile Apple için XCode → ObjectiveC/Swift , Andoid için AndroidStudio → Java/Kotlin, kullanmalısınız.
Eğerki ben her platforma native geliştirme yapmak için yeni dil ve araç öğrenmek istemiyorum diyorsanız.Bunun içinde alternatif araçlar bulunuyor. Xamarin, Flutter, Electron, React Native, Ionic tüm bu platformlar için Android, iPhone, MacOS, Windows için Native kodlar üretebiliyor.
Temelde 2 tip uygulama söz konusu
- Native/Hibrid Uygulamalar
- Web Uygulamalar
Native uygulamalar AppStore’dan indirilen ve platform kaynaklarına daha iyi şekilde erişebilen uygulamalar. Örneğin kamera, sensörler, network, cpu, disk , dosya sistemi erişebilir ve daha performanslı çalışır.
Web uygulamaları ise çalışmak için bir tarayıcıya ihtiyaç duyar. Chrome, Safari, Edge, Firefox veya Opera gibi browser üzerinden çalıştırılan uygulamalardır.
Web uygulamaların 2 türü var diyebiliriz.
- İçerdeki verinin public olmadığı sadece ilgili müşteri girdiğinde görebildiği verileri gördüğü uygulamalar.
- İçerdeki verinin public olduğu E-Ticaret, Gazete, Blog, Portal türündeki uygulamalar.
Progressive → ilerici anlamında kullanılır. Burada Web Uygulamalarını daha ileriye taşıyan teknoloji anlamına geliyor. Web uygulamaların Native uygulamalara göre (app store ihtiyaç duymaması, güncelleme kolaylığı, arama motorları tarafından kolay indekslenme) avantajları olsada (kullanıcı alışkanlıkları, performans, cihaz özelliklerini desteklememe, tarayıcı gibi bir aracı kullanma gibi) dezavantajlarıda içerir.
Web uygulamalarını bir adım ileriye taşımak için bir takım teknik yeteneklerle Native Uygulamaya yaklaştırmaya çalışmışlar. Bunun adına PWA yani Progressive Web App demişler. Bu özellikleri ve desteklediği ortamları listelersek;
- Kurulabilir (Installable) Olması: Native uygulamalar AppStore veya başka adreslerden indirerek kurabilirsiniz. Kurduğunuzda ana ekrandan bir ikon sayesinde hızlı bir şekilde uygulamayı çalıştırabilirsiniz.
- Offline Çalışabilmeyi Desteklemesi: İnternet olmadığı durumlarda uygulamanın belli ölçüde çalışabilir olması, internetin tekrar bağlandığında kullanıcı girdilerini sync sisteme aktabilmesi.
- Responsive Olması: Ekranların Desktop, iPad, Mobile cihazlarda sorunsuz şekilde çalışması, layout buna göre güncellemesi.
- Hızlı ve Perfomanslı Çalışması: Uygulama ekranının hızlı açılması ve sonradan da hızlı çalışması. Bunun için sadece gerekli JS, CSS ve verilerin download edilmesi veya download edilen verilerin tekrar tekrar çekilmemesi.
Daha başka ek özelliklerde sayabiliriz tamamiyle erişebilir(accessible), aramalarda sayfaya erişebilen (search), he türlü girdi cihazı ile çalışabilen (input types), bildirim, geolokasyon ve diğer yetkiler için izin talebi(permission request) vb.
Kısaca Teknik
1. İleri Düzey Kullanıcı Deneyimi ve Offline Çalışma
Service Worker’lar arkaplanda veri sync yaparak kullanıcıya daha akıcı bir şekilde verinin görüntülenmesine, internetin olmadığı durumları algılayıp kullanıcı isteklerini cache üzerinden karşılamaya çalışır. Ayrıca veriler local ortamda mevcut ise tekrar tekrar yükleme ihtiyacı duymaz.
2. Web Push Notifications (Web Bildirimleri)
Service Worker’lar arkaplanda PushAPI bildirimlerini alarak bunu NotificationAPI üzerinden kullanıcıyı bilgilendirmek için kullanırlar.
3. Home screen & Splashscreen
JSON Manifest dosyası içerisinde uygulama ismi, iconu vb bilgileri barındırarak, kullanıcı webapp masa üstüne kaydetmesine olanak sağlar.
4. Geolocation, Video/Image Capturing, Bluetooth
Kullanıcı izni alınarak mobil cihazların lokasyon bilgisini alabilmek için Geolocation API , resim ve videolara erişmek için Media Capture API, Bluetooth erişebilmek için Bluetooth API faydalanılabilir.
Bu yazıda PWA’dan kısaca bahsettik, Service Worker’ın bu özelliklerin kullanılabilmesi için temel teşkil eder. Bir sonraki yazımda Service Worker anlatabiliriz artık :)
Referanslar
- PWA Checklist
- PWA Pros/Cons
- PWA Browser Support
Okumaya Devam Et 😃
Bu yazının devamı veya yazı grubundaki diğer yazılara erişmek için bu linke tıklayabilirsiniz.
