Przejdź do treści głównej

Wizja React Native dla wielu platform

· 8 minut czytania
Christine Abernathy
Christine Abernathy
Developer Advocate @ Meta
Eli White
Eli White
Software Engineer @ Meta
Luna Wei
Luna Wei
Software Engineer @ Meta
Timothy Yung
Timothy Yung
Software Engineer @ Meta
Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

React Native znacząco podniósł poprzeczkę w rozwoju aplikacji mobilnych, zarówno w Facebooku, jak i całej branży. W miarę jak wchodzimy w nowe interakcje z komputerami i powstają nowe urządzenia, chcemy, aby React Native był dostępny dla wszystkich. Choć początkowo stworzono go do budowy aplikacji mobilnych, wierzymy, że skupienie się na wielu platformach oraz wykorzystanie ich mocnych stron i ograniczeń ma efekt synergiczny. Odkąd rozszerzyliśmy tę technologię na komputery i rzeczywistość wirtualną, odnotowaliśmy ogromne korzyści i z radością dzielimy się implikacjami dla przyszłości React Native.

Poszanowanie platformy

Naszą nadrzędną zasadą jest dopasowanie do oczekiwań użytkowników każdej platformy. Użytkownicy Androida oczekują dostępnych aplikacji z TalkBack. Nawigacja powinna działać jak w innych aplikacjach na Androida. Przycisk musi wyglądać i działać jak przyciski na Androidzie – nie jak na iOS. Choć dążymy do spójnego doświadczenia dla deweloperów na różnych platformach, nie ulegamy pokusie poświęcania oczekiwań użytkowników.

Wierzymy, że React Native pozwala deweloperom spełniać oczekiwania użytkowników, zapewniając jednocześnie lepsze doświadczenie programistyczne. W tej sekcji dzielimy się:

  1. Akceptując ograniczenia platformy, faktycznie poprawiamy doświadczenie na innych platformach.

  2. Możemy czerpać z wiedzy instytucjonalnej, budując wyższej klasy abstrakcje wieloplatformowe.

  3. Inni gracze na każdej platformie inspirują nas do tworzenia lepszych doświadczeń dla deweloperów i użytkowników.

Akceptowanie ograniczeń platformy

Konkretny sprzęt lub oczekiwania użytkowników nakładają unikalne ograniczenia. Na przykład pamięć jest zwykle bardziej ograniczona na Androidzie i goglach VR niż na iOS, macOS i Windows. Użytkownicy oczekują natychmiastowego uruchamiania aplikacji mobilnych, ale akceptują dłuższy czas startu aplikacji desktopowych. Odkryliśmy, że podejście React Native do tych problemów pozwala łatwiej przenosić rozwiązania i kod między platformami.

Screenshot of Facebook Dating on mobile

React Native and Relay power over 1000 Facebook surfaces on Android and iOS.

Przykładowo, React Native korzysta z optymalizacji "spłaszczania widoków" (view flattening), kluczowej dla redukcji zużycia pamięci na Androidzie. Nigdy nie implementowaliśmy jej dla iOS, który nie ma takich ograniczeń pamięciowych. Budując nowy renderer wieloplatformowy, musieliśmy ponownie zaimplementować to rozwiązanie – tym razem w C++ zamiast w platformowym Javie. Przetestowanie tej samej optymalizacji na iOS stało się trywialne. W produkcyjnej aplikacji Facebooka zaobserwowaliśmy poprawę wydajności na iOS! Prawdopodobnie nigdy nie zbudowalibyśmy tego dla iOS, ale nasza inwestycja w Androida przyniosła korzyści na iOS.

Czerpanie z wiedzy instytucjonalnej

Jednym z powodów stworzenia React Native była redukcja inżynieryjnych silosów. Inżynierowie Androida często pracują w izolacji od iOS-owców nad tym samym produktem. Androidowcy recenzują kod innych androidowców i uczestniczą w branżowych spotkaniach. Inżynierowie iOS recenzują kod iOS-owców i chodzą na konferencje iOS. Specjaliści od różnych platform wniosą unikalną wiedzę o budowaniu świetnych doświadczeń produktowych.

Jednym z najlepszych efektów frameworków wieloplatformowych jak React Native jest łączenie inżynierów o odmiennej ekspertyzie. Wierzymy, że obsługując więcej platform, przyspieszymy przepływ wiedzy między ekspertami platformowymi.

Przykładowo, abstrakcje dostępności w React Native czerpią z różnych podejść Androida, iOS i webu. Dzięki temu stworzyliśmy wspólny interfejs usprawniający obsługę podpowiedzi dostępności na obu platformach mobilnych.

Inny przykład: nasze badania nad percepcją szybkości w środowisku webowym zaowocowały funkcjami współbieżnymi jak Suspense. W ostatnim roku testowano je na nowym Facebook.com. Teraz, dzięki naszemu nowemu rendererowi, trafiają one do React Native i wpływają na projektowanie harmonogramów zdarzeń i priorytetów. Inwestycja zespołu React w poprawę doświadczeń webowych przynosi korzyści React Native na platformach natywnych.

Konkurencja napędza innowacje

Oprócz inżynierów specjalizujących się w danej dziedzinie oraz spotkań i konferencji, każda platforma przyciąga też innych unikalnych graczy rozwiązujących podobne problemy. W sieci React (który bezpośrednio napędza React Native) często czerpie inspirację z innych otwartych frameworków internetowych, takich jak Vue, Preact i Svelte. W przypadku platform mobilnych React Native inspirował się innymi otwartymi frameworkami mobilnymi, a my sami uczymy się od innych frameworków mobilnych tworzonych wewnątrz Facebooka.

Wierzymy, że konkurencja w dłuższej perspektywie prowadzi do lepszych rezultatów dla wszystkich. Badając to, co sprawia, że inni gracze na każdej platformie są świetni, możemy wyciągać wnioski, które mogą mieć zastosowanie na innych platformach. Na przykład wyścig w upraszczaniu skomplikowanych witryn internetowych wpłynął na rozwój Reacta i dał React Native przewagę w oferowaniu deklaratywnego frameworka dla aplikacji mobilnych. Zapotrzebowanie na szybsze cykle iteracji i czas budowania w sieci doprowadziło też do rozwoju funkcji Fast Refresh, która znacząco przysłużyła się React Native. Podobnie optymalizacje wydajności w naszych wewnętrznych frameworkach mobilnych — szczególnie w zakresie pobierania danych i równoległego przetwarzania — zmusiły nas do ulepszenia React Native w sposób, który wpłynął także na Reacta podczas budowy nowej strony Facebook.com.

Screenshot of the Facebook.com website

React and Relay powers the Facebook.com website.

Rozszerzanie na nowe platformy

React i React Native znajdują się w punkcie zwrotnym. React rozpoczął drogę do wydania wersji 18, a nowy silnik renderujący React Native obecnie w pełni napędza aplikacje mobilne Facebooka. Nasz zespół znacznie się powiększył w tym roku, aby wspierać rosnące przyjęcie w Facebooku. Zespoły rozwijające inne platformy zauważyły to przyjęcie i dostrzegły szansę, by również czerpać korzyści z React Native.

Przez ostatni rok współpracowaliśmy z Microsoftem i zespołem Messenger, aby stworzyć prawdziwie natywne doświadczenie wideorozmów w systemach Windows i macOS. Ze względu na dużą wagę, jaką przywiązujemy do czasu uruchamiania aplikacji mobilnych, nasza początkowa implementacja wideorozmów na komputerach z wykorzystaniem React Native całkowicie przyćmiła wydajność implementacji Electron, którą zastąpiła. W ciągu pierwszych kilku tygodni budowania tego doświadczenia nagrywaliśmy filmy, na których zmieniamy rozmiar okna z wieloma aktywnymi wideorozmowami, i zachwycaliśmy się płynną liczbą klatek na sekundę.

Tworzenie aplikacji na komputery było dla nas bardzo ekscytujące. Wzięliśmy to, co wiemy o budowaniu doświadczeń mobilnych, i zastosowaliśmy to na komputerach z otwartymi oczami. Poszerzyliśmy nasze horyzonty o wiele okien podrzędnych, pasków menu, obszarów powiadomień i więcej. W miarę jak kontynuujemy współpracę nad nowymi funkcjami Messenger na komputery, spodziewamy się znaleźć możliwości, które wpłyną na to, jak budujemy w sieci i na urządzeniach mobilnych. Jeśli chcesz być na bieżąco, nasza praca nad współpracą w zakresie komputerów odbywa się na GitHubie.

Screenshot of the Messenger app on macOS

React Native powers Video Calling in Messenger for Windows and macOS.

Współpracujemy również ściślej z Facebook Reality Labs, aby zrozumieć, w jaki sposób React jest wyjątkowo przygotowany do dostarczania doświadczeń rzeczywistości wirtualnej na Oculusa. Tworzenie doświadczeń w VR z React Native będzie szczególnie interesujące ze względu na większe ograniczenia pamięci i wrażliwość użytkowników na opóźnienia interakcji.

Podobnie jak w przypadku React Native na urządzenia mobilne, będziemy sprawdzać naszą technologię w skali Facebooka, zanim udostępnimy coś publicznie. Wiele się jeszcze zmienia i wciąż mamy wiele pytań. Chcemy mieć pewność, że technologia jest gotowa do produkcji i niezawodna, zanim podzielimy się nią ze społecznością.

Chociaż większość rozwoju VR nadal będzie odbywać się wewnętrznie, mamy nadzieję podzielić się więcej tak szybko, jak to możliwe. Spodziewamy się również, że ulepszenia React Native dla VR pojawią się w open source. Na przykład spodziewamy się, że projekty mające na celu zmniejszenie użycia pamięci w przypadkach użycia VR zmniejszą też użycie pamięci przez React Native w doświadczeniach mobilnych i na komputerach.

Screenshot of Oculus Home in virtual reality

React and Relay power the Oculus Home and many other virtual reality experiences.

Gdy zastanawiamy się, jak branża przyjęła Reacta, zawsze istniało w społeczności zapotrzebowanie na Reacta na większej liczbie platform. Nawet zanim ogłosiliśmy React Native społeczności, Netflix już tworzył Gibbona — swój własny silnik renderujący do budowania doświadczeń telewizyjnych z Reactem. A zanim Facebook zaczął budować Messenger na komputery, Microsoft już używał Reacta do budowania natywnych doświadczeń na komputerach w Office i Windows 10.

Podsumowanie

Podsumowując, naszą wizją jest rozszerzenie zasięgu React Native poza urządzenia mobilne, a zaczęliśmy już od współpracy z zespołami odpowiedzialnymi za komputery stacjonarne i VR w Facebooku. Wiemy, że gdy akceptujemy ograniczenia każdej platformy, uczymy się z instytucjonalnej wiedzy i czerpiemy inspirację od innych graczy, przynosi to korzyści każdej platformie w ekosystemie. Co najważniejsze, w ten sposób pozostajemy wierni naszym zasadom przewodnim.

Jesteśmy podekscytowani tym, co nadchodzi, gdy kontynuujemy odkrywanie, jakie możliwości otwiera przed React Native wsparcie wielu platform. Śledź nas (@reactnative), aby otrzymywać więcej aktualizacji i podziel się swoimi przemyśleniami!