Progressive Web App



Eine Progressive Web App ( PWA ) is a Webseite Welche Zahlreiche Male Hinweis Besitzt bislang sterben native App vorbehalten Waren s. [1] Sie Kann DAHER Auch als Symbiosis Aus einer Antwort Iven Webseite und Eine Appbeschrieben Werden. Progressive Web Apps, die mit HTML5 , CSS3 und JavaScript implementiert wurden . In addition Dienen sogenannte Service – Worker Durch Optimales Caching wo Offline – -Funktionalitäten. Zur KommunikationSwing Webclient und Webserver ist das HTTPS-Protokoll .

Progressive Web Apps schließen eine lange bekannte Lücke im „Mobile First“ -Ansatze aus . Mehr und mehr Menschen Smartphone , um ins Internet zu gehen. In Deutschland hat Anteil der Internetnutzer über 69% der Internetnutzer über Smartphone im Jahr 2014. [2] Dies ist ein Problem für Webseitenbetreiber, das eine responsive oder mobile Webseite als auch eine native App entwickelt hat, in der sich der Benutzer befindet. Eine PWA macht sterben doppelte Entwicklung Überfluß, wenn sie Wie eine Webseite Profilierung mittels URL aufgerufen Werden Kann und gleichzeitig offline Funktionalitäten bereitstellt.

Funktionales Schweißen

Der Benutzer startete Ihre Progressive Web App, die z. B. Im Browser Browser wird die URL von Web-Servern eingegeben und die erste Anfrage wird gesendet. There Web Server nimmt diese Anfrage entgegen und übergibt sie an die PWA, wer hier funkt, wer eine Webanwendung besitzt . Dieser generiert oder lädt den HTML Quellcode einer Webseite, der ein Webserver ist und den Browser von Nutzern aktiviert (HTTPS Response).

Es Nutz sieht Eine Webseite, sterben aufgrund Jan Antwort Iven Designs ein sein Endgerät adapted ist. Obwohl Progressive Web App über eine URL laufen lassen, aber auch ein Icon auf Ihrem HomeScreen des Smartphones finden Sie unter oder Push- Benachrichtigungen und die Seite auch offline. Die fortschreitende Weiterentwicklung von Technologietechnologie-Lighting Editoren, Senior Speakers Technische Möglichkeiten, The Bestmögliche User Experience .

Technical wird mit HTML5, CSS3, JavaScript, Service Worker und optional einem Framework wie Angular oder eine Librarie, die Polymer realisiert.

Servicemitarbeiter

Ein Service Worker ist ein JavaScript, weil Webbrowsern im Hintergrund ausgeführt wird. E-Mail Progressive Web App Essentials Funktionalitäten Wer Caching Zur Offline-Nutzungbarkeit zur Verfügung stellt. [3]Only online ongerufen, the containing the current of the connection of the another accounts. (Offline-Betrieb). Auch de von nativen Apps entdecken Push-Benachrichtigungen sind mit Service Workern möglich. Service Worker muss programmiert sein, im JavaScript wird die Seite registriert und anschließend installiert. Service Worker fragte HTTPS, warum auch jede Progressive Web App mit HTTPS leuft. Zahlreiche Frameworks, die Z Angular mit dem Mobile Toolkit vorbereiten bereiten Service Worker vor, sodas dies nicht zwingend selbst entwickelt werden muss.

Zeichen

Trotz ihrer primären Identität als Websites setzen Progressive Web Apps den ganzen Weg bis zum unteren Bildschirmrand.

Add-To-Homescreen

Das Add-To-Homescreen-Funktionalitäts-Kit kann der Webmaster-Browser über das Hamburger-Menü-Icon abgerufen werden. Hasse eine Nutzer und Progressive Web App, du kannst diesen Bildschirm benutzen, um den Handy Hub zu sehen, der auch für das PWA spezifisches Icon verfügbar ist. Mit einem Klick auf das Symbol wird die PWA geöffnet, auch wenn die Benutzer offline sind. Die Add-To-Homescreen-Funktion hat nur Vorteile: Die Hürde für Nutzer ist kleiner als der Eine-App-Installer und Speicherplatz zu verschwinden. Die Kundenbinding ist aber so hoch wie beim Herunterladen einer nativen App.

Push Benachrichtigungen

Push-Benachrichtigungen Mind Ebenfalls von Nativen Apps bekannt. Inhaber der Progressive Web App can DAMIT Nutz beispielsweise auf Aktion , Rabatte oder Ereignisse aufmerksam machen und so sterben Interaktionsratesteigern.

