PhoneGap: Was es ist, Funktionen und App-Erstellung auf der Adobe-Plattform

Was ist PhoneGap?

PhoneGap ist eine Plattform zur Entwicklung mobiler Anwendungen, die ursprünglich von Nitobi Software im Jahr 2009 entwickelt wurde. 2011 übernahm Adobe Nitobi und veröffentlichte PhoneGap als kommerzielles Produkt, wobei der Framework-Kern unter dem Namen Cordova an die Apache Software Foundation übergeben wurde.

Geschichte und Entwicklung

PhoneGap wurde 2008 auf der iPhoneDevCamp-Konferenz entwickelt, wo Entwickler von Nitobi Software die Technologie demonstrierten, Webanwendungen in einen nativen Container zu verpacken. Die erste öffentliche Version wurde 2009 veröffentlicht und zog sofort die Aufmerksamkeit der Webentwickler-Community auf sich, die nach Möglichkeiten suchten, ohne Erlernen von Objective-C in den mobilen Markt einzusteigen.

Die Hauptinnovation von PhoneGap bestand darin, dass Entwickler vertraute Webtechnologien — HTML, CSS und JavaScript — verwenden konnten, um Anwendungen zu erstellen, die über App-Stores auf dem Gerät installiert werden und Zugriff auf native Funktionen wie Kamera, GPS, Kontakte und Beschleunigungsmesser haben.

Laut Adobe Developer Relations (2015) nutzten in der Spitzenzeit über 600.000 Entwickler weltweit PhoneGap. Die Plattform war besonders beliebt bei Webstudios und Freiberuflern, die ihr Portfolio um mobile Projekte erweitern wollten, ohne iOS- und Android-Ingenieure einzustellen.

Unterschiede zwischen PhoneGap und Apache Cordova

Der Hauptunterschied zwischen PhoneGap und Apache Cordova liegt im Vertriebsmodell und den zusätzlichen Diensten. Cordova ist ein reines Open-Source-Framework, das von der Apache Foundation verwaltet wird, während PhoneGap seine kommerzielle Distribution mit exklusiven Adobe-Funktionen ist.

Der Hauptvorteil und der entscheidende kommerzielle Unterschied von PhoneGap gegenüber Apache Cordova ist der Dienst PhoneGap Build, der die Kompilierungsphase übernimmt. Der Entwickler lädt die Quellcodedateien auf den Adobe-Server hoch, wählt die Zielplattformen aus und erhält fertige Binärdateien, ohne Android SDK, Xcode oder zugehörige Build-Tools installieren zu müssen.

Darüber hinaus enthielt PhoneGap eine Integration mit Adobe Creative Cloud, die es Designern ermöglichte, Layouts aus Photoshop direkt in die PhoneGap-Projektstruktur zu exportieren. Diese Funktion war in kleinen Teams ohne dedizierten mobilen Entwickler gefragt.

PhoneGap Build: Cloud-App-Building

PhoneGap Build ist ein Adobe-Webdienst, der den Quellcode von PhoneGap/Cordova-Anwendungen in Installationsdateien für iOS (.ipa), Android (.apk), Windows Phone (.xap) und andere Plattformen kompiliert. Der Benutzer muss die SDKs der Zielbetriebssysteme nicht auf seinem Computer installieren.

Der Build-Prozess besteht aus drei Schritten: Der Entwickler archiviert das Projekt (oder verweist auf ein Git-Repository), lädt es auf build.phonegap.com hoch und wählt die Plattformen aus. Innerhalb weniger Minuten gibt der Server die fertigen Binärdateien zum Hochladen in die App-Stores zurück.

PhoneGap Build unterstützte zwei Arten von Abonnements: kostenlos (bis zu 2 Apps, öffentlicher Build) und kostenpflichtig (bis zu 25 Apps, privater Build, benutzerdefinierte Symbole und Zertifikate). Für iOS war ein Signaturzertifikat des Apple Developer Program erforderlich, das der Benutzer in sein persönliches Konto hochlud. Der Mechanismus von Build war einfach: Der Benutzer sendete ein ZIP-Archiv oder verwies auf ein Git-Repository, der Server bestimmte automatisch die Plattformen und gab die fertigen Binärdateien über das Kontrollpanel zurück.

Laut Adobe Blog (2017) durchliefen monatlich über 500.000 Builds PhoneGap Build. Der Dienst war besonders beliebt in Bildungseinrichtungen und bei Hackathons, wo die Teilnehmer keinen Zugang zur Mac-Infrastruktur hatten. Entwickler nutzten Build auch, um Kunden Prototypen direkt auf Geräten ohne Einrichtung der Umgebung zu demonstrieren.

Codebeispiele und PhoneGap-Setup

Die Struktur eines PhoneGap-Projekts ist identisch mit der von Cordova. Der einzige Unterschied besteht in der Konfigurationsdatei config.xml, wo ein -Element hinzugefügt wird, das die PhoneGap-Version und die Adobe-Anwendungs-ID angibt.

<?xml version='1.0' encoding='utf-8'?>
<widget id='com.adobe.phonegap.app'
        version='1.0.0'
        xmlns='http://www.w3.org/ns/widgets'
        xmlns:gap='http://phonegap.com/ns/1.0'>
    <name>PhoneGapApp</name>
    <description>
        PhoneGap-App
    </description>
    <gap:platform name='ios' />
    <gap:platform name='android' />
    <gap:plugin name='cordova-plugin-camera' />
    <gap:config platform='ios' min-version='13.0' />
