Çevrimdışı mod mobil uygulamalarda nasıl çalışır

1) Çevrimdışı mod nedir ve neden gereklidir

Çevrimdışı mod, bir uygulamanın ağ olmadan (veya kararsız bir İnternet ile) çalışması ve ardından bir bağlantı göründüğünde senkronize edilmesidir. Öyle mi:

Arızaları azaltır ve kalıcılığı artırır
İlk ekranı hızlandırır (veriler zaten yereldir)
Kritik eylemleri (taslaklar, içeriği görüntüleme, işlemlerin bir kısmı) "sahada" gerçekleştirmenizi sağlar.

2) Çevrimdışı mimarinin katmanları (herhangi bir yığında)

1. Yerel veri depolama

Mobil native: SQLite/Room (Android), Core Data/SQLite (iOS), Realm, Key-Value (SharedPreferences/UserDefaults).

Web/PWA: IndexedDB (over - Dexie/LocalForage), Statik için önbellek depolama.

2. Statik Önbellek (Uygulama Kabuğu)

Simgeler, yazı tipleri, CSS/JS, temel ekran şablonları.

3. İşlem kuyruğu (Giden kutusu)

Yazma istekleri (oluşturma/değiştirme/silme) sıraya alınır ve bir ağ göründüğünde sunucuya gönderilir.

4. Senkronizasyon katmanı

Birleştirme ilkeleri, sürümler, veri tekilleştirme, geri alma, geri alma.

5. Ağ durum sinyalleri

Çevrimiçi/çevrimdışı/limbo arasında UI geçiş için NetInfo/Reachability/Browser API.

3) IOS/Android'de nasıl görünüyor

Önbellek ve DB - Veri yapısı ana API yanıtlarını yansıtır (varlıkları normalleştirir).

Çevrimdışı taslaklar: formlar ve eylemler yerel veritabanına 'bekleyen/gönderilen/başarısız' bayraklarıyla yazılır.

Senkronizasyon: Arka plan görevi periyodik olarak giden kutusunu okur ve durumu işaretleyerek gruplar gönderir.

Güvenlik: sırlar/belirteçler - Keychain (iOS )/Android Keystore'da. PII/ödemelere sahip veriler, güvenli bir konteynerden bir anahtarla şifrelenir (örneğin, GCM AES-256).

İşletim sistemi sınırlamaları: arka plan görevleri güç tasarrufu modlarına bağlıdır; Taleplerin idempotency ve süreci öldürdükten sonra yeniden başlaması için plan.

4) PWA'da nasıl çalışır (web)

Service Worker (SW) - ağ ve uygulama arasında proxy:

Precache (App Shell): Arayüz anında kullanılabilir.
Çalışma zamanı önbelleği: aşağıdaki stratejiye göre veri/ortam.
Arka Plan Senkronizasyonu/Periyodik Senkronizasyon (varsa): Bir kuyruk gönderme, kullanıcı müdahalesi olmadan önbelleği güncelleme.
Veri için IndexedDB ve statik için Cache Storage.
Sınırlamalar: Depolama kotaları, arka plan görevlerinin sıkı kontrolü (özellikle iOS Safari).

5) Önbellek stratejileri (ne ve ne zaman uygulanacak)

Önce Önbellek - değişmeyen statik (simgeler, fontlar, JS sürümleri) için.

Bayat-While-Revalidate (SWR) - listeler/dizinler için: anında önbellekten, arka planda taze veri çekin.

Network First - ağ oradayken kişisel veriler için; Yedekleme - çevrimdışıyken önbellekten.

Yalnızca Önbellek/Yalnızca Ağ - nadir özel durumlar (tanılama, özel kaynaklar).

Birleştirmek: statik - CF/SWR; Dinamik - SWR/NF; kayıtlar - kuyruk boyunca.

6) Kuyruğu ve idempotensi değiştirin

