Perguntas e respostas sobre React Native

Então você ouviu falar, por cima, sobre aquele negócio de React Native, né? Pra desenvolver aplicativo para Android e iOS ao mesmo tempo e tal… Legal. Vou te explicar algumas coisinhas e clarificar algumas confusões que muita gente tem por desconhecimento.

React Native é realmente nativo?

Sim! React Native é nativo mesmo. Funciona assim: dentro do seu dispositivo existem dois núcleos: um núcleo nativo (Java para Android e Objective-C para iOS) e um núcleo de Javascript, chamado JavaScriptCore — ou JSC, para os íntimos.

Resumidamente, o RN compila um "aplicativo base", que é apenas um app simples com a função de executar seu código JavaScript no JavaScriptCore. Assim, o JavaScript "orquestra" os componentes nativos — a partir do núcleo JS — por meio de uma ponte ("bridge"). A comunicação é de via dupla.

"O React Native compila seu código para Android e iOS"

Falso. Como dito acima, o RN não compila seu código. O que acontece é que ele pega seu JavaScript original, transpila, minifica e otimiza (esses dois últimos passos, normalmente, apenas na versão release do app), justamente como acontece na web com o Webpack, porém, o React Native usa um bundler próprio chamado Metro.

Existem duas abordagens após a parte de transpilação do JavaScript. Quando você roda seu aplicativo em modo debug, é criada uma conexão via websocket entre o bundler e o seu aplicativo. Assim, o código transpilado é transferido e executado para agilizar o desenvolvimento.

Quando o requisitado é uma versão release do app, o React Native pega seu código JavaScript e inclui ele no seu .apk/.ipa, minificado e otimizado, tornando o app distribuível. Em nenhuma parte (sério, em nenhuma parte mesmo) o React Native, de alguma forma, compila o JavaScript para Java ou Objective-C ou sei lá o que: é puramente JavaScript.

"Com React Native, você escreve seu código uma vez e pá: Android e iOS vão funcionar de maneira consistente num passe de mágica!"

Não é bem assim. Existem diferenças nas duas plataformas. O que funciona de um jeito em um lugar pode não funcionar no outro. Em 90% dos casos, realmente, você pode escrever apenas uma vez que o resultado será idêntico em Android e iOS.

Porém, existem divergências. Um exemplo é a parte de estilos: você define sombras de uma maneira para Android (usando a propriedade "elevation") e em outra maneira para iOS. Para deixar as coisas ainda mais fáceis, no próprio módulo do React Native tem uma API chamada Platform, justamente para lidar com esses casos!

"React Native funciona que nem Xamarin, PhoneGap, Cordova e outros"

Não. Na verdade… Mais ou menos!

Vamos começar pelo Xamarin: React Native não tem nada a ver com ele. Até onde estou sabendo (não sou dev, apenas li por cima), o Xamarin realmente converte seu código C# para a plataforma nativa de preferência, o que não é o caso do React Native, como vimos acima!

PhoneGap/Cordova/outros: o React Native/PhoneGap/Cordova cria um aplicativo base para execução de algo diferente. A diferença é que o PhoneGap/Cordova disponibilizam uma webview para execução de HTML/CSS puro com APIs nativas disponibilizadas via JavaScript. O look and feel de um aplicativo PhoneGap/Cordova é o mesmo nas duas plataformas, porém a usabilidade na maioria das vezes é pobre e, por se tratar de apenas uma página web renderizada dentro de um aplicativo, o desempenho é bem inferior ao de um aplicativo React Native.

Como sabemos (agora você sabe!), React Native não é uma webview! Ele orquestra os componentes nativos por uma ponte entre o núcleo nativo e o núcleo JavaScript. As APIs nativas estão inclusas nisso!

"O desempenho de um aplicativo em React Native está muito abaixo de um aplicativo realmente nativo"

Não é verdade. Vamos começar pelo fato que um app React Native é mesmo um aplicativo nativo. Além disso, os únicos gargalos de performance se dão no momento em que os núcleos se comunicam, mas isso não acontece frequentemente em tempo de execução a ponto de ser perceptível ao usuário final.

Estendendo a resposta: a maior parte do trabalho de um app em React Native é feito no núcleo JavaScript, então não passamos a maior parte do tempo nos comunicando com o núcleo nativo — apenas quando necessário.

Há uns tempos, haviam sérios problemas de performance. Um exemplo era a parte de animações, que eram um pesadelo se executadas no núcleo JS. Mais tarde, o time do React Native no Facebook alterou o modo em como a API Animation funciona, delegando as tarefas de animação ao núcleo nativo e resolvendo o problema.

Mesmo assim, o próprio Facebook code tem alguns artigos sobre React Native e dicas de performance. Leia aqui. Para ver uma comparação mais à fundo entre RN e aplicativos nativos (Swift), esse artigo aqui explica bem.

"React Native é perfeito"

Não! Partindo do princípio que nada nesse mundo é perfeito (com exceção de mim), claro que React Native tem seus downsides.

Apesar de a diferença de desempenho não ser tão grande de aplicativos "realmente nativos" para aplicativos construídos com React Native, é claro que os nativos mesmo vão ser mais performáticos (como dá pra ver ali no artigo que eu recomendei acima).

Outro ponto que, na minha opinião, deixou a desejar bastante foi a documentação, que é um pouquinho pobre — ou ao menos poderia ser melhor — , principalmente na parte de módulos nativos (a parte em que você pode se comunicar com o núcleo nativo da aplicação).

React Native não é perfeito, mas com toda certeza do mundo ele tem mais vantagens que desvantagens, e deve ser considerado em todo time de desenvolvimento que precisa de agilidade, facilidade para trabalhar (pois é JavaScript), e de algo consistente.

Esqueci de alguma coisa? Tens algum ponto a acrescentar? Escreve aí! Vamos trocar uma ideia ;)

Se você gostou do React Native e quer ter uma ideia de como funciona, por cima, vale a pena ler esse artigo aqui. Forte abraço!