Mobile Dev English: Expo and React Native Vocabulary (англійською)
Вивчайте англійські терміни, які потрібні кожному розробнику Expo і React Native — керований робочий процес, оновлення OTA, JSI, EAS Build, рідні модулі і багато іншого.
Introduction
Мобільний розвиток з Expo і React Native має словник, який поєднує терміни веб-розробки, рідну мову платформи і специфічні концепції Expo. Для розробників, чия перша мова не є англійською, такі фрази, як « eject from managed workflow » або « bridge overhead » можуть бути особливо важкими для аналізу, оскільки кожне слово здається знайомим, але комбінація має дуже специфічне технічне значення. Ця стаття розпаковує ключові слова англійської мови, щоб ви могли читати документацію, відкрити проблеми і обговорювати мобільну архітектуру з точністю.
Управління робочим потоком проти простого робочого потоку
Expo пропонує два підходи до розробки: ** керований робочий процес ** і ** голий робочий процес **.
У ** керованому потоці роботи ** Expo обробляє для вас налаштування наявної збірки. Ви пишете JavaScript і TypeScript, а Expo керує файлами проектів iOS і Android. Слово « керований » у цьому випадку означає, що цей файл контролюється або обробляється кимось іншим від вашого імені:
«Ми розпочали проект в керованому робочому потоці, тому що ми не хотіли підтримувати окремі конфігурації Xcode і Android Studio»
Голий поток роботи надає вам повний доступ до файлів проекту для iOS і Android. «Голий» означає, що проект буде знято з верхнього рівня, без додаткових шарів, що є протилежним до керованого:
«Після додавання нетипового модуля Bluetooth, ми мусили перейти до голого потоку роботи, тому що це вимагає змін до рідних файлів проекту»
Фраза ** « вилучити з потоку роботи, яким керується » ** описує дію у одному напрямку, тобто вихід з потоку роботи, яким керується, для отримання доступу до власного файла. « Вилучити » буквально означає « висунути » або « викинути » щось:
«Якщо ви витягнете з керованого потоку роботи, ви берете на себе відповідальність за підтримку національної конфігурації збирання самостійно.»
Надзвукові оновлення
** Оновлення за допомогою бездротового зв’ язку (OTA) ** — це оновлення пакета JavaScript вашої програми, яке буде доставлено на пристрої користувачів без перегляду у App Store або Google Play. « Надійно » — це старий вислів, що означає бездротовий перенос, без фізичного з’ єднання.
«Ми відправили OTA-оновлення, щоб виправити аварію, не чекаючи схвалення App Store — користувачі отримали виправлення протягом декількох хвилин» «По-над-повітря оновлення працюють тільки для змін JavaScript. Зміни в національному коді все ще вимагають повного випуску магазину додатків»
Модулі і мостові перевантаження
** Native module ** це частина коду, написана на рідній мові платформи (Swift, Objective-C для iOS; Kotlin, Java для Android), яка виставляє функціональність на JavaScript. Коли React Native потрібно зробити щось, що JavaScript не може зробити самостійно — наприклад, отримати доступ до камери або Bluetooth — він викликає нативний модуль.
Оригінальна архітектура React Native комунікувала між JavaScript і рідним кодом через мостик — рівень серіалізації, який перетворював значення JavaScript в рідні об’єкти і назад. Це перетворення мало витрати на продуктивність, які називаються ** витратами на міст **:
«Злишкові виклики через міст спричинили помітне затримання в нашій анімації, тому ми перейшли на нову архітектуру» «Міст над головою був відомим вузлом продуктивності в старих React Native додатках, особливо для високочастотних оновлень, таких як позиція прокрутки»
** « Надлишок » ** у технічній англійській означає додаткові витрати — зазвичай, у часі, пам’ яті або обробці — за межами того, що вимагає основне завдання.
JSI: JavaScript інтерфейс
** JSI ** (JavaScript Interface) — це сучасна заміна мосту. Цей параметр надає змогу JavaScript мати прямі посилання на власні об’ єкти і викликати власні функції синхронно, без серіалізації:
«З JSI, рідний модуль працює в тому ж потоці і повертає значення безпосередньо, що виключає мостову нагрузку, яку ми бачили раніше» «Міграція нашої бібліотеки камер до JSI зменшила затримку з 30 мс до менш ніж 2 мс»
Національний модуль зв’язку
** Поєднання рідних модулів ** це процес з’ єднання пакунка JavaScript з його рідною реалізацією (iOS або Android). До того, як було введено автоматичне посилання, розробники повинні були посилатися на модулі вручну, редагуючи рідні файли проекту.
«Документація бібліотеки каже, щоб запустити
npx react-native linkдля старих версій, але з авто-зв’язуванням ви просто встановите пакунок і перебудуєте» Завжди перевіряйте, чи підтримує бібліотека автоматичне посилання перед додаванням — вручну посилання додає витрати на обслуговування
Розробка і випуск ОС
EAS (Expo Application Services) Build - це хмарна служба збирання Expo. Замість збирання бінарного файла iOS або Android на вашій локальній машині, ви надсилаєте початковий код на сервери Expo і отримуєте скомпільований пакунок програми.
Ми використовуємо EAS Build в CI, щоб розробники без Mac все ще могли виробляти iOS builds
** Expo Router ** — це система маршрутизації Expo для React Native, заснована на файлах, натхненна Next. js:
«Після прийняття Expo Router, наша структура навігації стала набагато легше зрозуміти, тому що кожен файл відповідає безпосередньо екрану»
Ключовий словник
| Term | Definition |
|---|---|
| managed workflow | An Expo setup where Expo controls the native project configuration |
| bare workflow | An Expo setup where developers manage native iOS and Android files directly |
| eject | To leave the managed workflow and take control of native project files |
| over-the-air (OTA) update | A JavaScript bundle update delivered wirelessly, bypassing app store review |
| native module | A Swift/Kotlin/Java component that exposes platform features to JavaScript |
| bridge overhead | Performance cost caused by serialising data between JavaScript and native code |
| JSI | A modern React Native architecture that allows direct, synchronous JS-to-native calls |
| native module linking | Connecting a JavaScript package to its native platform implementation |
Практичні поради
- Наступного разу, коли ви читатимете README бібліотеки React Native, визначте, чи використовується в ній місток або JSI, і напишіть одне речення, в якому поясните різницю вигаданому колегі.
- Вправтеся у використанні слова « overhead » у різних реченнях. Вона з’являється в обговореннях продуктивності у всіх областях програмного забезпечення: «мережевий надлишок», «надлишок пам’яті», «абстракційний надлишок».
- Коли ви пояснюєте комусь різницю між керованими і некерованими потоками робіт, спробуйте скористатися контрастною фразою ** « оскільки » **: « У керованому потоці робіт Expo обробляє налаштування, у некерованому потоці робіт ви керуєте власними файлами безпосередньо. »
- Пошук повідомлення про помилку EAS Build і написання опису проблеми GitHub англійською мовою, включаючи кроки для відтворення, очікувану поведінку і фактичну поведінку. Ця структура письма безпосередньо корисна для внеску відкритого коду.
Conclusion
Expo і React Native швидко розвивалися, і словник розвивався з ними - від старої моделі мосту до JSI, від ручного посилання до автоматичного посилання, від локальних збірок до EAS. Знаючи ці терміни англійською, ви зможете набагато краще стежити за повідомленнями про випуск, оцінювати вибір бібліотек і чітко повідомляти про рішення вашій команді. Найкращий спосіб закріплення словника — це його активне використання у коментарях до коду, описах запитів на звантаження і обговореннях команди.
Навигація по лінії — практичний підхід
Погляньмо правді в очі; навіть з глибоким розумінням Expo і React Native термінології, ефективне спілкування в команді розробників може бути складним. Це не просто про знання слів; це про їх правильну експлуатацію для сприяння співпраці і ефективного вирішення проблем. Часто нерозуміння виникають через неточну мову або припущення, що всі мають однаковий рівень технічних деталей. Давайте поглянемо, як специфічний для Expo словник грає в реальних сценаріях - особливо при наданні і отриманні зворотнього зв’язку по коду.
Розглянемо цю розмову на Slack: «Гей, команда, чи можете ви подивитися на PR #123? Я бачу деякі періодичні проблеми зі завантаженням зображення тла. Здається, що на моєму пристрої все в порядку, але на інших пристроях відбувається аварія. Чи можемо ми дослідити потенційні відмінності у середовищі збирання?» Негайно виникає декілька питань. Що саме означає « з перервами »? « Добре на моєму пристрої » є суб’ єктивним і не має великої діагностичної цінності. Ключ тут не просто вказувати проблему - це обрамлення її з конкретним словником. Ефективнішою формулюванням може бути: «Я спостерігаю невдачу завантаження зображення фону під час OTA-оновлень, особливо впливаючи на пристрої з React Native версії 0.69.x. Початкова діагностика свідчить про потенційне невідповідність у стратегіях розв’язання активів. “В цій статті використовуються такі терміни, як “OTA-оновлення”, “React Native-версія” і “розв’язання активів”, щоб повідомити точно, що відбувається і де зосередити дослідження.
Інша поширена ситуація під час перегляду коду. Рецензент може прокоментувати: «Це здається неефективним. Чи можете ви оптимізувати цю функцію?» Це нечітко! Кращий підхід, інформований знаннями, специфічними для Expo, буде таким: “Виклик fetch в цій функції не використовує механізм кешування Expo для мережевих запитів. Впровадження стандартного react-native-fetch обгортки може значно зменшити затримку API і поліпшити продуктивність - особливо враховуючи потенціал для OTA оновлення для введення мережевої змінності. “Це підкреслює конкретну проблему (відсутність кешування) і під’єднує її безпосередньо до відповідних функцій Expo.
Нарешті, під час описів запитів на витягування, використання точних термінів допомагає встановити очікування: «Ця публікація вводить рідний модуль для покращеної обробки зображень, використовуючи JSI-фреймворк для поліпшення продуктивності в складних сценаріях маніпулювання зображеннями. Цей підхід розроблений для забезпечення оптимальних результатів на різних пристроях і повинен мінімізувати вплив на розміри оновлення OTA. “Використання JSI тут вказує на розуміння того, як можна використовувати інтерфейс JavaScript Expo (JSI).
expo build:ios --scriptЦя команда демонструє спільний робочий процес - використовуючи expo build:ios для ініціалізації процесу збирання iOS, який використовує керований робочий процес Expo і потенційно інтегрується з EAS Build для оптимізованого розгортання. Зрозуміння термінології навколо цих процесів є ключовим для ефективного спілкування і усунення неполадок в команді розробників Expo / React Native.