Progressive Webanwendungen im Jahr 2020


Auf KDPV - ein Aufkleber, der vom Samsung-Internetbrowserteam erstellt wurde


Mehr als 12 Jahre sind vergangen, seit Steve Jobs die Idee von Webanwendungen eingeführt hat, "die genau wie native Anwendungen aussehen und sich so verhalten". Mehr als 4 Jahre sind seit dem Aufkommen des Begriffs „PWA“ vergangen. Was sind progressive Webanwendungen zu Beginn des Jahres 2020? Welche der Dinge, die 2019 zum Ökosystem hinzugefügt wurden, konnten Sie verpassen? Lass es uns herausfinden.


Hinweis Übersetzer: Screenshots von Tweets - anklickbar


Nachricht des Sponsors (Originalautor)


Letztes Jahr hielt ich mehrere aktualisierte Seminare und Präsentationen über PWA ab, von denen einige aktenkundig sind . Wenn Sie ein Pluralsight-Abonnent sind, lesen Sie den PWA: The Big Picture- Kurs, und wenn Sie ein O'Reilly Learning-Abonnent sind, lesen Sie den Web Performance Basics Learning Path . Wenn Sie Benachrichtigungen per E-Mail über meine neuen Beiträge erhalten möchten, können Sie sich hier anmelden .


Wenn Sie an einem Workshop oder einer Beratung für Ihr Unternehmen oder Ihre Konferenz interessiert sind, kontaktieren Sie mich .


Definition


Die Definition von PWA wurde nie in Stein gemeißelt und kann von Autor zu Autor unterschiedlich sein. Ich würde zum Zeitpunkt des Jahres 2020 sagen, dass PWA ein Entwurfsmuster für die Entwicklung von webbasierten Anwendungen unter Verwendung von APIs wie Service Workers für die Ressourcenverwaltung, Web App Manifest für die Installation über einen Browser und Trusted Web Activity für die Verteilung über ist Play Store und andere.



Moderner PWA-Spickzettel aus meiner Rede auf der JSConf Europe 2019


Verwenden Sie


Es ist schwierig, Informationen darüber zu erhalten, wie viele Unternehmen PWAs erstellen oder wie Benutzer hinsichtlich der Installation auf diese reagieren. Im Jahr 2019 spürte ich nicht wirklich, wie die Anzahl der Unternehmen, die PWA verwenden, oder der Benutzer, die aktiv zu ihnen wechseln, anstieg. Es gibt einige Nischen, z. B. Menschen, die sich um ihre Privatsphäre kümmern, indem sie native Anwendungen entfernen. Dies ist jedoch ein kleiner Teil des Marktes.


Im Jahr 2019 haben wir den Übergang zu PWA von einer der meistbesuchten Sites der Welt erlebt: YouPorn, aber wir haben keine Informationen über die Verwendung der PWA-Version. Sie können hier über YP PWA lesen (kein Pornolink, leise geöffnet).



Eine der meistbesuchten Websites der Welt ist jetzt eine fortschrittliche Webanwendung.


Neu (für Entwickler, Websitebesitzer und Benutzer) ist, dass PWA jetzt auf dem Desktop eines Computers installiert werden kann. Ich habe noch nicht genügend für Desktops optimierte PWAs gesehen, aber ab 2020 wird Microsoft für seinen neuen Edge werben, und wir sehen möglicherweise Fortschritte in diesem Bereich. Im Jahr 2019 nahmen sich Starbucks und Uber die Zeit, um über ihre PWAs zu sprechen, die auf einem Desktop-Computer ausgeführt werden. Dies wurde beispielsweise in dem Artikel Erstellen eines nahtloseren Buchungsflusses für Uber beschrieben .



Produck ist einer der ersten PWA-Desktop-optimierten Computer, die ich Anfang 2019 gefunden habe.


Die einzigen aktuellen Daten, die wir zu PWA haben, sind Daten aus dem Samsung-Internetbrowser:



Die Leistungsfähigkeit von WebAPK bei @samsunginternet: Über 20 Millionen Installationen progressiver Webanwendungen mit 80.000 Domains in diesem Jahr. Ziemlich beeindruckend.


