Home-theater-designers
Το React Native 0.70 έχει κυκλοφορήσει και το Hermes είναι η νέα προεπιλεγμένη μηχανή JavaScript που διατίθεται με αυτήν την ενημέρωση. Δείτε τι να περιμένετε από το Hermes και μερικά από τα χαρακτηριστικά που θα επηρεάσουν την απόδοση της εφαρμογής σας React Native.
Τι είναι ο Ερμής;
Το Hermes είναι μια μηχανή JavaScript ανοιχτού κώδικα που βελτιστοποιεί την απόδοση κατά την εκκίνηση εφαρμογών iOS και Android, προ-μεταγλωττίζοντας τον κώδικα JavaScript σε αποτελεσματικό bytecode και μειώνοντας τη χρήση της μνήμης της εφαρμογής.
ΚΑΤΑΣΚΕΥΗ ΒΙΝΤΕΟ ΤΗΣ ΗΜΕΡΑΣ
Ενημέρωση παλαιότερων εγγενών εκδόσεων React για υποστήριξη του Hermes
Οι εφαρμογές React Native που εκτελούνται σε 0.70 θα έχουν ενεργοποιημένο το Hermes από προεπιλογή. Για παλαιότερες εφαρμογές React Native, μια έκδοση Hermes διατίθεται με κάθε έκδοση React Native που ξεκινά από την έκδοση 0.60.4 για εκδόσεις Android και την έκδοση 0.64.0 για iOS. Οι αντίστοιχες εκδόσεις εξαλείφουν τον κίνδυνο αναντιστοιχίας εξάρτησης στην εφαρμογή React Native.
Για να ενεργοποιήσετε το Hermes σε αυτές τις παλαιότερες εκδόσεις του React Native, θα χρειαστεί να προσθέσετε κάποια διαμόρφωση στις εφαρμογές σας Android και iOS.
Σε Android, επεξεργαστείτε το δικό σας android/app/build.gradle αρχείο:
project.ext.react = [
entryFile: "index.js",
enableHermes: true // clean and rebuild if changing
]
Στο iOS, κάνετε τις ακόλουθες αλλαγές στο δικό σας ios/Podfile :
μετακίνηση τραγουδιών από το ipod στον υπολογιστή
use_react_native!(
:path => config[:reactNativePath],
:hermes_enabled => true
)
Το iOS απαιτεί να εγκαταστήσετε τα pods Hermes μετά τη διαμόρφωση των ρυθμίσεων.
Εκτελέστε την ακόλουθη εντολή για να εγκαταστήσετε τα pods:
καλύτερες δωρεάν εφαρμογές vr για android
cd ios && pod install
Ενεργοποίηση Hermes With Expo
Μπορείτε επίσης να χρησιμοποιήσετε τη μηχανή Hermes για εφαρμογές React Native που έχουν δημιουργηθεί ή εκτελούνται με χρήση του Expo. Η βιβλιοθήκη Expo υποστηρίζει Hermes από την έκδοση SDK 42 σε Android και την έκδοση SDK 43 σε iOS έως την τρέχουσα έκδοση 0.70. Είναι σημαντικό να σημειωθεί ότι οι αυτόνομες εφαρμογές δεν μπορούν να εκτελούν το Hermes εκτός και αν δημιουργηθούν με χρήση του Expo Application Services Build.
Για να ενεργοποιήσετε το Hermes σε μια εφαρμογή React Native, επεξεργαστείτε το δικό σας app.json αρχείο:
{
"expo": {
"jsEngine": "hermes"
}
}
Τώρα η εφαρμογή σας που έχει κατασκευαστεί με τις Υπηρεσίες Εφαρμογών Expo θα έχει ενεργοποιημένο το Hermes ως μηχανή JavaScript.
Hermes Performance Optimization για React Native Apps
Οι περισσότερες μηχανές JavaScript αναλύουν όλο τον πηγαίο κώδικα JavaScript χρησιμοποιώντας ένα σύστημα μεταγλώττισης JIT (Just in Time). Το σύστημα JIT επιβραδύνει την εκτέλεση επειδή η συσκευή σας πρέπει να περιμένει να ολοκληρωθεί ολόκληρη η διαδικασία μεταγλώττισης. Η Hermes χρησιμοποιεί μια προσέγγιση μεταγλώττισης εκ των προτέρων (AOT), μεταφέροντας το μεγαλύτερο μέρος της εργασίας του κινητήρα JavaScript βαρέως τύπου για τη δημιουργία χρόνου.
Ο Hermes επηρεάζει κυρίως τρεις μετρήσεις απόδοσης της εφαρμογής: την εφαρμογή TTI (Time to Interactive), το δυαδικό μέγεθος και τη χρήση μνήμης.
Ώρα για διαδραστική
Το TTI είναι ο χρόνος που χρειάζεται μια εφαρμογή για να φορτώσει και να υποστηρίξει την αλληλεπίδραση με τον χρήστη, όπως κύλιση ή πληκτρολόγηση. Η Hermes βελτιώνει το μέσο TTI για εφαρμογές React Native σε σύγκριση με άλλες μηχανές JavaScript.
Αυτή η μείωση στο TTI οφείλεται στο ότι ο Hermes δεν εκτελεί μεταγλωττιστή JIT.
Δυαδικό μέγεθος
Το δυαδικό μέγεθος είναι το μέγεθος της ομαδοποιημένης εφαρμογής React Native. Οι εφαρμογές Android χρησιμοποιούν το Μορφή αρχείου APK , ενώ οι εφαρμογές iOS χρησιμοποιούν μια μορφή που η Apple καλεί IPA. Η χρήση του Hermes μειώνει σημαντικά το μέγεθος της εφαρμογής σε συσκευές Android.
Χρήση μνήμης
Η χρήση μνήμης είναι μια άλλη κρίσιμη μέτρηση για βελτιστοποίηση σε εφαρμογές. Η εμπειρία χρήστη μιας εφαρμογής θα επηρεαστεί αρνητικά εάν χρησιμοποιεί υπερβολική μνήμη. Η Hermes εφαρμόζει ένα σύστημα συλλογής σκουπιδιών που ρυθμίζει τη χρήση της μνήμης κατά παραγγελία, διασφαλίζοντας ότι μια εφαρμογή χρησιμοποιεί μόνο τον απαραίτητο χώρο μνήμης κατά την εκτέλεση.
Εντοπισμός σφαλμάτων React Native με Hermes και Chrome DevTools
Το Hermes έρχεται με μια νέα εμπειρία για τον εντοπισμό σφαλμάτων σε εφαρμογές React Native που εκτελούνται σε εξομοιωτή, προσομοιωτή ή φυσική συσκευή χρησιμοποιώντας το Expo. Η Hermes υποστηρίζει τον εντοπισμό σφαλμάτων σε εφαρμογές React Native χρησιμοποιώντας το Πρωτόκολλο Inspector του Chrome DevTools. Δεν πρέπει να το συγχέετε με το παραδοσιακό Εντοπισμός σφαλμάτων JavaScript με χρήση της κονσόλας του προγράμματος περιήγησης .
Για να διαμορφώσετε το Chrome για εντοπισμό σφαλμάτων σε εφαρμογές Hermes, ακολουθήστε αυτά τα βήματα.
τι σημαίνει σύνδεση χωρίς ίντερνετ σημαίνει
- Πλοηγηθείτε στο chrome://inspect μέσα στο πρόγραμμα περιήγησής σας Chrome.
- Κάνε κλικ στο Διαμορφώστε κουμπί.
- Μέσα στο modal επί της οθόνης, εισαγάγετε τη διεύθυνση διακομιστή για το πακέτο metro που εκτελεί την εφαρμογή React Native και κάντε κλικ Ολοκληρώθηκε .
Τώρα μπορείτε να διορθώσετε την εφαρμογή React Native χρησιμοποιώντας τον σύνδεσμο επιθεώρησης στόχου Hermes.
Γιατί ο Hermes είναι βελτιστοποιημένος μόνο για React Native
Η βέλτιστη απόδοση του Hermes ως μηχανή React Native JavaScript οφείλεται εν μέρει στο περιβάλλον χρόνου εκτέλεσης. Στο React Native, ομαδοποιείτε όλο τον κώδικα JavaScript στο περιβάλλον της εφαρμογής. Αυτό το σύστημα καθιστά αποτελεσματική την αποστολή bytecode.
Ένας άλλος παράγοντας που πρέπει να ληφθεί υπόψη είναι ο όγκος της εργασίας που γίνεται κατά τη μεταγλώττιση JavaScript. Η Hermes διαχειρίζεται τη συχνή αλληλεπίδραση με τον χρήστη που αναμένεται από τις εφαρμογές για κινητά, αποφεύγοντας ταυτόχρονα την επιθετική βελτιστοποίηση bytecode. Μια μηχανή JavaScript μεταγλωττιστή JIT δεν θα εκτελούσε εργασίες με αυτόν τον τρόπο.