Ի՞նչ է PWA (Նվազող Վեբ Դիմում):

PWA - ը վեբ հավելված է, որը տեսք և վարքագիծ ունի որպես բնիկ մոբայլ հավելված, սակայն աշխատում է բրաուզերում:

PWA-ի հիմնական հատկանիշները:

• Հավատարիմություն: Աշխատում է օֆլայն՝ շնորհիվ Service Workers-ի:

  // Service Worker-ի տեղադրության օրինակ
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
      navigator.serviceWorker.register('/service-worker.js')
        .then(registration => {
          console.log('Service Worker գրանցված է՝ տարածքով:', registration.scope);
        })
        .catch(error => {
          console.log('Service Worker գրանցելու սխալ:', error);
        });
    });
  }
  

• Արդյունավետություն: Լիցքավորվում է արագ և արձագանքում է օգտատիրոջ գործողություններին:
• Տեղադրելիություն: Օգտագործողները կարող են ավելացնել PWA-ն գլխավոր էկրանին:
• Բնորոշում: Ինդեքսավորվում է որոնողական համակարգերով:
• Արտաքին տեսք: Կարող է ուղարկել push ծանուցումներ:
• Պատասխանատուություն: Համապատասխանում է ցանկացած էկրանային չափի:
• Անվտանգություն: Աշխատում է միայն HTTPS-ի վրա:

Տեխնոլոգիաներ, որոնք օգտագործվում են PWA-ում:

• Service Workers: Բրաուզերի և ցանցի միջև պրոքսի սերվեր, որը թույլ է տալիս կեշավորել ռեսուրսները և աշխատել օֆլայն:

  // Service Worker տեղադրելու օրինակ
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
      navigator.serviceWorker.register('/service-worker.js')
        .then(registration => {
          console.log('Service Worker գրանցված է՝ տարածքով:', registration.scope);
        })
        .catch(error => {
          console.log('Սխալ Service Worker գրանցելիս:', error);
        });
    });
  }
  

• Web App Manifest: JSON ֆայլ, որը պարունակում է հավելվածի մասին տեղեկություններ (անուն, պատկերներ, էկրանային ուղղություն և այլն):

  {
    "short_name": "My PWA",
    "name": "Իմ Օրինակային PWA",
    "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: ապահովում է անվտանգ կապ:

PWA-ի առավելությունները:

• Չպահանջում է հավելվածների խանութների միջոցով տեղադրում:
• Փոքր տարածք է զբաղեցնում սարքում:
• Լավ է թարմացվում:
• հասանելի է բոլոր բրաուզերների աջակցությամբ:

PWA-ի փորձարկումը ներառում է ստուգումներ՝

• Ֆունկցիոնալություն առցանց և օֆլայն ռեժիմներում:
• Տեղադրում և աշխատում է գլխավոր էկրանին:
• Բոլոր սարքերի վրա արձագանքողություն:
• Push ծանուցումներ:
• Service Worker-ի և կեշավորման աշխատանք:
• Հավելվածի մանIFEST:
• Արդյունավետություն: