როგორ მუშაობს React Native-ის არქიტექტურა (bridge vs ახალი არქიტექტურა)?

Question

Accepted Answer

React Native-ში **JavaScript** და **native** კოდი უნდა ერთმანეთს ურთიერთობდეს. ორიგინალური არქიტექტურა იყენებდა ასინქრონულ **bridge**-ს; **ახალი არქიტექტურა** (JSI, TurboModules, Fabric) ხელმისაწვდომს ხდის უფრო სწრაფ, სინქრონულ კომუნიკაციას. ამის გაგება აკეთებს React Native-ის ქცევას და შესრულებას გასაგებს.

## ორიგინალური არქიტექტურა: bridge

```text
React Native runs:
  → a JS THREAD (your React/JS code) and the NATIVE side (UI, native modules)
  → they communicate over a BRIDGE: messages are SERIALIZED (to JSON), passed ASYNC,
    and deserialized on the other side
Limitations:
  ✗ ASYNCHRONOUS only (can't call native synchronously)
  ✗ SERIALIZATION overhead; the bridge can be a BOTTLENECK with heavy traffic
  ✗ e.g. fast scrolling/animations passing data over the bridge → jank
```

## ახალი არქიტექტურა (JSI, TurboModules, Fabric)

```text
The NEW ARCHITECTURE replaces the bridge:
  JSI (JavaScript Interface) → JS can call native code DIRECTLY and SYNCHRONOUSLY
    (no serialization bridge) → much faster JS↔native interop
  TURBOMODULES → native modules loaded lazily, via JSI (faster, on-demand)
  FABRIC → the new rendering system → better, more efficient UI rendering; sync layout
  CODEGEN → type-safe JS↔native interfaces
→ Result: better performance, less overhead, synchronous calls, smoother UI.
```

## რატომ აქვს მნიშვნელობა (პრაქტიკულად)

```text
→ Explains React Native's PERFORMANCE characteristics (why bridge traffic was costly)
→ The new architecture (default in recent RN) improves performance and interop
→ Informs optimization (minimize bridge crossings on the old architecture; native-thread
  animations) and understanding of how RN executes
```

## რატომ აქვს მნიშვნელობა

React Native-ის არქიტექტურის გაგება ფასეული senior-level ცოდნაა, რადგან ის **განმარტავს React Native-ის ქცევას და შესრულების მახასიათებლებს**, ღრმავდება აპების გონივრული დაფიქრებისა და ოპტიმიზაციის უნარს.

ფუნდამენტური სტრუქტურა — React Native-ი, რომელიც აკითხავს **JS thread**-ს (თქვენი კოდი) და **native side**-ს (UI, native მოდულები), რომელიც უნდა **ურთიერთობდეს** — არის React Native-ის სამუშაოს გაგების გასაღები.

**ორიგინალური bridge არქიტექტურის** გაგება (სადაც JS და native ურთიერთობენ ასინქრონული bridge-ის მეშვეობით, რომელიც სერიალიზებს შეტყობინებებს JSON-ში და გადასცემს მათ) განმარტავს React Native-ის ისტორიული შესრულების მახასიათებლებს და შეზღუდვებს: კომუნიკაცია იყო მხოლოდ ასინქრონული, ჰქონდა სერიალიზაციის overhead-ი, და bridge-ი შეიძლება გამხდარიყო **병목现象 დიდი ტრაფიკის დროს** (რომელიც იწვევდა jank-ს სწრაფი scrolling-ის ან მხეთ მონაცემების აწოდების დროს) — რაც იყო **bridge crossings-ის მინიმიზირებისა და animations-ის native thread-ზე გაშვების მნიშვნელოვანი ოპტიმიზაციები**, სოფილს კავშირს არქიტექტურასა და პრაქტიკულ შესრულების რჩევას შორის.

**ახალი არქიტექტურის** გაგება (**JSI** რომელიც ხელმისაწვდომს ხდის პირდაპირ, სინქრონულ JS↔native calls-ებს სერიალიზაციის bridge-ის გარეშე; **TurboModules** lazy native მოდულის დატვირთვისთვის; **Fabric** უკეთესი rendering-ის জამი; Codegen type-safe interfaces-ებისთვის) სულ უფრო მნიშვნელოვანი ხდება, რადგან ის ხდება default — ის უმჯობესდებს შესრულებას, ამცირებს overhead-ს, ხელმისაწვდომს ხდის სინქრონულ calls-ებს, და აწარმოებს უფრო გლუვი UI, მოსახლეობის React Native-ის მნიშვნელოვანი ევოლუციას.

ამ არქიტექტურის გაგება **განმარტავს React Native-ის შესრულებას** (რატომ ჰქონდა მნიშვნელობა bridge-ს), **ინფორმაციას აძლევს ოპტიმიზაციას** (პრაქტიკა, რომელიც გამომდინარეობს არქიტექტურიდან), და აკეთებს გასაგებს React Native-ის გამოსახელებას — React Native-ის ტრანსფორმაციით შავი დიდი ყუთიდან გასაგებ სისტემად.

ის გამო, რომ არქიტექტურის გაგება (bridge და ახალი JSI-based არქიტექტურა) განმარტავს React Native-ის შესრულების მახასიათებლებს, ინფორმაციას აძლევს ოპტიმიზაციას, და ასახავს ზეწოლის ვერტიკალიდან გასვლის ხელმისაწვდომობას, და რამდენადაც ეს სიღრმე აწეულებს ვიღაცას React Native-ის გამოყენებიდან მის გაგებამდე, React Native-ის არქიტექტურის გაგება ფასეული senior-level ცოდნაა — განმარტავს მის ქცევას და შესრულებას, ინფორმაციას აძლევს ოპტიმიზაციას, და ასახავს platform ევოლუციის ღრმა ცოდნა და ზეწოლა, რომელიც მოველოდება senior React Native როლებისთვის.