GoodBarber Blog Türkiye
GoodBarber
blog-goodbarber

PWA - Progressive Web Uygulamaları


Written by on Pazartesi 20 Mart 2017 08:00


PWA - Progressive Web Uygulamaları
Bir önceki yazımızda mobilin davranışlarımızı nasıl etkilediğinden, masaüstü kullanımı ve beklentilerden bahsetmiştik—bu yeni bir konseptin de oluşmasına neden oldu, Progressive web uygulamaları. Bugün PWA konusunu daha derinden inceleyeceğiz. 

Progressive web uygulamalarının gittikçe daha çok ilgi çekmesinin temel nedeni farklı konularda en gelişmiş teknolojilere dayalı olmaları ve bir yandan web diğer yandan da native uygulamalar konusunda en iyi teknolojiyi kullanmaları. Bu sebeple web uygulamaları ve native uygulamalar arasındaki boşluğu da dolduruyorlar. 

Native uygulamalar bilinen en iyi kullanıcı deneyimini sağlıyor. Fakat bu uygulamalar da belirli kısıtlamalarla yüzleşiyor, örneğin indeksleme (SEO), keşfedilebilirlik sorun oluşturabiliyor. PWA bu sorunu ortadan kaldırıyor. Progressive web uygulamalarını daha iyi anlayabilmek için konsepti tanımlayan öğeleri yakından incelemek gerekir. Progressive web uygulamaları 1) Duyarlıdır 2) Hızlıdır 3) Etkileşimi sağlar. 

Bu uygulama türünü daha yakından incelemek için GoodBarber Angular geliştiricisi Jean-Mathieu ile bir web sayfasını progressive web uygulamasına dönüştürme kriterlerini konuştuk. 

Duyarlılık

Progressive web uygulamalarının diğer bir önemli özelliği ise çevrimdışı çalışmalarıdır. Kullanıcı açısından bu durum oldukça önemlidir çünkü zayıf internet bağlantısı olan veya hiç bağlantı olmayan durumlarda görülen hata mesajını ortadan kaldırmış olur. 

PWA, içeriği kullanıcıya gönderebilmek için uygulama kabuğundan yararlanır. Bu kabuk, sayfanın yapısını çağırır, içerik yanıt vermese bile—elementleri üst bilgi, sayfa düzeni ve sayfanın yüklendiğini gösteren illüstrasyonu kapsar. 
Ayrıca bu uygulama türünün native uygulamaların görünüm ve hissini vermesi adaptif olmalarından kaynaklanır. Ekran ve cihaza uygun görünümü yakalamak da bu sayede mümkündür. 

Hız

Ek olarak, Progressive web uygulamaları service worker (hizmet işçisi)'a dayanır. Görevi, içeriği ön belleğe almadır uygulama başlatıldıktan hemen sonra. Böylelikle, ilk ziyaretten sonra içerik çevrimdışı olarak da mevcuttur. 


 

PWA - Progressive Web Uygulamaları
Bu davranış Google'ın tanıttığı RAIL modeli gerekleri ile de örtüşüyor. Response / Animation / Idle / Load — diğer bir deyişle  progressive web uygulaması kullanıcı isteğine yanıt vermeli, hareketi görüntülemeli, boşluk anını maksimum içeriği ön belleğe aktarmak amaçlı kullanmalı ve son olarak da bir saniyeden kısa sürede yüklemelidir! Tüm bunlar, progressive web uygulamalarının sektördeki pek çok web oyuncusuna karşı kazanma nedenlerinden başlıcalarıdır.

Etkileşim

Ek olarak, bir progressive web uygulaması ayrıca uygulama başlatılır başlatılmaz amacı içeriği ön belleğe alma olan hizmet işçisinden yararlanır. Bu sebeple ilk ziyaretten sonra, içerik de çevrimdışı erişilebilir hale gelir, metinler listesi ve benzer detaylar da. 

Native uygulamaların yüklenmesi bir dezavantaj olarak (kullanıcı tarafından ekstra etkileşim gerektirdiği için) görülebilir. Bu anlamda progressive web uygulaması app yüklenmesini bir avantaja çevirir. Mobil ve tablette kullanıcı cihazın ana sayfasına uygulamayı yüklemek zorundadır. Bu "yükleme" tarayıcıya bilgiyi gönderir, ikon (her cihaz için uygun boyutta), başlatma ekranı (veya başlatma ekranında görülecek renk), portre / manzara görünümü veya her ikisi de, ya da uygulamanın kendi kendine tarayıcıdan bağımsız çalışabilmesi. 

Gelişmeler burada sona ermiyor. Progressive web uygulamaların kullanıcının ana sayfasında görülmesinin yanında diğer bir avantajı da anlık bildirimler gönderebilmeleri. Bu, ayrıca native uygulamaların da temel özelliklerinden biri. Eğer geliştirici PWA için anlık bildirimleri etkinleştirirse, hizmet işçisine arka plan görevi atamış olur. 

Şu an, PWA anlık bildirimleri Chrome, Firefox, Opera, Safari masaüstünde destekleniyor, mobilde desteklenmiyor. Sinyaller progressive web uygulamalarının native uygulamalara rakip olacağını gösteriyor, anlaşılan zamanla netleşecek... 

Progressive web uygulamaları en iyi web deneyimine dayandıkları için, daha güvenli bir web navigasyonu, yani HTTPs üzerinde sunulması gerekliliği de konular arasında. Bu arada, HTTPs iOS uygulamaları için de artık bir zorunluluk olduğu için, bu gereklilik geliştiriciler için ekstra iş olsa da, PWA'leri native uygulamalarla yarışmaktan alıkoymayacak. 

Eğer PWA devrimini özetleyen anahtar elementten bahsetmek gerekirse bu, hizmet işçisidir— diyor Jean-Mathieu. Çünkü hizmet işçisi ve arka plan görevleri anlık bildirimleri, ön belleğe alımı ve fazlasını yönetir. Bu özellikler  native "hissi ve görünümü" sunarken aynı zamanda sıradan bir web sitesini progressive web uygulamasına dönüştürür. 


Progressive web uygulamaları ile ilgili ayrıntılı bilgi sahibi olmak istiyorsanız, Google'ın hazırladığı listeyi buradan inceleyebilirsiniz.




Yeni yorum:

Facebook
Twitter
LinkedIn
Google+
Instagram


Agency Guide Free Ebook

Bültenimize abone olun

Yenilikleri ve en son özellikleri ilk öğrenenlerden olun






GoodBarber Haberleri uygulamasını indirmek için QR kodunu taratın!

iOS & Android için mevcuttur