So haben wir zwischen April und Dezember 2019 80.000 verschiedene Domains mit mindestens einem PWA; Obwohl dies nicht die genaue Anzahl der verschiedenen PWAs ist, ist dies eine gute Annäherung. Samsung Internet macht etwa 6% aller Nutzer aus, sodass eine große Anzahl von Nutzern diesen Wert als repräsentativ für das gesamte Web ansieht.


Man kann sagen, dass dies im Vergleich zu 2,9 Millionen Apps im Play Store oder 3,9 Millionen Apps im App Store nicht so gut ist. Gleichzeitig wissen wir jedoch nicht, wie viele dieser Millionen von Anwendungen in den letzten 9 Monaten mindestens einmal installiert wurden, sodass der Vergleich auf keinen Fall fair ist. Da wir Informationen zu Domains und nicht zu verschiedenen PWAs haben, wäre es außerdem hilfreich, 80.000 mit der Anzahl der verschiedenen Publisher in den Stores zu vergleichen, was etwa 800.000 im Play Store und 792.000 im AppStore entspricht. Anhand dieser Zahlen können wir sagen, dass PWA 10% in Bezug auf native Anwendungen beträgt. Wir müssen uns jedoch daran erinnern, dass 80% der neuen Downloads aus den Geschäften von nur 1% der Verlage stammen . Und jetzt, mit dem Aufkommen von PWA im Google Play Store, wird der Vergleich noch komplizierter.


Plattformen


Progressive Webanwendungen werden von 93% der Internetnutzer in Browsern vollständig unterstützt (einschließlich Service-Mitarbeitern).


PWA kann bei 86% der Benutzer installiert werden (82% - vom Browser, 4% - nur von Anwendungsspeichern und nicht von vorhandenen Browsern).


Wir können PWA auf Android, iOS, iPadOS, Windows 10 ( und zukünftigen 10X), Windows 7, Windows 8.x, Xbox One, MacOS, Linux (64-Bit), Chrome OS und kaiOS installieren .


Sie können erwähnen, dass PWA nicht auf Smartwatches, Smart-TVs, Apple TV, Chromecast, Android TV, PlayStation, Tesla-Autos (ja, diese Maschinen haben einen Browser), anderen Spielekonsolen und digitalen Assistenten (wie Facebook Portal, Nest Home) installiert werden kann oder Amazon Echo) oder Virtual-Reality- und Augmented-Reality-Helme und -Brillen wie Oculus-Produkte.


Ich sehe das Potenzial von PWA für Helme und Brillen für die virtuelle und erweiterte Realität, digitale Assistenten und Spielekonsolen, aber sie haben möglicherweise Probleme mit der internen Politik in ihren Unternehmen.


Überlegen Sie sich Plattformen, auf denen wir PWA bereits im Januar 2020 installieren können:


Android


Wir können erweiterte Webanwendungen auf folgenden Android-Geräten (Handys und Tablets) installieren:


  • Installation über den Browser : Chrome ( WebAPK ) / Firefox / Samsung Internet ( WebAPK nur auf Samsung-Geräten ) / UC / Edge / Opera / Brave / Baidu. Andere Browser haben diese Funktion möglicherweise ebenfalls (hauptsächlich, weil sie auf Chrom basieren), aber dort ist sie zu fehlerhaft.
    Sie können PWA nicht über Facebook Mobile Browser, Firefox-Vorschau, WebViews, benutzerdefinierte Registerkarten oder Chrome for DayDream (VR-Modus) installieren. Wenn auf dem Telefon keine Startbildschirmanwendung installiert ist (z. B. im Kioskmodus), können im Browser merkwürdige Ereignisse auftreten.


Android ist nach wie vor die einzige Plattform, die alle drei in der Web App Manifest-Spezifikation beschriebenen Anwendungsmodi unterstützt.


  • Verteilung für Unternehmensbenutzer : Verwenden des verwalteten Google Play-iFrames , eines Dienstes des Play Store-Teams, der WebAPK-Erstellung verwendet und nichts mit dem Chrome-Team zu tun hat (Google-Richtlinie, erster Teil).
  • Anwendungsspeicher : Aus dem Google Play Store durch Erstellen einer Android-Anwendung mit Trusted Web Activity (TWA) -Technologie und aus dem Samsung Galaxy Store durch Senden der Anwendungsadresse an eine bestimmte E-Mail und anschließendes Erstellen eines WebAPK über Samsung-Dienste. Der Amazon App Store bietet auch die Möglichkeit , Webanwendungen für Amazon Fire-Tablets zu veröffentlichen. Er basiert jedoch auf einer alten Plattform, die nicht alle PWA-Technologien unterstützt.

