PWA و تجربه آفلاین با IndexedDB: وقتی شبکه ضعیف است
کاربر ایرانی همیشه آنلاین پایدار نیست. PWA و IndexedDB به محصول اجازه میدهند در قطعی شبکه هم مفید بماند.
علی مرتضوی
بنیانگذار پارادایس کد
چرا آفلاین دیگر luxury نیست
در اپلیکیشنهای مطالعه، فیلد فروش، یا ابزار داخلی، قطع لحظهای شبکه نباید تجربه را از بین ببرد. PWA (Progressive Web App) با service worker و manifest به مرورگر قابلیت نصب، کش و پاسخ آفلاین میدهد.
IndexedDB پایگاه key-value ساختیافته در مرورگر است برای داده حجیمتر از localStorage. برای metadata کتاب، سبد خرید موقت، یا draft فرم مناسب است.
هدف offline-capable بودن نیست offline-only؛ sync هوشمند وقتی شبکه برگشت.
لایههای کش: چه چیزی کجا ذخیره شود
asset استاتیک (JS، CSS، فونت) در service worker cache. داده API بسته به حساسیت: public content قابل کش، personal data با رمز یا بدون کش طولانی.
استراتژی cache-first برای فونت و تصویر، network-first برای داده تازه، stale-while-revalidate برای تعادل. یک policy برای همه کار نمیکند.
versioning کش: با deploy جدید cache قدیمی invalidate شود تا کاربر نسخه کهنه نبیند.
IndexedDB در عمل
از wrapper مثل idb یا Dexie استفاده کنید تا callback جهنمی ننویسید. schema با version migration داشته باشید.
داده را normalize کنید: entity جدا با id پایدار. index برای جستجوی سریع روی فیلدهای پرتکرار.
quota مرورگر محدود است. پاکسازی دورهای داده کهنه و نمایش حجم به کاربر در محصولات سنگین.
sync، تعارض و منبع حقیقت
سرور منبع حقیقت نهایی است مگر محصول صریحاً local-first باشد. هنگام sync تعارض: last-write-wins ساده اما خطرناک؛ بهتر timestamp + merge rule یا prompt کاربر برای موارد حساس.
queue عملیات آفلاین: create/update در صف، replay با backoff وقتی آنلاین شد. idempotency key برای جلوگیری از duplicate.
وضعیت اتصال را در UI نشان دهید: آفلاین، در حال sync، خطا. کاربر نباید حدس بزند.
PWA و نصب روی موبایل
manifest با name فارسی، icon مناسب، theme_color و display standalone. beforeinstallprompt را برای UX نصب هدفمند استفاده کنید.
در iOS محدودیتهایی هست؛ PWA کامل نیست اما کش و آفلاین محدود هم ارزش دارد. تست روی Safari iOS جداگانه.
push notification اگر لازم است با رضایت کاربر و fallback SMS در بازار ایران.
درس از پروژههای دادهمحور
در پلتفرم مطالعه با هزاران صفحه، IndexedDB تفاوت بین «قابل استفاده» و «ناامیدکننده» بود. virtualization + کش محلی ترکیب برنده است.
امنیت: داده حساس در IndexedDB رمزنگاری سمت کلاینت اگر threat model میطلبد. XSS همچنان میتواند به storage دسترسی بزند.
PWA را از روز اول معماری کنید؛ افزودن بعدی به service worker و state موجود دردناک است.
دانش و مقالات
نیاز به اجرای همین مفاهیم در محصولتان دارید؟
پارادایس کد از مشاوره تا پیادهسازی کامل کنار شماست.