Является ли Ionic PWA отдельным от традиционного Ionic?

Question

Это может показаться простым, но все же запутанным вопросом.Я работал с Ionic 1 долгое время и только что познакомился с Ionic 2+ два года назад, но некоторое время не работал с ним.

В последнее время я заметил, что Ionic выпустил Ionic PWA но я не могу понять, являются ли они частью одного и того же проекта или полностью отдельными.Я знаю, что Ionic PWA - это фреймворк для веб-приложений, в то время как традиционный Ionic использовался / рекомендовался только для гибридных приложений.

Так что мои вопросы:

1. Являются ли онислились воедино или они отдельные?

2. Если они раздельные, можно ли с легкостью перейти с Ionic3 на Ionic PWA?(Возможно, мне потребуется дополнительная поддержка браузера)

   Спасибо!

ОБНОВЛЕНИЕ Этот вопрос был сделан из-за неверного предположения, что Ionic PWA был отдельнымпока что похожий каркас с оригинальной ионикой.Очевидно, Ionic PWA - это просто термин для оригинального Ionic с некоторыми незначительными изменениями (которые вы должны сделать самостоятельно), чтобы сделать его PWA.

Answer 1

PWA отличаются от гибридных приложений тем, что они запускаются в контексте веб-браузера, а не веб-просмотра на уровне операционной системы (подробнее о веб-представлениях для Android и iOS ).PWA похожа на веб-страницу с собственным значком приложения и работает в полноэкранном веб-браузере без вкладок, панели URL и т. Д.

Из-за этого PWA не имеют одинакового доступа к собственнымфункциональность, как и гибридные приложения.Например, если вы хотите получить доступ к камере телефона в гибридном приложении, вы можете использовать что-то вроде плагина Cordova (в вашем приложении Ionic вы будете использовать @ ionic-native / camera ).Чтобы получить доступ к камере из PWA (по сути, из веб-браузера), Cordova не будет работать - вам нужно будет использовать веб-API ( посмотрите, на что способны веб-API! ).

Поскольку архитектура PWA должна сильно отличаться от архитектуры обычного гибридного приложения (и чем сложнее приложение, тем больше расхождение), Ionic расширила Ionic PWA, чтобы помочь разработчикам легче создавать PWA.

Чтобы приложение Ionic3 могло работать как PWA: если вы создали приложение Ionic из одного из шаблонов приложения Ionic Starter, используя ionic start, вы можете выполнить два действия, чтобы ваше приложение работало как PWA.

1. Добавьте файл manifest.json в папку /src и добавьте ссылку на него в index.html: <link rel="manifest" href="/manifest.json">. Пример из manifest.json и для дальнейшего чтения .

2. Включите поддержку Service Worker, найдя следующий фрагмент кода в вашем index.htmlи раскомментируйте это.Однако я обнаружил, что для того, чтобы на самом деле работали работники сферы услуг, требуется больше работы.Больше на MDN .

<!-- un-comment this code to enable service worker
  <script>
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('service-worker.js')
        .then(() => console.log('service worker installed'))
        .catch(err => console.error('Error', err));
      }
  </script>-->

Затем запустите ionic build и разверните папку www в Интернете, идеально подходящую для HTTPS.Если вы откроете страницу в своем мобильном браузере, вы сможете "Добавить на главный экран" на Android и iOS (iOS> версия 11.3) и запустить приложение как PWA.

Имейте в виду, чтолюбой функционал Cordova у вас не будет работать.Кроме того, если вы используете lazy-loading , это повысит производительность приложения.