PhoneGap: ουσία, δυνατότητες και δημιουργία εφαρμογών στην πλατφόρμα Adobe

Τι είναι το PhoneGap;

PhoneGap — είναι μια πλατφόρμα για ανάπτυξη κινητών εφαρμογών, που δημιουργήθηκε αρχικά από την εταιρεία Nitobi Software το 2009. Το 2011, η Adobe εξαγόρασε τη Nitobi και κυκλοφόρησε το PhoneGap ως εμπορικό προϊόν, μεταφέροντας τον πυρήνα του πλαισίου στο Apache Software Foundation με το όνομα Cordova.

Ιστορία δημιουργίας και εξέλιξη

Το PhoneGap δημιουργήθηκε στο συνέδριο iPhoneDevCamp το 2008, όπου οι προγραμματιστές της Nitobi Software παρουσίασαν την τεχνολογία περιτύλιξης διαδικτυακών εφαρμογών σε εγγενές κοντέινερ. Η πρώτη δημόσια έκδοση κυκλοφόρησε το 2009 και τράβηξε αμέσως την προσοχή της κοινότητας προγραμματιστών ιστού που αναζητούσαν τρόπους εισόδου στην κινητή αγορά χωρίς να μάθουν Objective-C.

Η κύρια καινοτομία του PhoneGap ήταν ότι οι προγραμματιστές μπορούσαν να χρησιμοποιούν γνωστές τεχνολογίες ιστού — HTML, CSS και JavaScript — για τη δημιουργία εφαρμογών που εγκαθίστανται στη συσκευή μέσω καταστημάτων εφαρμογών και έχουν πρόσβαση σε εγγενείς λειτουργίες: κάμερα, GPS, επαφές και επιταχυνσιόμετρο.

Σύμφωνα με το Adobe Developer Relations (2015), στην κορύφωση της χρήσης, πάνω από 600 χιλιάδες προγραμματιστές παγκοσμίως χρησιμοποιούσαν το PhoneGap. Η πλατφόρμα ήταν ιδιαίτερα δημοφιλής μεταξύ διαδικτυακών στούντιο και freelancers που ήθελαν να επεκτείνουν το χαρτοφυλάκιό τους με κινητά έργα χωρίς να προσλαμβάνουν μηχανικούς iOS και Android.

Διαφορές μεταξύ PhoneGap και Apache Cordova

Η κύρια διαφορά μεταξύ PhoneGap και Apache Cordova έγκειται στο μοντέλο διανομής και στις πρόσθετες υπηρεσίες. Το Cordova είναι ένα καθαρό πλαίσιο ανοιχτού κώδικα υπό τη διαχείριση του Apache Foundation, ενώ το PhoneGap είναι η εμπορική του διανομή με αποκλειστικές δυνατότητες της Adobe.

Το κύριο πλεονέκτημα και η σημαντικότερη εμπορική διαφορά του PhoneGap έναντι του Apache Cordova — είναι η υπηρεσία PhoneGap Build, που αναλαμβάνει το στάδιο της μεταγλώττισης. Ο προγραμματιστής ανεβάζει τα αρχεία πηγής στον διακομιστή της Adobe, επιλέγει τις πλατφόρμες-στόχους και λαμβάνει έτοιμα δυαδικά αρχεία χωρίς εγκατάσταση Android SDK, Xcode και σχετικών εργαλείων μεταγλώττισης.

Επιπλέον, το PhoneGap περιλάμβανε ενσωμάτωση με το Adobe Creative Cloud, επιτρέποντας στους σχεδιαστές να εξάγουν μακέτες από το Photoshop απευθείας στη δομή του έργου PhoneGap. Αυτή η λειτουργία ήταν περιζήτητη σε μικρές ομάδες χωρίς αποκλειστικό προγραμματιστή κινητών.

PhoneGap Build: μεταγλώττιση εφαρμογών στο cloud

PhoneGap Build — είναι μια διαδικτυακή υπηρεσία της Adobe που μεταγλωττίζει τον πηγαίο κώδικα της εφαρμογής PhoneGap/Cordova σε αρχεία εγκατάστασης για iOS (.ipa), Android (.apk), Windows Phone (.xap) και άλλες πλατφόρμες. Ο χρήστης δεν χρειάζεται να εγκαταστήσει στον υπολογιστή του τα SDK των λειτουργικών συστημάτων-στόχων.

Η διαδικασία μεταγλώττισης αποτελείται από τρία βήματα: ο προγραμματιστής αρχειοθετεί το έργο (ή υποδεικνύει ένα αποθετήριο Git), το ανεβάζει στο build.phonegap.com και επιλέγει τις πλατφόρμες. Μετά από λίγα λεπτά, ο διακομιστής επιστρέφει έτοιμα δυαδικά αρχεία για μεταφόρτωση στα καταστήματα εφαρμογών.

