Что такое PWA и из чего оно состоит?

PWA (Progressive Web App) — веб-приложение, которое ведёт себя как нативное: устанавливается на устройство, работает офлайн, получает пуш-уведомления и открывается в отдельном окне. Это обычный сайт, дополненный несколькими технологиями.

Из чего состоит

1. HTTPS — обязательное условие для service worker.
2. Web App Manifest — JSON-файл с названием, иконками, цветами и режимом отображения:

{
  "name": "Мой сервис",
  "short_name": "Сервис",
  "start_url": "/",
  "display": "standalone",
  "icons": [{ "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" }]
}

<link rel="manifest" href="/manifest.webmanifest">

1. Service Worker — скрипт, работающий в фоне между страницей и сетью. Перехватывает запросы, кеширует ресурсы, обеспечивает офлайн-режим и пуши.

navigator.serviceWorker.register('/sw.js');

Стратегии кеширования

• Cache First — сначала кеш, затем сеть (статика).
• Network First — сначала сеть, при ошибке кеш (данные).
• Stale While Revalidate — отдать кеш и обновить его в фоне.

Возможности

Установка на домашний экран, офлайн-доступ, Push API, фоновая синхронизация.

Ограничения

• Поддержка отличается по платформам (на iOS ограничена часть функций).
• Нет доступа ко всем нативным API.
• Нужно следить за обновлением кеша service worker.

Коротко для собеседования

PWA — это сайт с HTTPS, манифестом и service worker. Он устанавливается, работает офлайн и присылает уведомления, при этом остаётся обычным веб-приложением.