Offline-Funktionalitätspaket

Mittel der Caching -Funktion der Servicewerker stehen einmal abgeraufene Dinge auch offline zur Verfügung. Auch dieses Feature ist eine native App, die eine tolle Internetverbindung bietet . Animation für Webmaster mit Nutzern, die eine Internet-Verbindung hat, ist ein elementarer Aspekt. Progressive Web Apps Folge Verknüpfung Offline Offline First Ansatz.

Keine Installation

PWAs Müssen nicht Auf dem Smartphone oder Tablet – Computer Installation Verbündeten Werden. Dies hat enorme Vorteile, da alle Smartphone-Nutzer schnell an der Grenze des Speicherplatzes stoßen. Zugegeben ist eine Hürde eine App zu Installer war hier, da nur eine Webseite aufzusetzen und einen Homescreen Icon hinzuzufügen. Betreiber einer PWA empfiehlt auch, dass Sie als neue App gewinnen, aber eine hohe Conversion Rate und Kundenbindung. Als Progressive Web Apps installiert wurde, waren die Teile für die Vermarktung Nehmen Würden.

Unterstützung

Eine vollständige Unterstützung von Progressive Web Apps ist nicht möglich oder fröhlich. Stirbt, dass die Service Worker oder nicht von allen Browsern unterstützt wird. Chrome- und Firefox- Köpfe werden mit Safari , Opera und Edge Gibt’s kompatibel gemacht. [4] Current (Juni 2016) wurde aber behauptet, dass Offline-Funktionalität für iOS nicht aktiviert sei, da Safari Service Worker nicht unterstützt. Da PWAs Abweichung von Progressive Enhancement eingestellt wurde, kannte Apple Nutzer Progressive Web Apps, was aufgrund der Wichtigkeit der Internetverbindung nicht der Fall war.

Beispiele

Das Erste Erfolgreicher Progressive Web Apps Ist von der Washington Post [5] , Flip Map [6] , Booking.com [7] und Air Berlin [8] . Flipkart wird als Vorzeigebeispiel, da der indische Online-Shop den 70% Conversion-Rate erhielt und im Auftrag von Seiten vergeben wurde. [1] Die Zahl arbeitet an dem Nutzer, der die Add-To-Homescreen-Funktion wiederherstellt.

Weblinks

  • Ihre erste Progressive Web App – Leitfaden von Google Developers
  • Was sind Progressive Web Apps? – Owen Campbell-Moore, Produktmanager, Google. Oxford CS-Abschluss., Kamal Bhatt, Chris Visser
  • Progressive Web-Apps für alle Frameworks – Google I / O 2016 Youtube-Video von PWA in Frameworks
  • Progressive Web Apps (Chrome Dev Summit 2015) Youtube Video des Chrome Dev Summit 2015 mit Alex Russell und Andreas Bovens
  • Web App Manifesto Arbeitsentwurf des W3C Standardisierte Beschreibungen von Web Apps

Einzelstunden

  1. Hochspringen↑ Christian Liebel: Fortschrittliche Web-Apps, Teil 1: Das Web wird nativ (s). Abgerufen ist der 30. Oktober 2017 .
  2. Hochspringen↑ Mobiles Internet Nutzer – Teil in Deutschland 2014 | Statistiken. In: Statista. Abgerufen am 23. Juni 2016 .
  3. Hochspringen↑ Einführung in den Service Worker: Verwendung von Service Worker – HTML5 Rocks. Abgerufen am 23. Juni 2016 .
  4. Hochspringen↑ Ist ServiceWorker bereit? In: jakearchibald.github.io. Abgerufen am 24. Juni 2016 .
  5. Hochspringen↑ Die Washington Post stellt neue Progressive Web App-Erfahrung vor (washingtonpost.com vom 19. Mai 2016, abgerufen am 25. Juni 2016)
  6. Hochspringen↑ Progressive Web App: Eine neue Art, Mobile zu erleben (techniclog.flipkart.net vom 9. november 2015, abgerufen am 25. juni 2016)
  7. Hochspringen↑ Fortschrittliche Web-Apps mit Service-Mitarbeitern (booking.com vom 21. April 2016, abgerufen am 25. Juni 2016)
  8. Hochsprung↑ Air Berlin entwickelt „Progressive Web App“ (airberlin.com vom 20. Mai 2016, abgelaufen am 20. April 2017)

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.