</widget>

Diese Konfigurationsdatei definiert eine Anwendung mit iOS- und Android-Unterstützung, gibt eine Mindestversion von iOS 13 an und bindet das Kamera-Plugin ein. Beim Hochladen auf PhoneGap Build erkennt der Server diese Einstellungen automatisch und erstellt das Projekt mit den erforderlichen Abhängigkeiten.

Beispiel für grundlegenden JavaScript-Code mit Behandlung des Gerätebereit-Ereignisses und Aufruf eines nativen Dialogs:

document.addEventListener('deviceready', function() {
  console.log('PhoneGap bereit zum Arbeiten');

  document.getElementById('btnAlert')
    .addEventListener('click', function() {
      navigator.notification.alert(
        'Hallo von PhoneGap!',
        function() { console.log('OK'); },
        'Nachricht',
        'Schließen'
      );
    });
});

Das deviceready-Ereignis ist ein obligatorischer Einstiegspunkt in allen PhoneGap- und Cordova-Anwendungen. Ohne dieses Ereignis funktionieren native API-Aufrufe nicht, da die Brücke noch nicht initialisiert wurde. Nach der Bereitschaft sind alle Plugins verfügbar, einschließlich notification.alert für native Dialogfenster.

Vor- und Nachteile von PhoneGap

PhoneGap hatte eine Reihe von Vorteilen, die es Mitte der 2010er Jahre populär machten, aber auch Einschränkungen, die nach 2018 zu einem Rückgang seines Marktanteils führten.

Stärken

Der Hauptvorteil von PhoneGap ist die niedrige Einstiegshürde für Webentwickler. HTML, CSS und JavaScript sind Technologien, die jeder Frontend-Spezialist beherrscht, sodass Webentwicklungsstudios schnell in den Markt für mobile Apps einsteigen konnten, ohne iOS- und Android-Ingenieure einzustellen.

Der Cloud-Dienst PhoneGap Build löste das Infrastrukturproblem: Windows-Teams konnten iOS-Apps bauen, ohne einen Mac kaufen zu müssen. Dies war kritisch für Startups mit begrenztem Budget für Ausrüstung.

Schwächen

Der Hauptnachteil von PhoneGap ist die Leistung. WebView ist langsamer als native UI-Frameworks, insbesondere bei komplexen Animationen, großen Listen und Grafikverarbeitung. Laut HTML5Rocks-Tests (2016) dauerte das Rendern einer Liste mit 1000 Elementen in PhoneGap 200–400 ms gegenüber 16–30 ms in einer nativen Anwendung.

Weitere Einschränkungen waren die Abhängigkeit von der WebView-Version auf dem Gerät des Benutzers, Probleme beim Debuggen nativer Plugins und fehlender Zugriff auf neue iOS- und Android-APIs bis zur Veröffentlichung entsprechender Cordova-Plugins.

PhoneGap heute: Support und Migration

Im Jahr 2020 kündigte Adobe die Einstellung des Supports für PhoneGap und PhoneGap Build an. Das Unternehmen übergab die Entwicklungen an die Community mit der Empfehlung, auf Apache Cordova oder Capacitor umzusteigen. PhoneGap Build wurde eingestellt und das Cloud-Building ist nicht mehr verfügbar.

Für bestehende PhoneGap-Projekte wird die Migration auf Capacitor empfohlen — dies ist ein direkter Weg mit minimalen Codeänderungen. Ersetzen Sie einfach die Initialisierungsskripte und aktualisieren Sie die Konfiguration. Der gesamte JavaScript-Code und die HTML-Vorlagen bleiben unverändert, da Capacitor die gleichen Brückenprinzipien verwendet.

Eine alternative Option ist der direkte Wechsel zu Apache Cordova. Dies erfordert die lokale Installation von Plattformen über die CLI und die Einrichtung lokaler Builds, bewahrt aber die volle Kompatibilität mit vorhandenen Plugins und der Anwendungsarchitektur.

Trotz der Einstellung ist die historische Bedeutung von PhoneGap kaum zu überschätzen. Es war PhoneGap, das dem Markt zeigte, dass Webtechnologien die Grundlage für mobile Anwendungen sein können, und den Weg für moderne Hybrid- und Cross-Plattform-Frameworks ebnete. Das Konzept des Cloud-Buildings, das erstmals in PhoneGap Build implementiert wurde, wurde später von Ionic Appflow, Visual Studio App Center und anderen CI-Diensten für mobile Projekte übernommen.

Die architektonischen Entscheidungen von PhoneGap — die Brücke über WebView, das Plugin-System und die Konfiguration über config.xml — wurden zum De-facto-Standard für die hybride Entwicklung. Selbst in modernen Capacitor-Projekten ist das Erbe von PhoneGap sichtbar: dieselben Prinzipien der Arbeit mit Plugins und ein ähnlicher Build-Prozess.

Für Entwickler, die alte PhoneGap-Projekte warten, ist die Schlüsselfähigkeit das Verständnis der Plugin-Brücke und die Fähigkeit, Plugins an moderne Android- und iOS-Versionen anzupassen. Ohne dies wird die Aktualisierung der Anwendung zur Erfüllung neuer Store-Anforderungen aufgrund veralteter Systemberechtigungen unmöglich.