iOS und iPadOS



On-Screen Home-Menü von iPad OS 13 zum Festlegen von Site-Verknüpfungen und eigenständigen PWA


Wir hatten von Anfang an einen Startbildschirm-Webanwendungsmodus, schauen wir uns jedoch die erste Version an, die Service Worker und zumindest den Hauptteil des Webanwendungsmanifests unterstützt. iOS 13 und iPadOS 13 sind die ersten Versionen, in denen PWAs über eine grundlegende Benutzeroberfläche verfügen, die mit nativen Anwendungen übereinstimmt. Es gibt immer noch Fehler und Unterschiede zwischen dem Offline-Modus (PWA) und Safari, z. B. die WebRTC-API für den Zugriff auf die Kamera (nützlich zum Erkennen von QR-Codes). Obwohl das WebKit-Team angibt, daran zu arbeiten, ist der entsprechende „Bug“ seit 2 Jahren offen.


So können wir PWA installieren mit:


  • Installation über Browser : Nur mit Safari ab Version 11.1+ ( Version 13+ verbessert die Benutzerfreundlichkeit ). Sie können PWA nicht von Safari View Controllern aus (z. B. wenn Sie in der Twitter-Anwendung auf den Link klicken) oder in einem Pseudo-Browser wie Google Chrome, Firefox, Edge oder Facebook Mobile Browser installieren. Es ist immer zu beachten, dass andere Suchmaschinen im App Store verboten sind, so dass es im App Store keine echten "Browser" gibt.
  • Verteilung für Unternehmensbenutzer : aus der Konfigurationsdatei für mobile Geräte (Mobile Configuration File); Es ist für Firmenbenutzer gedacht, funktioniert aber für normale Benutzer, wenn sie die entsprechende Datei akzeptieren. In diesem Fall enthält die Datei möglicherweise eine oder mehrere "Webanwendungen", die im "Offline" -Modus ausgeführt werden können. Daher enthält der Startbildschirm nach der Installation der Konfigurationsdatei PWA.

Windows und Xbox



Auf Windows-Geräten werden im Startmenü PWAs angezeigt


Auf der Windows-Plattform können Sie PWA folgendermaßen installieren:


  • Installation von Browsern unter Windows 10 : Google Chrome 70+ und Microsoft Edge (ab der Version, die im Januar 2020 veröffentlicht wird). Sie können PWA nicht von Firefox, IE oder Edge vor Version 15 installieren.
  • Installation von Browsern unter Windows 7 / 8.x : Google Chrome 70+ und zukünftige Version von Microsoft Edge. Sie können PWA nicht von Firefox, IE oder Edge vor Version 15 installieren.
  • Installation von Browsern unter WindowsX (klappbar) : Microsoft Edge (in Zukunft).
  • App Stores : Microsoft Store für Windows 10 (für Desktops und Hololens) und Xbox One. Sie können PWA nicht unter Windows 10 für Handys oder einem anderen älteren Microsoft-Betriebssystem für Handys installieren.


Mit Microsoft Edge für Windows, MacOS und Linux können Sie jede Website als Anwendung installieren. Die Site sieht auf dem Desktop wie PWA aus, selbst wenn die Site keinen Service-Worker oder keine ordnungsgemäße Manifestdatei enthält.


Mit Microsoft Edge (der neuen Chromium-Version) können Sie jede Site als PWA festlegen, auch wenn sie die PWA-Kriterien nicht erfüllt oder es sich um eine 1991-Site handelt. Google Chrome auf dem Computer verfügt auch über diese Funktion, aber das ist nicht so offensichtlich: Sie müssen eine Verknüpfung mit dem Menü "Erweiterte Tools" - "Verknüpfung erstellen ..." erstellen und "In einem separaten Fenster öffnen" ankreuzen. nicht ganz offensichtlich.



Die weltweit erste Site, die als „Anwendung“ mit Microsoft Edge unter macOS installiert wurde


Andere Plattformen


