Mit várhatunk a Hermes Engine-től a React Native 0.70-ben

Mit várhatunk a Hermes Engine-től a React Native 0.70-ben
Az Önhöz hasonló olvasók támogatják a MUO-t. Amikor a webhelyünkön található linkek használatával vásárol, társult jutalékot kaphatunk.

Megjelent a React Native 0.70, és ezzel a frissítéssel együtt a Hermes az új alapértelmezett JavaScript-motor. Íme, mire számíthatunk a Hermestől és néhány olyan funkciótól, amelyek befolyásolják a React Native alkalmazás teljesítményét.





stop kód rendszer szolgáltatás kivétel windows 10

Mi az a Hermész?

A Hermes egy nyílt forráskódú JavaScript-motor, amely optimalizálja a teljesítményt az iOS és Android alkalmazások indításakor azáltal, hogy előre lefordítja a JavaScript-kódot hatékony bájtkóddá, és csökkenti az alkalmazások memóriahasználatát.



MAKEUSEOF A NAP VIDEÓJA

Régebbi React natív verziók frissítése a Hermes támogatása érdekében

A 0.70-en futó React Native alkalmazásoknál alapértelmezés szerint engedélyezve van a Hermes. A régebbi React Native alkalmazásokhoz a Hermes build minden React Native verziójával együtt érkezik, kezdve az Android buildek 0.60.4-es verziójától és a 0.64.0-s verziótól iOS-hez. Az egyező verziók kiküszöbölik a függőségi eltérések kockázatát a React Native alkalmazásban.





Ahhoz, hogy engedélyezze a Hermes használatát a React Native régebbi verzióiban, hozzá kell adnia néhány konfigurációt mind az Android, mind az iOS-alkalmazásokhoz.

Androidon szerkessze a android/app/build.gradle fájl:



project.ext.react = [ 
    entryFile: "index.js", 
    enableHermes: true  // clean and rebuild if changing 
]

iOS rendszeren a következő módosításokat kell végrehajtania a ios/Podfile :

use_react_native!( 
    :path => config[:reactNativePath], 
    :hermes_enabled => true 
)

Az iOS megköveteli, hogy a beállítások konfigurálása után telepítse a Hermes podokat.



Futtassa a következő parancsot a podok telepítéséhez:

cd ios && pod install

A Hermes engedélyezése az Expo segítségével

A Hermes motort az Expo segítségével épített vagy futtatott React Native alkalmazásokhoz is használhatja. Az Expo könyvtár támogatja a Hermest az SDK 42-es verziójától Androidon és az SDK 43-as verziójától iOS-en a jelenlegi 0.70-es verzióig. Fontos megjegyezni, hogy az önálló alkalmazások nem futtathatják a Hermes-t, hacsak nem az Expo Application Services Build használatával készültek.



A Hermes engedélyezéséhez egy React Native alkalmazásban módosítsa a app.json fájl:

{ 
  "expo": { 
    "jsEngine": "hermes" 
  } 
}

Mostantól az Expo Application Services szolgáltatással épített alkalmazásának JavaScript-motorjaként a Hermes engedélyezve lesz.

Hermes teljesítményoptimalizálás a React natív alkalmazásokhoz

A legtöbb JavaScript-motor az összes JavaScript-forráskódot JIT (Just in Time) fordítórendszer segítségével elemzi. A JIT rendszer lelassítja a végrehajtást, mert az eszköznek meg kell várnia a teljes fordítási folyamat befejeződését. A Hermes az idő előtti összeállítás (AOT) megközelítést alkalmazza, és a nagy teherbírású JavaScript-motor munka nagy részét átadja az építési időnek.

A Hermes főként az alkalmazások teljesítményének három mérőszámát érinti: az alkalmazás TTI-jét (Time to Interactive), a bináris méretet és a memóriahasználatot.

Ideje az interaktívnak

A TTI az az idő, amely alatt egy alkalmazás betöltődik, és támogatja a felhasználói interakciókat, például a görgetést vagy a gépelést. A Hermes más JavaScript-motorokhoz képest javítja a React Native alkalmazások átlagos TTI-jét.

Ez a TTI csökkenés azért van, mert a Hermes nem futtat JIT fordítót.

Bináris méret

A bináris méret a csomagban lévő React Native alkalmazás mérete. Az Android alkalmazások a APK fájlformátum , míg az iOS-alkalmazások az Apple által IPA-nak nevezett formátumot használnak. A Hermes használata jelentősen csökkenti az alkalmazások méretét Android-eszközökön.

Memóriahasználat

A memóriahasználat egy másik kritikus mérőszám, amelyet az alkalmazásokban optimalizálni kell. Egy alkalmazás felhasználói élményét negatívan befolyásolja, ha túl sok memóriát használ. A Hermes egy Garbage Collector rendszert valósít meg, amely igény szerint szabályozza a memóriahasználatot, biztosítva, hogy az alkalmazás csak a szükséges memóriaterületet használja futás közben.

Hibakeresés React Native a Hermes és a Chrome DevTools segítségével

A Hermes új élményt nyújt az Expo segítségével emulátoron, szimulátoron vagy fizikai eszközön futó React Native alkalmazások hibakereséséhez. A Hermes támogatja a React Native alkalmazások hibakeresését a Chrome DevTools Inspector Protocol használatával. Ezt nem szabad összetéveszteni a hagyományossal JavaScript hibakeresés a böngésző konzoljával .

A Chrome beállításához a Hermes alkalmazások hibakeresésére hajtsa végre az alábbi lépéseket.

  1. Navigáljon ide chrome://inspect a Chrome böngészőben.
  2. Kattintson a Beállítás gomb.
  3. A képernyőn megjelenő módban adja meg a React Native alkalmazást futtató metró kötegelő szerver címét, majd kattintson Kész .

Mostantól hibakeresést végezhet a React Native alkalmazásban a Hermes célellenőrzési hivatkozásával.

Miért van optimalizálva a Hermes csak a React Native számára?

A Hermes React Native JavaScript motorként nyújtott optimális teljesítménye részben a futási környezetének köszönhető. A React Native alkalmazásban az összes JavaScript-kódot kötegeli az alkalmazáskörnyezeten belül. Ez a rendszer hatékonysá teszi a bájtkód szállítását.

Egy másik figyelembe veendő tényező a JavaScript fordítása során végzett munka mennyisége. A Hermes kezeli a mobilalkalmazások által elvárt gyakori felhasználói interakciót, miközben elkerüli az agresszív bájtkód-optimalizálást. A JIT fordító JavaScript motorja nem hajtana végre feladatokat így.