Giden kutusu modeli: Her eylem (POST/PUT/PATCH/DELETE), geçici bir kimlik, gövde, sürüm ve son tarih içeren bir kuyruk girişine serileştirilir.

Ağ/sunucu hataları durumunda üstel geri kapanma ile toplu olarak gönderme.

Başlıklardaki/uç noktalardaki Idempotent tuşları - yeniden gönderme, kopyalar oluşturmaz.

Veritabanı işlemleri - Yerel durumun sıralanması ve güncellenmesi atomik olmalıdır.

7) Çatışma çözümü (sunucu ve istemci)

Yaklaşımlar:

Son Yazma Kazanır (LWW) - basit, ancak düzenlemeleri kaybetme riski.
Versioning/ETag - sunucu eski sürümleri reddeder - istemci bir birleştirme/yeniden kaydetme yapar.
Operasyonel Dönüşümler/CRDT - karmaşık varlıkların ortak düzenlenmesi için.
Alan kuralları - sunucuda hangi alanların doğru olduğu, hangilerinin istemcide olduğu (örneğin, yerel etiketler/bayraklar).

UX:

"Senkronizasyon dışı" rozetini, "güncelleme" düğmesini ve çakışan diff'i (sürümü seçmek için) gösterin.

8) Medya ve ağır kaynaklarla çalışmak

Veri tekilleştirme ve hash'ler (içerik adreslenebilir) - aynı şekilde yüklenmez.

Yer tutucular/çevrimdışı minyatürler, tam sürüm - ağdan sonra.

Kötü şebeke/pil durumunda duraklama ile indirme kuyruğu.

Medya önbelleği için TTL politikası - gigabayt kaydetmeyin.

9) Çevrimdışı "insan" tutmak için UX kalıpları

TOP kuralı: Asla "boşluk" gösterme. "App Shell + skeleton + içeriğin en son geçerli sürümü.

Açık durumlar: Çevrimiçi/Çevrimdışı/Senkronizasyon .../Eylem gerekli.

Geri Al/Yeniden Dene: Son çevrimdışı eylemi geri al; Otomatik ve manuel tekrar oynatma.

Yerel taslaklar: Görünür Bekleyen Gönderim listeleri.

Sessiz hatalar: Agresif endişelenmeyin - göze batmayan göstergeler + dergi yeterlidir.

10) Çevrimdışı güvenlik ve gizlilik

Hassas verileri "diskte" şifreleyin; Anahtarlar - Keystore/Keychain'de.

PII toplama/depolama çevrimdışı en aza indirin; Tutma ve otomatik temizleme belirtin.

Asla sırları önbelleğe almayın/tam PAN/CVV; Ödeme sağlayıcısı belirteçleri - yalnızca PCI kurallarına göre.

SW/istemciyi XSS'den (CSP, SRI) koruyun, aksi takdirde saldırgan bir sonraki çevrimiçi olduğunda çevrimdışı verileri çalabilir.

11) Platform sınırlamaları

IOS: tarayıcıda arka plan görevleri için katı sınırlar; Web Push/periyodik senkronizasyon - nüanslarla; Anahtarlık - sırlar için güvenilir.

Android: esnek arka plan hizmetleri (WorkManager), ancak OEM optimizasyonları görevleri "öldürebilir" - bunları "önemli'olarak işaretleyin.

PWA: IndexedDB/Cache Storage kotaları, alan düşük olduğunda uyarı vermeden sistem temizliği.

12) Çevrimdışı test

Ağ profilleri (Uçak, 2G/3G, paket kaybı, yüksek RTT).

Bir çürük sırasında işlemi öldürün/geri yükleyin.

Kaos testleri: Partinin yarısı 429/503/zaman aşımına uğrar.

Çakışmalar-İki aygıttan eşzamanlı düzenlemeler.

Depolama Kotaları - Diski doldur, önbellek davranışını kontrol et.

