10 preguntas y respuestas de entrevista de React Native en 2023

Esta es una de las preguntas más frecuentes en las entrevistas sobre React Native. Facebook creó el framework JavaScript React Native para dar cabida a la creciente demanda de desarrollo de aplicaciones móviles. Es gratuito y de código abierto, y está basado en JavaScript. Facebook también desarrolló ReactJS. Se trata de una biblioteca JavaScript de código abierto para crear aplicaciones móviles y web con interfaces de usuario adaptables.

Veamos algunas de las diferencias significativas entre ellos:

• Tanto React Native como ReactJS emplean JSX, pero solo ReactJS utiliza etiquetas HTML, mientras que React Native no.*
• ReactJS emplea un react-router, pero React Native tiene su propio módulo de navegación integrado.
• ReactJS aprovecha las animaciones CSS. React Native utiliza su API de animación.
• ReactJS utiliza un DOM virtual que sólo se actualiza parcialmente. Al renderizar componentes de interfaz de usuario, React Native debe utilizar su API nativa.
• ReactJS se utiliza principalmente para el desarrollo de aplicaciones web, mientras que React Native se utiliza principalmente para el desarrollo de aplicaciones móviles.

Un componente es un bloque de construcción fundamental en React. En otras palabras, cada aplicación que crees en React estará formada por piezas conocidas como componentes. Los componentes hacen que sea mucho más fácil crear interfaces de usuario. Puedes ver una UI descompuesta en múltiples componentes individuales y trabajar en ellos de forma independiente antes de combinarlos todos en un componente padre, que será tu UI final.

Hay de 2 tipos:

• Componentes Funcionales: Las funciones javascript se utilizan para crear componentes funcionales. Escribiendo una función javascript, podemos crear un componente funcional en React.
• Componentes de Clase: Los componentes de clase son un poco más complicados que los componentes funcionales. Los componentes funcionales en su programa no son conscientes de los otros componentes en su programa, mientras que los componentes de clase pueden colaborar. Se pueden pasar datos de un componente de clase a otro.

Esta es una pregunta muy popular en las entrevistas de React Native. ¿Qué es Rexux? Redux es una herramienta de gestión de estado de aplicaciones JavaScript. Te permite desarrollar aplicaciones consistentes, adaptables a múltiples situaciones y fáciles de probar.

Redux no es necesario para todas las aplicaciones. Su propósito es ayudarte a determinar cuándo cambia tu estado. He aquí algunos ejemplos de cuándo desearías utilizar Redux, según la documentación oficial de Redux:

• El estado de tu app cambia a menudo.
• Tienes muchos estados de app, y se usa en muchos lugares a lo largo de la app.
• El razonamiento para actualizar el estado de tu programa es enrevesado.
• Te gustaría ver cómo ha cambiado el estado a lo largo del tiempo.
• La base de código de tu app es mediana o enorme, y en ella trabajarán varias personas.

El DOM Virtual en React Native es un duplicado del DOM real. Es un árbol de nodos que muestra las atribuciones, contenidos y propiedades de los elementos. El React DOM Virtual volverá a renderizar la UI si nuestros datos subyacentes cambian. Las discrepancias entre otras representaciones del DOM y las representaciones del DOM Virtual serán entonces contadas, y el DOM real será actualizado como resultado.

Todos los componentes principales de React aceptan un style prop. Este prop puede ser un objeto JavaScript directo. También puedes pasar una colección de estilos distintos.

Si tus componentes son complicados, es mejor utilizar StyleSheet.create para construir varios estilos en un solo lugar.

Los componentes de orden superior son funciones puras que reciben una entrada y emiten una nueva entrada. Su función principal es condensar y reutilizar la lógica de estado a través de varios componentes. Se consideran enfoques avanzados y no están incluidos en la API de React. En su lugar, son patrones que surgen de la estructura compositiva de React.

Esta es una pregunta muy común en las entrevistas de React Native. Existen numerosos enfoques para optimizar una aplicación. Veamos algunas de las posibilidades. Podemos:

• En lugar de simplemente guardar nuestros datos JSON en bruto, necesitamos comprimirlos o convertirlos.
• Reducir el tamaño de los archivos APK para arquitecturas de CPU.
• Optimizar el número de operaciones de estado y bibliotecas nativas.
• En los elementos de lista, utilizar características clave.
• Las imágenes y otros componentes gráficos deben comprimirse.
• Utilizar Proguard para reducir el tamaño de la app eliminando partes de nuestro bytecode y sus dependencias.

React Native emplea actualmente tres threads:

Thread MAIN/UI - El thread principal de la aplicación en el que se ejecuta tu aplicación Android/iOS. El thread principal tiene acceso a la interfaz de usuario de la aplicación y puede actualizarla.

Shadow Thread - Este es un thread de fondo que puede calcular diseños construidos con el framework React en React Native.

JavaScript Thread - Ejecuta el código Javascript principal.

Los temporizadores son un componente esencial de cualquier programa y React Native implementa temporizadores de navegador.

setTimeout, y clearTimeout Puede haber requisitos de negocio para ejecutar una pieza específica de código después de una cantidad específica de tiempo o después de un retraso. En tales circunstancias, setTimeout puede ser utilizado, mientras que clearTimeout simplemente borra el temporizador que se ha establecido.

clearInterval, setInterval setInterval es un método que invoca una función o ejecuta código a intervalos de tiempo definidos, según lo proporcionado por el segundo parámetro. Una función o bloque de código ligado a un intervalo se ejecuta hasta que se termina. El método clearInterval() puede utilizarse para finalizar un intervalo.

setImmediate, clearImmediate La función o ejecución se llama lo antes posible. clearImmediate se utiliza para cancelar las acciones inmediatas definidas por setImmediate ().

cancelAnimationFrame, requestAnimationFrame Es el enfoque más común para crear animaciones. Se llama a una función para actualizar una animación antes del siguiente fotograma de animación.

Props Drilling (Threading) es un término que se refiere al proceso de pasar datos desde el componente padre al componente hijo idéntico, aunque otros componentes posean los props en medio sólo para enviarlos hacia abajo en la cadena.