macOS - Wir können PWA nur über die Browser Google Chrome 73+ und Edge installieren. Safari für MacOS und Firefox unterstützen die PWA-Installation nicht.


Linux 64-Bit - Die Installation ist nur über Google Chrome 70+ möglich.


ChromeOS - Die Installation über den Browser ist ab ChromeOS 67+ verfügbar. Chrome TWA ist nicht verfügbar.


kaiOS - nur aus Geschäften (kaiStore, JioStore); Dieses Betriebssystem basiert auf der alten Gecko-Plattform, bietet jedoch grundlegende Unterstützung für Servicemitarbeiter. Es gibt nicht genügend Dokumentation, um zu verstehen, was auf dieser Plattform für Funktionstelefone möglich ist und was nicht.


Sein oder Nichtsein


Während die meisten Browserhersteller den Begriff "progressive Webanwendung" übernommen haben, ist noch eine andere dagegen: Apple. Und das ist keine Neuigkeit, vor zwei Jahren habe ich dasselbe gesagt:



Trotz der Unterstützung und Entwicklung von Service Workern und Web App Manifest verwendet keiner von Apple den Begriff PWA.


2019 hörte ich zum ersten Mal den Begriff PWA von den WebKit- oder Apple-Teams, aber nicht so, wie wir es erwarten würden. sie delegitimierten ihn einfach und sagten, dass "er wirklich nicht existiert". Dies wurde in einigen Spezifikationsdiskussionen und auf Twitter zum Beispiel in folgendem Thread diskutiert:



Versteh mich nicht falsch. Das WebKit-Team hat einen bestimmten Standpunkt bei der Diskussion des Begriffs PWA. In der Vergangenheit habe ich auch wiederholt die Verwendung des Begriffs PWA kritisiert.


Offiziell verwendet Apple diesen Begriff auch in seinen Artikeln aus dem Jahr 2019 nicht, obwohl er für die meisten Leser verständlicher ist als die Begriffe „HTML5-Anwendungen“ und „Webanwendungen für den Startbildschirm“.



Eine offizielle Pressemitteilung über HTML5-Apps im App Store. Wir werden später in diesem App Store über das Veröffentlichen von PWA sprechen.



Webanwendungen für den Startbildschirm ist der Begriff, den Apple vor 12 Jahren für später fortschrittliche Webanwendungen verwendete. Außerdem ist die Verwendung des Ausdrucks „auf dem Startbildschirm gespeicherte Websites“ falsch, da nicht jede Website eine Startbildschirmanwendung oder eine PWA ist oder wie auch immer Sie sie nennen möchten.


Safari - neuer IE?


Ich bin nicht ganz einverstanden mit der Vorstellung, dass Apple das Internet schädigt oder dass "Safari der neue IE ist"; Ich verstehe, dass das WebKit-Team seine eigenen Ziele hat, die nicht mit den Zielen des Chromium-Imperiums übereinstimmen. Leider sind diese Ziele für die Community nicht immer klar und transparent, und öffentliche Diskussionen reichen nicht aus, um ihre Gedanken zu verstehen.


Obwohl sie den Begriff PWA nicht offiziell verwenden, haben Apple und das WebKit-Team die Plattform in den letzten zwei Jahren so weiterentwickelt, dass die Verwendung von PWA auf iOS und iPadOS seit 2020 mindestens die Mindestanforderungen der Benutzer erfüllt.


Sogar Apple selbst hat im Jahr 2019 mehrere PWAs veröffentlicht (in einigen Fällen ohne es zu merken):




Gepaart mit Politik


Einige Entscheidungen großer Unternehmen wie Apple und Google für bestimmte Technologien (z. B. PWA) haben manchmal Unternehmensrichtlinien. Ich glaube nicht, dass Apple das einzige Unternehmen ist, das politische Probleme mit Webanwendungen hat, die "wie einheimisch" aussehen. Google hatte auch eine, als Chrome Trusted Web Activity einführte - den Mechanismus zum Veröffentlichen von PWA im Play Store. Google, ein Unternehmen, das Android, Play Store und Chrome umfasst, versuchte jedoch, alle Komponenten so komplex wie möglich zu gestalten. um sie weiterzuentwickeln.


Verteilung


Installation über den Browser


