**İleri web uygulaması** (İngilizce: Progressive web app), yeni bir yazılım geliştirme metodolojisini ifade etmek için kullanılır. Geleneksel uygulamalar dışında, İleri Web Uygulaması bilinen web sitelerinin ve mobil uygulamaların hibrit halde geliştirilmesi olarak değerlendirilebilir. Bu yeni uygulama yaşam-döngüsü çeşitli özellikleri bir araya getirir ve en modern tarayıcılar tarafından desteklenerek mobil tecrübenin faydalarını kullanıcılara sunabilmektedir.

Genel bakış
-----------

2005 yılından bu yana internet, statik web sitelerinden dinamik web sayfalarına Ajax teknolojisi ve *responsive* web tasarımları sayesinde hızlı bir şekilde gelişti.

### Dinamik ve Responsive Web

Web geliştirme teknolojileri statik HTML dokümanlarından dinamik PHP, ASP.NET, Ajax ve çeşitli sunucu ve istemli cihaz bazlı dillere ve kodlara kaydı.

Son olarak, İleri Web Uygulamaları, HTML5, CSS3 ve JavaScript'in yenilikçi özelliklerinin tanıtılması sayesinde gelişti. *Markup*(işaretleme dili), *styling sheets* ve *script*'lerin bu güçlü birleşimi sayfa unsurları ile kullanıcı etkileşimini, Macromedia Flash olmadan video oynatımına ve oyunların oynanmasına imkân sağladı. (Tüm bunlar sunucuda değil, istemci cihaz üzerinde gerçekleşmektedir.) Yakın zamanda yayınlanan CSS3 ve JavaScript altyapısı tasarım modellerini ve felsefesini değiştirdi; kutu modelini(*box model*) *grids* ve *flex*'ler takip etti, bunları *translations*, *transformations*, animasyonlar eşlik etti. *Style still*'e yeni yaklaşımı internetin sanal katmanını tanımladı.

### İnternet tarayıcıları

Bu değişikliklerin hiçbiri bilinen web tecrübesini ciddi şekilde değiştirmeyecektir.

### Mobil cihazlar

2007 yılında Apple iPhone piyasaya sundu. Bu cihaz ilk tamamıyla fonksiyonel dokunmatik tecrübeli akıllı telefondu. Web'te gezinti yapma imkânı veren bununla birlikte geniş çeşitlilikte *native* uygulama kullanıma izin veren, fiyatı makul, kullanışlı bir cihaz fikri hızlıca yayıldı.

### Mobil Kullanıcı Tecrübesinin Yükselişi

Uygulamaların popülaritesinin arakasındaki en önemli sebeplerden birisi daha iyi bir kullanıcı tecrübesidir. *Native* uygulamalar paket bir yapı olarak çalışırken geleneksel web uygulamaları gerçek zamanlı tarayıcıya yüklenir. Tarayıcı ayrıca bir soyutlayıcı olarak sistem donanımı ile web uygulaması arasında yer alır. Paketleniş kaynaklar ve direkt donanıma bağlanma yeteneği *native* uygulamaların daha performanslı çalışmasını sağlar.

Bir diğer uygulama kategorisi hibrit uygulama olarak adlandırılır, *native* uygulama özellikleri ile web uygulamaları özellikleri arasında yer alır.

Hibrit uygulamalar *native* mobil karakteristikliğini sergiler ve Uygulama Mağazalarından indirilmesi, kurulması ve mobil cihazın kısıtlı hafızasının bir kısmını tüketmesini gerektirir. Aynı zamanda mobil cihazın ana ekranında gözükürler.

Hibrit uygulamaların bir kısmı, mobil tarayıcılarda çalışsalarda bir şekilde web'in paylaşılan prensiplerini sağlamazlar:

