Was sind progressive Web-Apps und wie installiere ich eine?

Apps dominieren dein Handy 10 Android-Apps, die dein Leben einfacher machen 10 Android-Apps, die dein Leben viel einfacher machen Das Leben ist kompliziert - aber diese Apps können die Navigation ein wenig erleichtern. Weiterlesen . Und während Apps Ihren Desktop oder Browser nicht auf die gleiche Art und Weise beeinflussen, wird sich dies scheinbar ändern. Progressive Web Apps (PWAs) gewinnen an Bedeutung, da mehr Browser Unterstützung bieten.

Aber was genau ist eine progressive Web-App und was werden sie für Sie tun? Hier ist alles, was Sie wissen müssen.

Was ist eine progressive Web-App??

Progressive Web Apps sind Webanwendungen, die Benutzern eine reguläre Website bieten, aber als native mobile App erscheinen. PWAs versuchen, die Benutzerfreundlichkeit einer nativen mobilen App auf die modernen Browserfunktionalitäten zu bringen und die Fortschritte in beiden Entwicklungsbereichen voll zu nutzen.

Was definiert dann eine PWA??

• Universal: Eine PWA muss für jeden Benutzer unabhängig von seinem Browser nahtlos funktionieren.
• Responsiv: PWAs sollten mit jedem Gerät funktionieren, z. B. mit Ihrem Laptop, Tablet, Smartphone usw..
• Design: Das Design sollte native mobile Apps nachahmen, dh gestraffte, leicht zu findende Menüs mit einfacher Interaktivität für erweiterte Funktionen.
• Sicher: PWAs sollten HTTPS verwenden, um Benutzerdaten zu schützen.
• Auffindbar: Benutzer können PWAs finden und sie können leicht als Anwendung identifiziert werden (statt als “Seite? ˅”).
• Engagement: Ein PWA muss Zugriff auf native Eingriffsfunktionen wie Push-Benachrichtigungen haben.
• Aktualisierung: PWAs bleiben auf dem neuesten Stand und bieten die neuesten Versionen eines Dienstes oder einer Site.
• Installation: Ermöglicht Benutzern das einfache “Installieren” die PWA zu ihrem Startbildschirm, ohne einen App Store zu benötigen.
• Teilen: Für PWAs ist nur eine einzige URL erforderlich, ohne dass eine Installation erforderlich ist.

Wie Sie sehen können, zielen PWAs darauf ab, den Benutzern eine umfassende Websiteerfahrung mit den optimierten Funktionen und dem Schnittstellendesign einer nativen App zu bieten.

Progressive Web-Apps und Service-Mitarbeiter

Schlüssel zu progressiven Web-Apps sind Service-Mitarbeiter für Browser.

Ein Service-Worker ist ein Skript, das im Hintergrund Ihres Browsers ausgeführt wird, “getrennt von einer Web-Seite, die die Tür zu Funktionen öffnet, die keine Web-Seite oder Benutzerinteraktion erfordern.” Sie können Servicemitarbeiter wie Push-Benachrichtigungen und Hintergrundsynchronisierung verwenden. So deaktivieren Sie störende Benachrichtigungen in Chrome, Firefox, Safari und mehr. So deaktivieren Sie störende Benachrichtigungen in Chrome, Firefox, Safari und mehr. So können Sie lästige Browserbenachrichtigungen in Chrome deaktivieren. Safari, Opera, Firefox und Microsoft Edge. Lesen Sie im Moment mehr, aber die unmittelbare PWA-Zukunft verleiht diesen Skripts mehr Leistung.

Service-Mitarbeiter bilden somit die Grundlage des PWA-Standards und nutzen den Web-Cache für fast sofortige Ergebnisse.

Vor Service-Mitarbeitern war das Go-To-Browser-Cache-Skript Application Cache (oder App Cache). App Cache-Funktionen in einer Vielzahl von Offline-First-Services, waren jedoch etwas fehleranfällig. Darüber hinaus hat App Cache mehrere bekannte Einschränkungen, wie A List Apart erläutert.

Das Hauptproblem für Entwickler ist jedoch das Fehlen einer direkten Interaktion mit der genauen Funktionsweise von AppCache, sodass Entwickler die Probleme nicht sofort beheben können, wenn sie auftreten. Websites und Dienste mit voller Offline-Funktionalität waren wiederum eine riskante Wahl.

Servicemitarbeiter halten jedoch nur so lange, wie es erforderlich ist. Wenn Sie in einer PWA auf etwas klicken oder eine Funktion verwenden, wird ein Servicemitarbeiter aktiv. Der Service-Mitarbeiter (denken Sie daran, es handelt sich um ein Skript) verarbeitet das Ereignis und entscheidet, ob der Offline-Cache die Anforderung abschließen kann. Die Idee ist, dass der PWA mehrere Offline-Caches zur Auswahl bietet, wodurch ein viel größeres Spektrum an Offline-Funktionen zur Verfügung steht.

Darüber hinaus ist der Cache nicht nur für Offline-Geschwindigkeitssteigerungen gedacht. Zum Beispiel gehen Sie zu einem PWA, aber Ihre Verbindung ist äußerst lückenhaft. Der Servicemitarbeiter stellt einen vorherigen Cache bereit, der voll funktionsfähig ist, ohne Ihre Erfahrung zu unterbrechen.