Dies war das häufigste Installationsszenario für PWA, aber seit 2020 können wir meiner Meinung nach einen Anstieg der Beliebtheit anderer Methoden zur Verteilung von Anwendungen feststellen.



Die Möglichkeit, PWA über unsere Benutzeroberfläche zu installieren, wird in Safari oder Firefox nicht angezeigt


Das Neueste zu diesem Problem ist die Web App Manifest-Spezifikation, mit der das Ereignis beforeeinstallprompt wahrscheinlich aus der Empfehlung entfernt wird , und die nur für Chromium verfügbar sein wird. Wie wir uns erinnern, können wir mit diesem Ereignis in der Benutzeroberfläche unserer Webanwendung eine eigene Schaltfläche "Installieren" erstellen, mit der wir den Installationsdialog manuell starten können. Safari und Firefox haben öffentlich erklärt, dass sie nicht an einer Implementierung interessiert sind, sodass wir diese Möglichkeit außerhalb des Chromium-Imperiums (Google Chrome, Samsung Internet, Microsoft Edge, Brave usw.) nicht haben werden.



Der ursprüngliche WebAPK-Erstellungsdienst ist nur für Google Chrome verfügbar


Apropos Installation über einen Browser unter Android: WebAPK bietet die bestmögliche Erfahrung. In diesem Fall packt und signiert der Google Play Store installierte Anwendungen nur, wenn Google Chrome als Browser verwendet wird, obwohl öffentlich bekannt gegeben wird, dass die Plattform für andere Browser geöffnet werden soll.


WebAPK verwendet den cloudbasierten APK-Dienst, der die APK im Handumdrehen erstellt und signiert, sodass das Android-Gerät die Anwendung unbeaufsichtigt installiert und wie jede andere native Anwendung aussieht.


Samsung verfügt über eine eigene Methode zum Erstellen von WebAPK, die nur auf Samsung-Geräten mit installiertem Galaxy Store verfügbar ist (sie verfügen über einen eigenen Dienst, da sie sowohl das Betriebssystem als auch den Browser steuern). Andere Browser wie Firefox, Brave oder Edge können diese Technik nicht verwenden, da Signaturen auf Betriebssystemebene erforderlich sind. Daher sind PWAs, die von diesen Browsern installiert werden, aus Sicht des Betriebssystems weniger leistungsfähig (z. B. erscheinen sie nicht in der allgemeinen Liste der Anwendungen) und das Symbol auf dem Hauptbildschirm ist zusätzlich mit einem Browsersymbol gekennzeichnet.



Wenn Sie Browser ohne WebAPK-Unterstützung verwenden, wird nur auf dem Hauptbildschirm ein Symbol angezeigt.


App Store-Verteilung


Fangen wir mit Apple an: Im Jahr 2019 stellte Apple fest, dass im App Store keine erweiterten Webanwendungen erforderlich waren .



Wir haben immer darauf hingewiesen, dass Anwendungen vollständig in sich geschlossen sein sollten, um Benutzern die sichere und zuverlässige Nutzung zu ermöglichen, die sie vom App Store erwarten. Dies bedeutet, dass die Hauptfunktionen und -fähigkeiten der Anwendung im Binärcode der Software enthalten sein und nicht durch Weiterleiten von Benutzern außerhalb der genehmigten Anwendung, einschließlich durch die Verwendung von HTML5, hinzugefügt werden sollten. Anwendungen, die grundlegende und erweiterte Funktionen dynamisch mithilfe von Webtechnologien wie HTML5 bereitstellen, werden in Safari am besten für alle bereitgestellt und nicht über einen überwachten App Store.


Das bedeutet, dass Sie dem App Store keine Anwendungen hinzufügen sollten, die JavaScript im Handumdrehen laden. Auf diese Weise können Sie das Verhalten der Anwendung ohne Eingreifen des App Store-QA-Teams aktualisieren. Das heißt, Service Worker oder ein anderer Aktualisierungsmechanismus ist nicht zulässig (die Service Worker-API ist in WebView nicht verfügbar, es gibt jedoch einige andere Implementierungen). Sie können weiterhin alle Ihre Ressourcen mithilfe von WebView in die iPhone-Anwendung einbetten und sie dem Store hinzufügen. Eine automatische Aktualisierung der Anwendung wie auf anderen Plattformen ist jedoch nicht verfügbar.


