Skip to main content

8 posts tagged with "React Native"

View All Tags

Hermes 엔진이란

· One min read
hyochan
hyochan
organizer

Hermes is an open-source JavaScript engine developed by Facebook, specifically designed to improve the startup time of React Native apps. It was first introduced in React Native 0.60.4 in 2019.

React Native apps are typically written in JavaScript, and this code is interpreted by a JavaScript engine before being executed on a device. Previously, most React Native apps used JSC (JavaScriptCore) for code interpretation. However, with an aim to enhance performance, especially for mobile apps, Facebook introduced Hermes.

The key features and advantages of Hermes are:

  1. Fast Startup Time: As Hermes directly executes JavaScript compiled into bytecode, it enhances the app's startup time.
  2. Low Memory Footprint: Hermes is designed to minimize memory usage, thereby reducing the overall memory consumption of the app.
  3. Optimized for React Native: Hermes is optimized for use with React Native, offering potential performance improvements for typical React Native operations.

For more information, check out the blog What is Hermes Engine?.

React Native New Architecture

· 2 min read
hyochan
hyochan
organizer

React Native Architecture refers to the internal structure and operating principles of a React Native application. The initial architecture of React Native consisted of several main components, and over time, enhancements and updates were made to improve the performance and stability of the application. This explanation is based on information up to 2021.

  1. Bridge: This was a core component of React Native's initial architecture. The Bridge facilitated communication between the JavaScript thread and the Native thread. It was responsible for sending UI updates, events, etc., generated in JavaScript, to the Native code.

  2. JavaScript Core (JSC): This is the JavaScript engine used in iOS. In Android, the JSC is bundled for distribution.

  3. Native Modules: These are modules in React Native applications that provide access to the native features of a device. For instance, they allow access to the camera, GPS, and file system.

However, Facebook is continuously working to improve the performance and flexibility of React Native's architecture. New architectural updates, like "Fabric" and "TurboModules," have been introduced.

  • Fabric: This is a project to rewrite the UI layer of React Native. It aims to achieve faster UI updates and smoother animations. Fabric minimizes the communication between JavaScript and Native, thereby enhancing performance.

  • TurboModules: These are a rewritten version of Native Modules, aiming to improve the communication performance between the JavaScript thread and the Native thread.

The introduction of this new architecture aims to boost the performance of React Native applications and streamline their integration with Native components.

For a more detailed understanding, check out The New Architecture of React Native.