PWAs: Welche Browseroptionen gibt es??

Für die Verwendung einer PWA sind zwei Voraussetzungen erforderlich: ein kompatibler Browser und ein PWA-fähiger Dienst.

Betrachten wir zunächst die Browser. Ist PWA bereit? Website ist die beste Möglichkeit, die Browserunterstützung zu überprüfen.

Brechen Sie es etwas mehr ab:

• Desktopbrowser (vollständige Unterstützung): Chrome, Firefox, Opera, QQ-Browser, 360-Browser
• Desktopbrowser (fehlerhafte Unterstützung): Safari, Microsoft Edge
• Mobiler Browser (vollständige Unterstützung): Chrome, Firefox, Xiaomi, UC-Browser, Baidu, Wechat, Sogou, 360-Browser, Quark
• Mobiler Browser (teilweise Unterstützung): Samsung, QQ-Browser
• Mobiler Browser (fehlerhafte Unterstützung): Gepard

Daher unterstützen alle gängigen Browser PWAs. Im Falle von Microsoft Edge und Safari wird in Kürze zusätzliche Unterstützung für PWA bereitgestellt.

PWAs suchen und installieren

Da Sie nun wissen, welchen Browser Sie verwenden möchten, können Sie über die Suche und Installation einer PWA nachdenken. In diesem Beispiel verwende ich ein Samsung Galaxy S8 mit Chrome.

PWAs sind bereits überall. Viele Unternehmen passen ihre Websites und Services an, um die PWA-Funktionalität anzubieten. Es gibt jedoch noch keine sichere Methode, einen PWA zu finden. PWAs werden nicht im Google Play Store oder App Store bereitgestellt. Nach meiner Erfahrung führt das Übertragen zu einer mobilen Website eines Unternehmens oder einer Dienstleistung normalerweise zu einer Zum Startbildschirm hinzufügen Dialogbox.

Sehen Sie sich das Video unten an, um zu sehen, was passiert, wenn Sie die mobile Website von Twitter besuchen.

Sobald Sie auf die Schaltfläche tippen Zum Startbildschirm hinzufügen Wenn Sie auf die Schaltfläche klicken, wird die PWA in Ihrer App-Schublade angezeigt. Es ist fast so, als würde man eine App normalerweise von Google Play installieren.

Natürlich ist es nicht sinnvoll, unzählige Websites zu besuchen und zu hoffen, dass der Homescreen-Trigger angezeigt wird. In der Tat ist es geradezu zeitraubend. So wie es aussieht, gibt es nicht viele Websites, die sich mit der Auflistung von PWAs befassen, und die vorhandenen Websites durchsuchen das Web nicht wie eine Suchmaschine. Wie funktionieren Suchmaschinen? Wie funktionieren Suchmaschinen? Für viele ist Google das Internet. Es ist wohl die wichtigste Erfindung seit dem Internet. Und während sich Suchmaschinen seitdem stark verändert haben, sind die zugrundeliegenden Prinzipien immer noch dieselben. Weiterlesen .

Versuchen Sie es zuerst mit outweb. Es enthält eine ziemlich gute Anzahl von PWAs, wobei häufig neue Optionen angezeigt werden. Als nächstes versuchen Sie pwa.rocks. Es hat eine kleinere Auswahl, aber einige praktische PWAs, die Sie Ihrem Gerät hinzufügen möchten.

Ersetzen PWAs native Apps?

Progressive Web Apps sind ein hervorragender Hybridschritt zwischen Ihrem Browser und einer nativen App. Ersetzen sie native Apps vollständig? Angesichts der Tatsache, dass der derzeitige Schwerpunkt auf bestehenden Websites und Diensten liegt, ist dies derzeit nicht der Fall.

Zweifellos werden wir jedoch mehr Crossovers sehen. Die bei PWA Stats verfügbaren Statistiken stützen auch dies. Hier sind ein paar interessante Zahlen zum Nachdenken:

• Trivago verzeichnete eine Steigerung des Engagements um 150 Prozent für Benutzer, die ihre PWA auf einem Startbildschirm hinzufügen.
• Forbes 'PWA “lädt in 2,5 Sekunden,” Die Impressionen pro Besuch sind um 10 Prozent gestiegen. Bei der PWA von Forbes wurden die Länge der Benutzersitzungen ebenfalls verdoppelt.
• Twitter Lite verzeichnete einen Anstieg der Seiten pro Sitzung um 65 Prozent und die Tweets um 75 Prozent.
• Alibaba verzeichnete einen Anstieg der mobilen Konversionen um 76 Prozent.

PWAs sind noch nicht Mainstream. Aber mit der großen Bandbreite an Vorteilen, die sie bieten, z. B. Speicherplatz auf Ihrem Gerät sparen. Mit diesen 7 Lite-Apps auf Android-Apps sparen Mit diesen 7 Lite-Apps mit Android-Apps sparen Wenn Sie ein älteres Gerät oder ein billiges Android-Handy besitzen, Diese Apps sind für Sie viel besser als ihre Mainstream-Pendants. Lesen Sie mehr, Sie werden im Laufe des Jahres 2018 und darüber immer mehr erfahren.

Erfahren Sie mehr über: Android Apps, Progressive Web Apps, Web.