Hermes — bu nima, React Native uchun JS dvigateli va ishlash prinsipi

Hermes nima

Hermes — Meta tomonidan React Native uchun yaratilgan va cheklangan resursli mobil qurilmalarda ishlash uchun optimallashtirilgan ochiq manbali (MIT litsenziyasi) ixcham JavaScript dvigatelidir. Hermesning asosiy innovatsiyasi JIT kompilyatsiyasidan voz kechib AOT (Ahead-of-Time) foydasiga tanlovdir. React Native ilovasini qurish bosqichida Metro Bundler kompilyatsiya qilingan JavaScript ni Hermes CLI ga uzatadi, u esa uni HBC (Hermes ByteCode) bayt-kodiga aylantiradi. Bu bayt-kod qurilmada qo'shimcha kompilyatsiya siz to'g'ridan-to'g'ri dvigatel tomonidan bajariladi. Bunday yondashuv bashorat qilinadigan unumdorlikni ta'minlaydi: JIT “isinishi” yo'q, kompilyatsiyada pauzalar yo'q, qo'shimcha batareya sarfi yo'q. Hermes mobil qurilmalarning cheklovlarini hisobga olgan holda ishlab chiqilgan: kam RAM (1-4 GB), cheklangan energiya sarfi va tez sovuq start zaruriyati. Hermesning birinchi ommaviy relizi 2019 yilda bo'lgan va React Native 0.70 dan (2022) boshlab dvigatel Android da standartga aylangan.

Hermes vs JavaScriptCore: dvigatellarni solishtirish

JavaScriptCore (JSC) — Safari va React Native tomonidan 0.70 versiyasigacha ishlatiladigan standart WebKit dvigateli. JSC JIT kompilyatsiyasini qo'llab-quvvatlaydi, bu murakkab JavaScript operatsiyalarining yuqori unumdorligini ta'minlaydi. Biroq JIT isinishni talab qiladi: kodning dastlabki soniyalari sekin ishlaydi (interpreted rejimi), keyin JIT issiq qismlarni kompilyatsiya qiladi. iOS da JIT App Store siyosatlari tufayli amalda mavjud emas (dinamik kod generatsiyasi taqiqlangan), shuning uchun iOS da JSC faqat interpreted rejimida ishlaydi — unumdorlik pasayadi. JSC kattaroq binar fayl hajmiga (taxminan 10 MB) ega va JIT infratuzilmasi tufayli ko'proq RAM sarflaydi. Hermes JIT ga bog'liq emas, bu ishga tushgandan so'ng darhol bashorat qilinadigan unumdorlikni ta'minlaydi (sovuq start). JSC ECMAScript standartini to'liqroq qo'llab-quvvatlaydi (Proxy, BigInt, Reflect ni o'z ichiga olgan holda), lekin ko'proq resurs sarfi evaziga. Sovuq start va kichik hajm muhim bo'lgan React Native loyihalari uchun Hermes afzalroq. JS da og'ir hisoblashlari bo'lgan loyihalar (o'yinlar, WebGL) uchun JSC yuqoriroq cho'qqi unumdorligini berishi mumkin.

AOT kompilyatsiyasi: oldindan qurish qanday ishlaydi

AOT kompilyatsiyasi (Ahead-of-Time) Hermes da ikki bosqichda amalga oshiriladi. Birinchi bosqichda Metro Bundler JavaScript fayllarini yagona paketga yig'adi va uni Hermes CLI ga (hermesc vositasi) uzatadi. Ikkinchi bosqichda hermesc JavaScript AST ni tahlil qiladi, HIR (Hermes Intermediate Representation) oraliq tasvirini yaratadi va keyin HBC binar bayt-kodini emit qiladi. Natija faqat bayt-kodni o'z ichiga olgan, asl JavaScript siz .hcb kengaytmali fayldir. Hermes runtime HBC ni to'g'ridan-to'g'ri, tahlil va kompilyatsiya qilmasdan yuklaydi. Bu startni tubdan tezlashtiradi: minglab JS satrlarini tahlil qilish (async) o'rniga dvigatel oldindan kompilyatsiya qilingan binar formatni o'qiydi. AOT shuningdek hajmni kamaytiradi: bayt-kod JavaScript AST dan o'rtacha 30% ixchamroqdir. AOT ning kamchiligi — ish vaqtida eval, new Function yoki dinamik require ni bajarishning mumkin emasligi: barcha modullar qurish bosqichida ma'lum bo'lishi kerak.

