Mi az a PWA (Progresszív Webalkalmazás)?

A PWA egy olyan webalkalmazás, amely úgy néz ki és viselkedik, mint egy natív mobilalkalmazás, miközben a böngészőben fut.

A PWA fő jellemzői:

• Megbízhatóság: Offline módban működik Service Workers segítségével.
• Teljesítmény: Gyorsan betöltődik és reagál a felhasználói műveletekre.
• Telepíthetőség: A felhasználók hozzáadhatják a PWA-t az eszköz főképernyőjéhez.
• Felismerhetőség: A keresőmotorok indexelik.
• Vonzó: Push értesítéseket küldhet.
• Reagálóképesség: Bármilyen képernyőmérethez alkalmazkodik.
• Biztonság: Csak HTTPS-en működik.

A PWA-ban használt technológiák:

• Service Workers: Proxy a böngésző és a hálózat között, lehetővé teszi az erőforrások cache-elését és offline működést.

  // Service Worker telepítésének példája
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
      navigator.serviceWorker.register('/service-worker.js')
        .then(registration => {
          console.log('Service Worker regisztrálva:', registration.scope);
        })
        .catch(error => {
          console.log('Service Worker regisztrációs hiba:', error);
        });
    });
  }
  

• Web App Manifest: JSON fájl, amely információkat tartalmaz az alkalmazásról (név, ikonok, képernyőorientáció stb.).

  {
    "short_name": "My PWA",
    "name": "PWA példám",
    "icons": [
      {
        "src": "/images/icon-192x192.png",
        "type": "image/png",
        "sizes": "192x192"
      },
      {
        "src": "/images/icon-512x512.png",
        "type": "image/png",
        "sizes": "512x512"
      }
    ],
    "start_url": "/",
    "background_color": "#3367D6",
    "display": "standalone",
    "scope": "/",
    "theme_color": "#3367D6"
  }
  

• HTTPS: Biztonságos kapcsolatot biztosít.

A PWA előnyei:

• Nem igényel telepítést az alkalmazásboltokból.
• Kevesebb helyet foglal a készüléken.
• Könnyebben frissíthető.
• Minden böngészőt támogató platformon elérhető.

A PWA tesztelése magában foglalja a következőket:

• Online és offline módokban való működés.
• Telepítés és működés a főképernyőn.
• Reagálóképesség különböző eszközökön.
• Push értesítések.
• Service Worker és cache működése.
• Az alkalmazás manifestja.
• Teljesítmény.