Το PhoneGap Build υποστήριζε δύο τύπους συνδρομών: δωρεάν (έως 2 εφαρμογές, δημόσια μεταγλώττιση) και επί πληρωμή (έως 25 εφαρμογές, ιδιωτική μεταγλώττιση, προσαρμοσμένα εικονίδια και πιστοποιητικά). Για iOS απαιτούνταν πιστοποιητικό μεταφόρτωσης Apple Developer Program, το οποίο ο χρήστης ανέβαζε στον προσωπικό του λογαριασμό. Ο μηχανισμός λειτουργίας του Build ήταν απλός: ο χρήστης έστελνε ένα αρχείο ZIP ή υπέδειχνε ένα αποθετήριο Git, ο διακομιστής προσδιόριζε αυτόματα τις πλατφόρμες και επέστρεφε έτοιμα δυαδικά αρχεία μέσω του πίνακα ελέγχου.

Σύμφωνα με το Adobe Blog (2017), πάνω από 500 χιλιάδες μεταγλωττίσεις πραγματοποιούνταν μηνιαίως μέσω του PhoneGap Build. Η υπηρεσία ήταν ιδιαίτερα δημοφιλής σε εκπαιδευτικά ιδρύματα και hackathons όπου οι συμμετέχοντες δεν είχαν πρόσβαση σε υποδομή Mac. Οι προγραμματιστές χρησιμοποιούσαν επίσης το Build για την παρουσίαση πρωτοτύπων σε πελάτες απευθείας σε συσκευές χωρίς διαμόρφωση περιβάλλοντος.

Παραδείγματα κώδικα και διαμόρφωσης PhoneGap

Η δομή του έργου PhoneGap είναι ταυτόσημη με το Cordova. Η διαφορά είναι μόνο στο αρχείο διαμόρφωσης config.xml, όπου προστίθεται το στοιχείο <gap> με την ένδειξη της έκδοσης PhoneGap και του αναγνωριστικού εφαρμογής Adobe.

<?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
    </description>
    <gap:platform name='ios' />
    <gap:platform name='android' />
    <gap:plugin name='cordova-plugin-camera' />
    <gap:config platform='ios' min-version='13.0' />
</widget>

Αυτό το αρχείο διαμόρφωσης ορίζει την εφαρμογή με υποστήριξη iOS και Android, καθορίζει την ελάχιστη έκδοση iOS 13 και συνδέει το πρόσθετο κάμερας. Κατά τη μεταφόρτωση στο PhoneGap Build, ο διακομιστής αναγνωρίζει αυτόματα αυτές τις ρυθμίσεις και μεταγλωττίζει το έργο με τις απαραίτητες εξαρτήσεις.

Παράδειγμα βασικού κώδικα JavaScript με χειρισμό του συμβάντος ετοιμότητας συσκευής και κλήση εγγενούς διαλόγου:

document.addEventListener('deviceready', function() {
  console.log('PhoneGap έτοιμο για χρήση');

  document.getElementById('btnAlert')
    .addEventListener('click', function() {
      navigator.notification.alert(
        'Γεια από το PhoneGap!',
        function() { console.log('OK'); },
        'Μήνυμα',
        'Κλείσιμο'
      );
    });
});

Το συμβάν deviceready — υποχρεωτικό σημείο εισόδου σε όλες τις εφαρμογές PhoneGap και Cordova. Χωρίς αυτό το συμβάν, οι κλήσεις εγγενών API δεν θα λειτουργήσουν, επειδή η γέφυρα δεν έχει ακόμη αρχικοποιηθεί. Μετά την ετοιμότητα, όλα τα πρόσθετα είναι διαθέσιμα, συμπεριλαμβανομένου του notification.alert για εγγενή παράθυρα διαλόγου.

Πλεονεκτήματα και μειονεκτήματα του PhoneGap

Το PhoneGap είχε μια σειρά από πλεονεκτήματα που το έκαναν δημοφιλές στα μέσα της δεκαετίας του 2010, αλλά είχε επίσης περιορισμούς που οδήγησαν στη μείωση του μεριδίου αγοράς του μετά το 2018.

Δυνατά σημεία

Το κύριο πλεονέκτημα του PhoneGap — χαμηλό εμπόδιο εισόδου για προγραμματιστές ιστού. Οι HTML, CSS και JavaScript είναι τεχνολογίες που γνωρίζει κάθε ειδικός frontend, επιτρέποντας στα διαδικτυακά στούντιο να εισέλθουν γρήγορα στην αγορά κινητών εφαρμογών χωρίς να προσλαμβάνουν μηχανικούς iOS και Android.