* URL'leri yoktur yani bağlanılabilir değildir. Eğer web üzerinden bağlanılamıyorsa, web'in bir parçası olamazlar.
* *Markup* ve *styling* yapıları arama motorları tarafından bağlanılabilir değildir.
* Kullanıcı arayüzü zenginliği ve sistem yetenekleri ek fonksiyonel çekirdek vasıtasıyla farklıdır.
* Doğası gereği açık kaynaklı olan web'e karşı hibrit uygulamaların kodlarına erişilmez.

İleri Web Uygulamaları
----------------------

2015 yılında, Google'da Chrome Blink üzerine çalışan bir web developer olan Alex Russell, bir websiteyi çevrimdışı(offline) modda, istenilen kişiselleştirme yeteneğine sahip ve dokunma tecrübesi ile çalışıyor haldeki bir mobil uygulamaya dönüştürdü.

Alex, Uygulama mağazalarındaki web uygulamalarının paketleme ve yayınlama süreçini, web sitesini doğru içerik ile mobil yetenekli web uygulaması haline dönüştürerek ortadan kaldırdı. Yapıya yeni özellikleri devamlı ekleyerek geliştirmesini sürdürdü, bunlardan bazıları kişiselleştirme, ana sayfaya konumlandırma, bildirimler yetisi, çevrimdışı(*offline*) çalışma yapısı ve dokunma teknolojisi desteği gibi.

Bu sayede, geleneksel web uygulamalarının ve bununla birlikte çoklu platform(*cross-platform*) mobil uygulamaların sahip oldukları kısıtlamaları bir bir bu geliştirmeyi websitesi üzerinde geliştirerek aştır.

İleri web uygulamaları, web teknolojisi avantajları ile mobil native uygulama kullanıcı tecrübesini birleştirmek adına yeni bir trend ve umut oldu.

Karakteristiği
--------------

Google geliştiricilerine göre ileri web uygulamaları:

* **Progressive** - Tarayıcının ne olduğu önemli olmadan tüm kullanıcılarda çalışır.
* **Responsive** - Tüm formlara uygundur: Masaüstü, mobil, tablet ve kullanılacak yeni formlarda.
* **Bağlantı bağımsız(Connectivity independent)** - Çevrimdışı modda ya da düşük kaliteli network'te çalışılabilirlik.
* **Native görünümü(App-like)** - Native mobil uygulama gibi gözüken web uygulamaları üretmesi.
* **Güncel -** Service worker yapısı sayesinde her zaman güncellenir.
* **Güvenilir -** HTTPS üzerinden hizmet verdiği için verinin gözlemlenmesi ya da bozulmasına izin vermez.
* **Keşfedilebilir -** W3C *manifest* yapısı sayesinde uygulama olarak tanımlanabilme özelliği vardır. Service worker kayıt olma yapısı arama motorlarının onları bulmasına izin verir.
* **Tekrar ulaşılabilir (Re-engageable)** - Müşteri ile etkileşim mobil uygulama bildirimleri(*push notification*) desteği sayesinde mümkündür.
* **Kurulabilir -** Uygulama Mağazalarının yükleme ve kullanım zorluğu olmadan direkt ana sayfada uygulamanın yer almasını sağlanır.
* **Bağlanılabilir** - Karmaşık yükleme süreçi olmadan basit bir şekilde URL ile paylaşılabilirliği.

Teknolojisi
-----------

İleri web uygulamaları konsepti, web ve mobil yazılım geliştirme teknolojilerinin gelişiminin ortaya çıkardığı bir sonuç olması sebebi ile birkaç teknolojiyi kapsar:

1. HTML5, CSS3, JavaScript, Media Queries ve jQuery Responsive Web Tasarımı teknolojileri
2. Transport Layer Security (TLS) ile üst düzey güvenlik
3. *Web Manifest* ya da *Extensible Web Manifesto* teknolojisi native uygulama tecrübesi üretmek için
4. Servis workers çevrimdışı modda arka plan kodlarının işlenmesi için
5. Application Shell Architecture içeriğin dinamik yüklenmesi ve hızlı bir şekilde uygulamanın yüklenmesi için

Manifest
--------