Unter Android hat der Google Play Store mit Chrome leise begonnen, PWA im App Store zu akzeptieren. Die WebView-Technologie ist hier nicht beteiligt, und die Anwendung aus dem Store zeigt dasselbe Chrome (oder einen anderen Browser) an, einschließlich der Freigabe aller Speicher und Cookies. Dies ist dank Trusted Web Activities möglich . Es funktioniert nicht nur zum Veröffentlichen der URL der Anwendung. Sie müssen eine spezielle Anwendung veröffentlichen, um Ihre PWA zu starten. Dies ist Ihre eigene Anwendung, die den Browser offline öffnet und den Inhalt der PWA unter ihrer Adresse anzeigt.



Auf dem Chrome Dev Summit erwähnte das Browserteam OYO Lite, PWA, im Google Play Store und bestätigte zum ersten Mal, dass die ein paar Monate zuvor erstellte TWA zum Verteilen von PWA im App Store verwendet werden kann.


Vertrauenswürdige Webaktivitäten waren das ganze Jahr 2019 verfügbar. Chrome hat jedoch 10 Monate lang nicht öffentlich darüber gesprochen, mit dieser Technologie PWA im Play Store zu veröffentlichen (Google-Richtlinie, Teil 2; Sie können sich nicht vorstellen, wie viele Nachrichten ich von verschiedenen Personen erhalten habe. wer behauptet, dass ich gelogen habe, weil "TWA ist nicht für PWA im Laden"). Dies ist eine wundervolle Funktion, die vor der Öffentlichkeit verborgen ist, aber ich habe keine Updates über die Zukunft der Technologie gesehen (zum Beispiel gab es Ideen, nativen Code mit TWA zu verknüpfen). TWA Chrome. Custom Tabs, , Firefox Samsung Internet, ( Firefox Preview Samsung Internet, Samsung ). , , PWA Play Store.



Samsung Galaxy Store -


2019 Samsung PWA Galaxy Store — , Google Play Store. ( ), PWA «-», , . , .



Microsoft 2017 , Bing - 2018 , Microsoft Store Windows 10. , .



, Microsoft , , PWA, , 2019 , Microsoft , APPX, PWA .


- , , , , , Google - .




PWA ; - ,


, , , . Android Managed Google Play iframe , , PWA . Play Store WebAPK APK- URL- . , , ; , .


Apple (Mobile Configuration File), iOS iPadOS. Apple Configurator 2 , Web Clips ( ). URL- , , , PWA. mobileconfig , iOS/iPadOS , () PWA .



: , , , , -, , PWA Safari. , ; .


Die Möglichkeiten


PWA 2020 , , :


  • Chromium : Fugu , 2019 2020, - Google Chrome, Samsung Internet, Microsoft Edge . , , , ( , WebNFC, PWA, , , ), , (WebAssembly, WebRTC, WebPush, WebAuthn, WebShare, WebXR, RequestPayment . .).

, ( , Android), , , , Android/Play Store Chrome Google: TWA, , 2 , Chrome , Android 8+. Chrome, , , .


  • WebKit : , WebKit ( Safari) Chromium , , . ( WebAssembly, WebAuthn ( ), Apple, Apple Pay RequestPayment), , , , , WebPush , WebKit. WebKit « 2020» , .
  • : , . — Gecko ( API Chromium, PWA ), kaiOS (, Gecko ), TWA Universal Windows API Windows Store.

Design


2019 , PWA:




PWA CSS-. Web App Manifest . iOS :




Während Falzgeräte noch neu sind, funktioniert PWA auf kompatiblen Geräten. Es gibt immer noch nichts Konkretes für sie, und auf einigen Plattformen kann die Verwendung von PWA entweder vollständig fehlerhaft sein oder eine regelmäßige Anpassung an die Bildschirmgröße. Es werden einige API-Vorschläge angezeigt, die PWA in Zukunft helfen werden, z. B. die Windows Segments Enumeration-API .


Maskierte Symbole


Android 8+ hat die Mechanik von Symbolen geändert und das Konzept von reaktionsschnellen Symbolen hinzugefügt. Dies traf jedoch nicht auf PWA zu, sodass die meisten PWA-Symbole ziemlich schlecht aussahen und nur in der Mitte des weißen Kreises angezeigt wurden. Es hat eine Weile gedauert, bis sich die Webplattform an dieses Verhalten angepasst hat, und jetzt ist die Definition maskierter Symbole in der Manifestdatei verfügbar.