Η υπηρεσία cloud PhoneGap Build έλυσε το πρόβλημα υποδομής: ομάδες σε Windows μπορούσαν να μεταγλωττίζουν εφαρμογές iOS χωρίς να αγοράζουν Mac. Αυτό ήταν κρίσιμο για νεοφυείς επιχειρήσεις με περιορισμένο προϋπολογισμό για εξοπλισμό.

Αδύνατα σημεία

Το κύριο μειονέκτημα του PhoneGap — η απόδοση. Το WebView είναι πιο αργό από τα εγγενή πλαίσια UI, ειδικά σε σύνθετες κινούμενες εικόνες, μεγάλες λίστες και επεξεργασία γραφικών. Σύμφωνα με τις δοκιμές HTML5Rocks (2016), η απόδοση μιας λίστας 1000 στοιχείων διαρκούσε στο PhoneGap 200–400 ms έναντι 16–30 ms σε μια εγγενή εφαρμογή.

Πρόσθετοι περιορισμοί περιλάμβαναν την εξάρτηση από την έκδοση WebView στη συσκευή του χρήστη, προβλήματα εντοπισμού σφαλμάτων εγγενών προσθέτων και έλλειψη πρόσβασης σε νέα API iOS και Android έως την κυκλοφορία των αντίστοιχων προσθέτων Cordova.

PhoneGap σήμερα: υποστήριξη και μετανάστευση

Το 2020, η Adobe ανακοίνωσε τη διακοπή υποστήριξης για το PhoneGap και το PhoneGap Build. Η εταιρεία παρέδωσε τα επιτεύγματα στην κοινότητα με τη σύσταση μετάβασης στο Apache Cordova ή στο Capacitor. Το PhoneGap Build έκλεισε και η μεταγλώττιση cloud δεν είναι πλέον διαθέσιμη.

Για υπάρχοντα έργα PhoneGap, συνιστάται μετανάστευση στο Capacitor — αυτή είναι η πιο άμεση διαδρομή με ελάχιστες αλλαγές κώδικα. Αρκεί να αντικαταστήσετε τα σενάρια αρχικοποίησης και να ενημερώσετε τη διαμόρφωση. Όλος ο κώδικας JavaScript και τα πρότυπα HTML παραμένουν αμετάβλητα, καθώς το Capacitor χρησιμοποιεί τις ίδιες αρχές γέφυρας.

Εναλλακτική επιλογή — απευθείας μετάβαση στο Apache Cordova. Αυτό απαιτεί τοπική εγκατάσταση πλατφορμών μέσω CLI και διαμόρφωση τοπικής μεταγλώττισης, αλλά διατηρεί πλήρως τη συμβατότητα με υπάρχοντα πρόσθετα και την αρχιτεκτονική εφαρμογής.

Παρά το κλείσιμο, η ιστορική σημασία του PhoneGap είναι δύσκολο να υπερεκτιμηθεί. Ακριβώς το PhoneGap έδειξε στην αγορά ότι οι τεχνολογίες ιστού μπορούν να αποτελέσουν βάση για κινητές εφαρμογές, ανοίγοντας τον δρόμο για σύγχρονα υβριδικά και cross-platform πλαίσια. Η ιδέα της μεταγλώττισης cloud, που εφαρμόστηκε για πρώτη φορά στο PhoneGap Build, υιοθετήθηκε αργότερα από τα Ionic Appflow, Visual Studio App Center και άλλες υπηρεσίες συνεχούς ενσωμάτωσης για κινητά έργα.

Οι αρχιτεκτονικές αποφάσεις του PhoneGap — η γέφυρα μέσω WebView, το σύστημα προσθέτων και η διαμόρφωση μέσω config.xml — έγιναν το de facto πρότυπο για την υβριδική ανάπτυξη. Ακόμη και σε σύγχρονα έργα Capacitor, η κληρονομιά του PhoneGap είναι εμφανής: οι ίδιες αρχές εργασίας με πρόσθετα και παρόμοια διαδικασία μεταγλώττισης.

Για προγραμματιστές που συντηρούν παλιά έργα PhoneGap, η βασική δεξιότητα είναι η κατανόηση της γέφυρας προσθέτων και η ικανότητα προσαρμογής προσθέτων σε σύγχρονες εκδόσεις Android και iOS. Χωρίς αυτό, η ενημέρωση της εφαρμογής για τις νέες απαιτήσεις των καταστημάτων καθίσταται αδύνατη λόγω παρωχημένων αδειών συστήματος.