Vereinfachen Sie die Android-Entwicklung mithilfe von manifoldJS mit Crosswalk

Mit Version 0.3.0 von manifoldJS können Sie Ihre Android-Apps jetzt mit Crosswalk anstelle der herkömmlichen Android-Webansicht erstellen. Es ist ziemlich einfach zu implementieren.

Wenn Sie nicht vertraut sind, ist manifoldJS ein neues Open-Source-Framework, mit dem Sie eine Website für Windows, iOS, Android, Chrome und Firefox erstellen und so die Erstellung gehosteter Apps auf verschiedenen Plattformen vereinfachen können. Es wurde auf der Microsoft Build 2015 Konferenz im April vorgestellt. manifoldJS wird als Befehlszeilentool über Node.js ausgeführt, oder Sie können das webbasierte Tool verwenden.

In diesem Lernprogramm zeige ich Ihnen die einfachen Schritte, um es zum Laufen zu bringen, damit Sie es selbst ausprobieren können. Stellen Sie zunächst sicher, dass Sie manifoldJS installiert haben und laufen.

Schritt 1

Installieren Sie Node.js von nodejs.org.

Schritt 2

Öffnen Sie Ihre bevorzugte Eingabeaufforderung (Terminal unter Mac oder Linux) und geben Sie Folgendes ein:

npm install manifoldjs -g

Jetzt fügen Sie einfach das Crosswalk-Flag zu Ihren Startparametern hinzu und beobachten, was als Nächstes passiert:

manifoldjs http://www.thishereweb.com -p Android -c

Und… BOOM! Sie haben gerade eine gehostete Web-App mit Crosswalk erstellt.

Ein praktisches Beispiel für Crosswalk

Mit Crosswalk können Sie sicher sein, dass die neuesten HTML5-Funktionen wie WebGL, IndexedDB, Web Sockets und CSS3 für Ihre App zur Verfügung stehen. Hier ist zum Beispiel die Ausgabe einer WebGL-Anwendung, die die Standard-Webansicht verwendet und von manifoldJS mit dem folgenden Befehl generiert wurde:

manifoldjs http://get.webgl.org/

Und hier ist dieselbe Anwendung mit Crosswalk aktiviert. Es wurde nach dem Hinzufügen des generiert -c (oder --Fußgängerübergang) Flag zum vorherigen Befehl:

manifoldjs http://get.webgl.org/ --crosswalk

Oder:

manifoldjs http://get.webgl.org/ -c

Mit Crosswalk können Sie sicher sein, dass alle Benutzer die beabsichtigte Erfahrung erhalten.

Was ist Crosswalk??

Crosswalk ist eine vom Crosswalk-Projekt entwickelte Weblaufzeitumgebung. Crosswalk hat die Open-Source-Chromium- und Blink-Engines zu einer modernen, aktuellen Laufzeitumgebung zusammengestellt. Sie können sich Crosswalk als leistungsfähige Webansicht vorstellen. Wenn das Crosswalk-Flag gesetzt ist, verwenden wir es anstelle des herkömmlichen Android-Webview.

Warum ist Crosswalk wichtig??

Crosswalk-Unterstützung bringt zwei Hauptvorteile. Zunächst handelt es sich um eine "aktualisierte" Web-Laufzeitumgebung. Dies ist für Android-Benutzer unter einer neueren Version des Android-Betriebssystems möglicherweise kein großer Vorteil, für ältere Betriebssystemversionen ist dies jedoch eine immense Verbesserung. Über den Crosswalk-Webview erhalten Sie Zugriff auf die neuesten HTML5-Funktionen und Leistungssteigerungen gegenüber dem herkömmlichen Webview.

Zweitens bietet Crosswalk eine konsistente Laufzeitumgebung. Mit all den verschiedenen Versionen von Android, die heutzutage verwendet werden, gibt es so viele verschiedene Versionen von Android-Webview, sodass Sie gezwungen sind, auf den kleinsten gemeinsamen Nenner zu schreiben. Die Verwendung von Crosswalk beseitigt dieses Hindernis. Außerdem ändert sich die Laufzeitumgebung nur, wenn Sie sie in Ihrer App aktualisieren, nicht mit dem Betriebssystem. Wir wissen, dass sich viele Unternehmensbenutzer für ihre Anwendungen auf diese Art von Konsistenz verlassen.