13) Metrikler ve gözlemlenebilirlik

İlk Çevrimdışı Görünüm Zamanı (TTFOV): Uygulama Shell hızı.

Çevrimdışı kapsama - bir ağ olmadan kullanılabilir ekranların/işlemlerin oranı.

Giden kutusu sağlığı: kuyruk uzunluğu, çürük için ortalama süre, hata oranı.

Çatışma oranı ve el merjalarının oranı.

Depolama kotası/kullanımı, işletim sistemi temizleme oranı.

Kullanıcı etkisi: oturumlar bir ağ olmadan başladı - bir çürükten sonra dönüşüm.

14) Hızlı uygulama planı (90 gün)

1. Çevrimdışı kapsamı belirleyin: önbellekten hangi ekranlar okunur, hangi işlemler ertelenebilir.

2. Veritabanı ve şema seçin: normalleştirilmiş tablolar, dizinler, sürümler.

3. Uygulama Kabuğunu Etkinleştir: PWA SW/statik önbellek/simgeler/fontlar.

4. Giden Kutusu Topla: kuyruk, idempotence, backoff, gruplar.

5. Önbellek stratejileri: Listeler için SWR, kişisel veriler için Önce Ağ.

6. UX durumları + sinka günlüğü, yeniden deneme/geri alma.

7. Güvenlik: disk şifreleme, CSP/SRI, PII minimizasyonu.

8. Kötü ağ testleri, kaos testleri ve metrikler.

15) Sık yapılan hatalar ve bunlardan nasıl kaçınılacağı

"Çevrimdışı" sadece statik içindir. - Taslaklara ve giden kutusuna ihtiyacınız var, aksi takdirde değer küçüktür.

Idempotency yok. - Retras'taki işlemlerin kopyaları. Idempotent anahtarlarını girin.

Gizli çakışmalar. - Kullanıcı düzenlemeleri kaybeder. Diff/reshalka'yı göster.

TTL ve önbellek temizliği olmadan. - Uygulama şişer, işletim sistemi zorla temizler.

Lavabo blokları UI. - Senkronizasyon her zaman arka plandadır, UI duyarlıdır.

Sırların açık metinde saklanması. - Anahtarlık/Anahtarlık ve şifreleme kullanın.

16) SSS

Her şey için "tam" çevrimdışı yapmak mümkün mü?

Genellikle hayır: Ödemeler, lisans kontrolleri ve canlı veriler bir ağ gerektirir. Bir melez yapın: önbellekten okuyun + ertelenmiş yazılar.

Hangisi daha hızlı: SWR mi yoksa Önce Ağ mı?

SWR, önbellekten anında yanıt ve sessiz bir güncelleme verir - listeler için en iyi UX. Network Öncelikle tazeliğin (profil, denge) önemli olduğu yerlerde gereklidir.

Büyük medya nasıl depolanır?

Önbellek minyatürleri ve kısa ömürlü TTL, orijinaller - istek üzerine, LRU temizliği ile.

Her şeyi şifrelemek zorunda mıyım?

PII/sırları ve hassas kayıtları şifreleyin. Gerisi risk politikası ve kotalar üzerinedir.

Çevrimdışı SEO/PWA'yı kötüleştirecek mi?

Hayır, doğru SW ve SSR ile, aksine, hız ve tekrarlanan ziyaretleri artıracaktır.

Çevrimdışı mod bir'tik'değil, bir sistem mimarisidir: yerel veritabanı + statik önbellek + değişim kuyruğu + güvenilir senkronizasyon ve düşünceli UX durumları. Güvenlik (şifreleme, Keychain/Keystore), idempotency ve metrikler ekleyin, kötü bir ağı test edin - ve uygulamanız İnternet olmadan bile yararlı olacaktır ve göründüğünde, verileri ve kullanıcı güvenini kaybetmeden sunucuyu sorunsuz bir şekilde yakalayacaktır.