# كيف يعمل تطبيق الويب التقدمي (PWA)

تطبيق الويب التقدمي (PWA) هو تطبيق ويب يستخدم تقنيات الويب الحديثة لتقديم تجربة تشبه التطبيقات الأصلية للمستخدمين. يتميز هذا التطبيق بما يلي:

1.  **قابلية التثبيت:** يمكن للمستخدمين تثبيت التطبيق مباشرة من المتصفح إلى الشاشة الرئيسية لأجهزتهم (Android و iOS) دون الحاجة إلى متاجر التطبيقات.
2.  **العمل دون اتصال بالإنترنت:** بفضل عامل الخدمة (Service Worker)، يمكن للتطبيق العمل حتى في حالة عدم وجود اتصال بالإنترنت، مما يوفر تجربة مستخدم مستمرة.
3.  **السرعة والأداء:** يتم تحميل المحتوى المخزن مؤقتًا بسرعة، مما يقلل من أوقات التحميل ويحسن الأداء العام.
4.  **تجربة المستخدم المحسّنة:** يفتح التطبيق في وضع ملء الشاشة بدون واجهة مستخدم المتصفح، مما يوفر تجربة غامرة.

### المكونات الرئيسية لـ PWA

*   **`public/manifest.json`**: ملف JSON يصف التطبيق للمتصفح، بما في ذلك اسمه، أيقوناته، لون السمة، وكيف يجب أن يظهر عند التثبيت.
*   **`public/sw.js` (Service Worker)**: نص برمجي يعمل في الخلفية، منفصل عن صفحة الويب. يقوم بمعالجة طلبات الشبكة، وتخزين الأصول مؤقتًا (caching)، وتوفير وظائف دون اتصال بالإنترنت، وإدارة التحديثات.
*   **علامات `<meta>` في `app/layout.tsx`**: علامات HTML إضافية في قسم `<head>` لدعم ميزات PWA الخاصة بـ iOS، مثل `apple-mobile-web-app-capable` و `apple-touch-icon`.
*   **`components/pwa-install-prompt.tsx`**: مكون React يعرض مطالبة للمستخدم لتثبيت التطبيق عندما يكون متاحًا.
*   **`components/service-worker-register.tsx`**: مكون React يقوم بتسجيل عامل الخدمة عند تحميل التطبيق.
*   **`app/loading.tsx`**: مكون تحميل يظهر أثناء جلب البيانات على الخادم، مما يحسن تجربة المستخدم من خلال توفير ملاحظات مرئية.