Warum sollte ich Crosswalk nicht verwenden??

Ich kann nur an einen Grund denken, warum Sie Crosswalk nicht verwenden möchten: Anwendungsgröße. Die durchschnittliche .apk-Datei (eine Anwendungsdatei für Android), die wir erstellen, beträgt nur wenige Megabyte. Durch Hinzufügen von Crosswalk zur App werden nach der Installation auf dem Gerät weitere 20 MB hinzugefügt. Dies entspricht nahezu 60 MB. Sie müssen entscheiden, ob die Ressourcenkosten es wert sind.

Die Bündelung der Laufzeit mit der Anwendung ist der einfachste Ansatz für Verteilungszwecke. Crosswalk-Anwendungen können jedoch auch eine einzige Laufzeitbibliothek (im "Shared Mode") gemeinsam nutzen, um die Last zu verringern. Ein Paket, das den gemeinsamen Modus aktiviert, ist Teil der Crosswalk für Android-Distribution. Sie müssen dieses gemeinsam genutzte Laufzeitpaket jedoch selbst verteilen. Besuchen Sie das Crosswalk-Wiki für weitere Informationen.

Beachten Sie, dass eine gehostete Web-App darin besteht, dass Sie Ihre App-Aktualisierungen auf Ihrem Webserver vornehmen. In den meisten Fällen werden die Kosten der hinzugefügten Paketgröße beim ersten Download spürbar sein, nicht bei jedem Update wie bei einer normalen nativen App.

Gehen Sie zum Crosswalk

Wir freuen uns, die Crosswalk-Web-Laufzeitumgebung unterstützen zu können. Es füllt eine Lücke im Android-System, die die Entwicklung einfacher und zuverlässiger macht. Probieren Sie es mit Ihrer nächsten manifoldJS-App aus und sehen Sie, was Sie denken. Weitere Informationen zu Crosswalk finden Sie auf der Crosswalk-Projektwebsite. Um mit dem Erstellen von Store-Apps von Ihrer Website aus zu beginnen, rufen Sie die manifoldJS-Website auf und legen Sie los.

Weitere praktische Übungen mit JavaScript

Dieser Artikel ist Teil der Webentwicklungsserie von Microsoft-Experten für technisches Wissen über praktisches JavaScript-Lernen, Open-Source-Projekte und bewährte Vorgehensweisen für Interoperabilität, einschließlich Microsoft Edge-Browser und der neuen EdgeHTML-Rendering-Engine. 

Wir empfehlen Ihnen, Browser und Geräte einschließlich Microsoft Edge, dem Standardbrowser für Windows 10, mit kostenlosen Tools auf dev.modern.IE zu testen:

  • Scannen Sie Ihre Site nach veralteten Bibliotheken, Layoutproblemen und Eingabehilfen.
  • Verwenden Sie virtuelle Maschinen für Mac, Linux und Windows.
  • Testen Sie Remote auf Ihrem eigenen Gerät auf Microsoft Edge.
  • Coding Lab auf GitHub: Browserübergreifende Tests und bewährte Methoden.

Umfassendes technisches Lernen von Microsoft Edge und der Webplattform durch unsere Ingenieure und Evangelisten:

  • Microsoft Edge Web Summit 2015 (mit dem neuen Browser, den neuen unterstützten Webplattformstandards und Gastrednern der JavaScript-Community)
  • Woah, ich kann Edge & IE auf einem Mac & Linux testen! (von Rey Bango)
  • JavaScript voranbringen, ohne das Internet zu durchbrechen (von Christian Heilmann)
  • Die Edge-Rendering-Engine, mit der das Web einfach funktioniert (von Jacob Rossi)
  • 3D-Rendering mit WebGL entfesseln (von David Catuhe, einschließlich der Projekte Vorlon.JS und BabylonJS)
  • Gehostete Web-Apps und Web-Plattform-Innovationen (von Kevin Hill und Kiril Seksenov, einschließlich des Projekts manifoldJS)

Weitere kostenlose plattformübergreifende Tools und Ressourcen für die Webplattform:

  • Visual Studio Code für Linux, OS X und Windows
  • Code mit Node.js und kostenlose Testversion auf Azure