Chrome unterstützt jetzt maskierte Symbole in Canary. In Kürze werden sowohl Standardverknüpfungen als auch WebAPK unterstützt. Firefox fügt auch Unterstützung für diese Technologie hinzu.


Die Werkzeuge


In den letzten Jahren wurden auch Tools für fortschrittliche Webanwendungen aktiv entwickelt. Ich denke, dass sie noch Raum zum Wachsen haben, aber hier haben wir eine Liste von Tools, die kürzlich speziell im Bereich PWA entwickelt wurden.


Generatoren für App Stores


Letztes Jahr schienen viele Tools Webentwickler zu unterstützen, die PWA im Google Play Store veröffentlichen möchten, ohne Android Studio und native Tools von Grund auf zu verwenden.



pwa2apk ist das erste Tool zur Konvertierung von PWA in PWA, das im Google Play Store live geschaltet wird


Das erste war PWA2APK vom unabhängigen Publisher AppMaker, gefolgt von PWA Builder von Microsoft und dem Llama-Pack von Chrome (in Entwicklung).


Pwa Baumeister


Das Tool von Microsoft entwickelt sich aktiv weiter: PWA Builder 2.0 wurde im vergangenen Jahr mit vielen neuen Funktionen veröffentlicht, darunter der PWA Builder Score und viele andere. Im Laufe des Jahres hat PWA Builder auch die Webkomponente pwa-install veröffentlicht , mit der das Verhalten der Eingabeaufforderung vor der Installation gesteuert wird.



Die pwa-install-Webkomponente von PWA Builder in Aktion


In Zukunft werden wir sehen, wie sich dieses Tool in eine neue Richtung entwickelt, die sich auf Webkomponenten konzentriert. Dazu gehören die Unterstützung von Web Push, die Integration mit anderen Open Source-Tools (z. B. die Verwendung von Lama-Pack oder PWA Asset Generator ) und das Entfernen einiger Funktionen von Generator, einschließlich eines Paketgenerators für iOS (eigentlich nur mit WebView).


Maskierte Symbole


Wenn Sie über PWA verfügen, müssen Sie im Manifest der Webanwendung ein maskiertes Symbol hinzufügen. Wenn Sie dies noch nicht getan haben, können Sie mit der Anwendung Maskable.app von Tiger Oaks beginnen.



Zeit, deine PWA-Symbole zu „maskieren“!


Leuchtturm


Die einzige große Änderung in der letzten Zeit in Lighthouse für PWA ist, dass das Symbol nun für iOS / iPadOS überprüft wird. Ich glaube, dass dies von großer Bedeutung sein wird, da ich viele PWA ohne ein Symbol für iOS gesehen habe und die typische Reaktion darauf lautete: "Lighthouse sagte, dass alles richtig war."



Ich habe auf dieser Änderung in Lighthouse bestanden (Sie können die Diskussion mit dem Chrome-Team im folgenden Thread verfolgen):



Was weiter?


Was glaubst du, wird 2020 PWA bringen? Schreiben Sie dazu in den Kommentaren.


Maximiliano Firtman ist Entwickler, Trainer, Redner und Autor von Artikeln. Er ist Autor zahlreicher Bücher, darunter O'Reilly Medias High Performance Mobile Web . Er spricht oft auf Konferenzen auf der ganzen Welt und ist weithin für seine Arbeit in der mobilen Web-Community bekannt. Er unterrichtet Mobile Development, HTML5 und PWA und führt Produktivitätsschulungen für führende Unternehmen auf der ganzen Welt durch. Er hat mehrere Seminare und Kurse zu fortgeschrittenen Webanwendungen in vielen Unternehmen und für Online-Veröffentlichungen wie Pluralsight , Linked Learning / Lynda und Safari für O'Reilly gehalten. Twitter: @firt


Von einem Übersetzer: Ich habe im Telegramm-Chat PWA einen Link zum Original gesehen - der russischsprachigen Gemeinschaft , in der sich Neuigkeiten und Themen rund um PWA austauschen lassen.

Source: https://habr.com/ru/post/de482772/


All Articles