crazy_coder
Moderatör
- Katılım
- 20 Şub 2026
- Mesajlar
- 204
- Tepkime puanı
- 0
- Puanları
- 16
1. PWA Nedir? Neden Bu Kadar Önemli?
PWA, Google tarafından ortaya atılan ve modern tarayıcı standartlarını kullanarak web sitelerine "uygulama benzeri" bir deneyim kazandıran bir yaklaşımdır.
Temel Avantajları:
Kurulumsuz: App Store veya Play Store'a gitmeden, sadece tarayıcı üzerinden "Ana Ekrana Ekle" diyerek kurulur.
Çevrimdışı Çalışma: İnternet kopsa bile daha önce ziyaret edilen sayfalar açılabilir.
Hız: Akıllı önbellekleme (caching) sayesinde sayfalar anında yüklenir.
Düşük Boyut: Genellikle bir mobil uygulamadan 10-20 kat daha az yer kaplar.
2. PWA'nın Üç Altın Bileşeni
Bir web sitesinin PWA sayılabilmesi için şu üç yapıya sahip olması gerekir:
A. HTTPS
Güvenlik her şeydir. Service Worker'lar gibi güçlü API'ların çalışabilmesi için sitenizin mutlaka SSL sertifikasına (HTTPS) sahip olması gerekir.B. Web App Manifest (manifest.json)
Bu JSON dosyası, uygulamanızın ana ekranda nasıl görüneceğini belirler (ikon, tema rengi, başlangıç ekranı).
JSON:
{
"name": "Harika Uygulamam",
"short_name": "Uygulamam",
"start_url": "/index.html",
"display": "standalone",
"background_color": "#ffffff",
"theme_color": "#000000",
"icons": [
{ "src": "icon-192x192.png", "sizes": "192x192", "type": "image/png" }
]
}C. Service Worker (Uygulamanın Kalbi)
Service Worker, tarayıcı ile ağ (network) arasında duran bir JavaScript dosyasıdır. Gelen istekleri yakalar, önbelleğe (cache) bakar ve internet olmasa bile veriyi oradan sunar.3. Service Worker Nasıl Çalışır?
Basit bir önbellekleme mantığı şöyledir:
JavaScript:
// sw.js (Service Worker dosyası)
self.addEventListener('install', (event) => {
event.waitUntil(
caches.open('v1').then((cache) => {
return cache.addAll([
'/',
'/index.html',
'/style.css',
'/app.js'
]);
})
);
});
self.addEventListener('fetch', (event) => {
event.respondWith(
caches.match(event.request).then((response) => {
return response || fetch(event.request); // Önbellekte varsa ver, yoksa internete git
})
);
});4. PWA vs. Native (Yerleşik) Uygulamalar
| Özellik | Native App (Java/Swift) | PWA |
|---|---|---|
| Maliyet | Yüksek (İki ayrı platform) | Düşük (Tek bir web sitesi) |
| Güncelleme | Market onayı gerekir | Anında (Web sitesi değişince) |
| Donanım Erişimi | Tam Erişim | Kısıtlı (Kamera, GPS var; NFC zayıf) |
| Keşfedilebilirlik | Sadece App Store | Google Aramaları + Sosyal Medya |
Sonuç
PWA, özellikle e-ticaret siteleri, haber portalları ve araçlar (hesap makineleri, not defterleri) için devrim niteliğindedir. Kullanıcılara uygulama indirme zahmetine sokmadan, uygulama sadakati ve hızı sunmanıza olanak tanır. Geleceğin webi, tarayıcı adres çubuklarının kaybolduğu ve web sitelerinin uygulamalara dönüştüğü bir yer olacak.