W3C'nin JSON tabanlı bir tanımlamasıdır. Geliştiricilere web uygulaması ile ilgili metadata'ları koyabildiği merkezi bir yer oluşturur. Şunları içerir:

* Web uygulamasının ismi
* Web uygulaması iconları ve resim objeleri linkleri
* Web uygulamasını açmak ve başlatmak için tercih edilen URL bilgisi
* Web uygulamasının bir dizi karakteristikliği için konfigürasyon verileri
* Varsayılan web uygulaması oryantasyon(orientation) tanımlaması
* Tam ekran gibi görünüş modunun tanımlanması

Geliştiriciler web *manifest* dosyasındaki metadalar değiştirilerek uç kullanıcı arayüzünde kusursuz native uygulama tecrübesini İleri Web Uygulaması(*Progressive Web App*) sayesinde elde edebilmektedir.

Service Workers
---------------

Native uygulamalar, kullanıcı tecrübesi daha zengin ve performanslı çalışırlar. Bunun sebebi gerekli olan içeriğin, bileşenlerin ve kaynakların uygulamanın Uygulama Mağazalarından indirilme süresince cihazın hafızasına konumlandırılmış olmasıdır.

Buna karşın, geleneksel web uygulamaları güvenilmez web bağlantı hızları ve yükleme kısıtları sebebi ile problem yaşar. Tüm bunların üzerinden gelebilmek amacıyla Service Worker yapısı Web Worker yapısı gözetilerek tasarlandı ve kusursuz yükleme tecrübesini sunmaktadır.

Teknik olarak, Servis Worker web tarayıcılarında HTTP ve web taleplerini programlı bir şekilde yönetebilmek amacıyla kodlanabilir vekil(*proxy*) bir network yapısı sunmaktadır. Service Worker network ile cihazın arasında yer alır ve içeriğin taşınmasını sağlar. Cache'leme mekanizmasını verimli ve hatasız bir şekilde çevrimdışı modda sunabilme yeteneğine sahiptir.

Uygulama Kabuk Mimarisi(Application Shell Architecture)
-------------------------------------------------------

Uygulamanın arayüzlerinin ve içeriğinin hızlı bir şekilde yüklenmesi amacıyla servis worker responsive web uygulamasının basit kullanıcı arayüzlerini saklar. Bahsedilen basit kullanıcı arayüzleri terimi uygulamanın kabuğu(*shell*) olarak ifade edilir.

Bu kabuk başlangıç statik çerçevesini(frame), sayfa düzenini ya da içeriğin adım adım ve bununla birlikte dinamik bir şekilde yüklenmesini sağlayan bir mimari sağlar. Teknik olarak, kabuk paketlenmiş bir koddur ve mobil cihazın tarayıcısının cache'inde tutulur. Bu sebeple, farklı bağlantı hızlarında uygulamanın içeriği yüklenme sırasında kabuk yapı kullanıcı ile ilk etkileşimi yapar. Kullanıcı boş bir ekranın yüklenmesini beklemeden ilk etkileşim olarak bir ekran ile karşılaşmış olur.

Bu tip web uygulamalarının en büyük güçü kullanıcıya sağlam bir mobil tecrübeyi harika bir web teknolojisi ile kullandırmasıdır.

Bu tip web uygulamaları henüz sadece Chrome tarayıcıları tarafından desteklenmektedir. Ancak yakın gelecekte tüm tarayıcılar tarafından desteklenebilir.

Kaynakça
--------

Bu makalenin çoğu Wikipedia'nın Progressive Web App İngilizce makalesinden 9 Ocak 2017 tarihinde Wayback Machine sitesinde arşivlendi. (09 Ekim 2016) alınmadır.

1. ↑  ardalis. "Ortak istemci tarafı web teknolojileri". *docs.microsoft.com*. 25 Mart 2021 tarihinde kaynağından arşivlendi. Erişim tarihi: 3 Mart 2021.
2. ↑  "Arşivlenmiş kopya". 25 Mart 2021 tarihinde kaynağından arşivlendi. Erişim tarihi: 3 Mart 2021.