# Hermes CLI ni mustaqil o'rnating
npm install hermes-engine

# JS ni HBC bayt-kodiga kompilyatsiya qiling
npx hermesc -emit-binary -out bundle.hbc bundle.js

# Bayt-kod statistikasi
npx hermesc -dump-bytecode bundle.hbc  # shows HBC instructions

# Asl JS va HBC hajmi
wc -c bundle.js      # 2,300,000 bytes
wc -c bundle.hbc     # 1,450,000 bytes (37% reduction)

Hermes unumdorlik ko'rsatkichlari

Hermes unumdorligi uchta asosiy ko'rsatkich bilan o'lchanadi: Time-To-Interactive (TTI), APK/IPA hajmi va RAM sarfi. Meta ma'lumotlariga ko'ra, Android da Hermes TTI ni JSC bilan solishtirganda 34% ga kamaytiradi: o'rta segment qurilmasida (Moto G7) 4.2 soniyadan 2.8 soniyagacha. APK hajmi ixcham bayt-kod va JIT kutubxonalarining yo'qligi tufayli 28% ga kamayadi. RAM sarfi bir xil yuk ostida o'rtacha 22% past — bu, ayniqsa, 2-3 GB RAM li qurilmalar uchun muhimdir. iOS da foyda yanada kattaroq: JSC JIT dan foydalana olmagani uchun Hermes TTI ni 45% gacha oshiradi. Ko'rsatkichlar Meta ning Facebook Lite ilovasi bilan o'tkazgan testlariga asoslangan. Haqiqiy loyihalarda foyda turlicha: oddiy ekranlar (ro'yxatlar, matn) uchun Hermes ko'proq o'sish beradi, og'ir animatsiyalar uchun — kamroq. Profillash vositasi: React Native Profiler + hermes profile --heap.

Hermes bilan xotirani profillash

Hermes Chrome DevTools orqali mavjud bo'lgan o'rnatilgan xotira profillerini o'z ichiga oladi. Metro orqali ilovaga ulaning, Memory yorlig'ini oching va snapshot turlarida Hermes (JavaScript) ni tanlang. Hermes uch turdagi snapshotni qo'llab-quvvatlaydi: Heap Snapshot (barcha obyektlar), Allocation Timeline (obyektlarning hayot davri) va Allocation Sampling (tanlab profil). Hades GC pauzalar sonini minimumga kamaytiradi — o'rtacha 10 soniya ish davomida 2-5ms davom etadigan bitta GC pauzasi, JSC da xuddi shu davrda 10-20ms pauzalarga qarshi.

Hades GC axlat yig'uvchi

Hades GC — minimal pauzalar bilan mobil stsenariylar uchun ishlab chiqilgan Hermes dagi axlat yig'uvchi. JSC dagi mark-sweep GC dan farqli o'laroq, Hades parallel (concurrent) yig'ishdan foydalanadi: yig'uvchi asosiy bajarish oqimi bilan parallel ishlaydi, uni faqat qisqa muddatlarga to'xtatadi. Hades GC yig'imni avlodlarga ajratadi: yosh avlod (nursery) tez-tez va tez yig'iladi (Scavenge), eski avlod kamroq va kichikroq pauzalar bilan yig'iladi. Yig'im hajmi sozlanishi: standart — ilovaning mavjud RAM ning 2/3 qismi, minimal chegara — 32 MB. Hades stop-the-world yondashuvidan foydalanmaydi: hatto eski avlodning to'liq yig'ilishi 5-8ms dan oshmaydi. Yig'uvchi odatiy mobil stsenariy uchun optimallashtirilgan: ko'p qisqa umrli obyektlar (vaqtinchalik satrlar, React fibre obyektlari), kam uzoq umrli. Intensiv obyekt yaratilishi bo'lgan ilovalar (ro'yxatlar, animatsiyalar) uchun Hades JSC bilan solishtirganda silliqroq FPS ni ta'minlaydi.

React Native loyihasida Hermesni qanday yoqish mumkin

Hermes ni yoqish React Native versiyasi va platformaga bog'liq. React Native 0.70 dan boshlab Hermes yangi loyihalarda Android uchun standart sifatida yoqilgan. iOS uchun Hermes ixtiyoriy. Android da yoqish uchun: android/app/build.gradle faylida project.ext.react.enableHermes blokida enableHermes: true ni o'rnating. iOS uchun: Podfile da use_react_native!(:path => config[:reactNativePath], :hermes_enabled => true) orqali hermes_enabled ni true ga o'rnating. Yoqqandan so'ng pod install ni bajaring. Mavjud loyihalar uchun kutubxonalarning mosligini tekshiring: Hermes Proxy, eval va ba'zi ES2021 xususiyatlarini qo'llab-quvvatlamaydi. Konfiguratsiyani tekshirish uchun npx react-native info dan foydalaning. Hermes va JSC o'rtasida o'tish uchun flag ni o'zgartiring va clean rebuild bajaring.

// android/app/build.gradle — Hermes ni yoqing
project.ext.react = [
    enableHermes: true,
    cliPath: "node_modules/react-native/cli.js"
]

// iOS/Podfile — iOS da Hermes ni yoqing
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

target 'MyApp' do
  config = use_native_modules!
  use_react_native!(
    :path => config[:reactNativePath],
    :hermes_enabled => true
  )
end

Hermes cheklovlari: nima qo'llab-quvvatlanmaydi

Hermes ning asosiy cheklovlari JIT dan voz kechish bilan bog'liq. Hermes quyidagilarni qo'llab-quvvatlamaydi: Proxy va Reflect API (MobX, Vue, ba'zi state-menejerlarida ishlatiladi), BigInt (katta sonlar), Symbol.toStringTag, WeakRef va FinalizationRegistry. eval va new Function funksiyalari ish vaqtida istisno yaratadi. Array.prototype.flat va flatMap metodlarining this argumenti bilan callbacklari cheklovlar bilan ishlaydi. Vaqt mintaqalari bilan ISO 8601 sana formatlari to'liq qayta ishlanmaydi. Bu cheklovlarning aksariyati odatiy React Native ilovalariga ta'sir qilmaydi: React va React Native cheklangan ES xususiyatlari to'plamidan foydalanadi. Agar kutubxona Proxy ni talab qilsa (masalan, Proxy bilan MobX 6+), configure({ useProxies: false) dan foydalaning yoki alternativa tanlang. Mavjud kodning mosligini tekshirish uchun paketingizda npx hermesc -check ni ishga tushiring — qo'llab-quvvatlanmaydigan xususiyatlar ro'yxatini ko'rsatadi.

• Proxy / Reflect — amalga oshirilmagan; Proxy bilan kutubxonalar fallback rejimini talab qiladi
• BigInt — mavjud emas; katta sonlar uchun bignumber.js kutubxonalaridan foydalaning
• eval / new Function — chaqiruv throw; barcha modullar statik bo'lishi kerak
• WeakRef / FinalizationRegistry — qo'llab-quvvatlanmaydi; alternativi yo'q
• Symbol.toStringTag — e'tiborga olinmaydi; instanceof to'g'ri ishlaydi