Características de React: las más prácticas y útiles
Como comentábamos en nuestro post ¿Por qué tiene tanto éxito la librería React?, ReactJS (tambien conocido como React.js o, sencillamente, React) es básicamente una librería con la que podremos crear aplicaciones web en Javascript, tanto del lado del cliente como del servidor, siendo esto una de las principales características de la librería. En este artículo, repasamos las principales características y ventajas de React.
Composición de componentes
En ReactJS podremos pasar funciones como parámetros, algo también conocido con el nombre de composición funcional. Las aplicaciones se elaboran con la composición de varios componentes y que encapsulan un comportamiento, una vista y un estado. La complejidad de estos no debe preocuparnos porque el comportamiento reside dentro de cada uno de ellos y al final la aplicación será un conjunto de componentes que trabajan entre sí.
Facilidad de mantenimiento, depuración y escalabilidad son sólo algunas de las ventajas que podemos encontrar en esta forma de trabajar.
Desarrollo Declarativo vs. Imperativo
Con otras librerías, como jQuery, o Vanilla Javascript, el tipo de programación que utilizamos es imperativo. Se crean scripts que tienen que informar en el DOM qué debe de realizar o cómo debe de actuar. Esta forma de declarar hace que tengamos que escribir mucho código y a la larga un engorro a la hora de mantenerlo.
La primera de las ventajas de React es que es más declarativo, porque contamos con un estado de la aplicación y sus componentes responden ante la variación de ese estado. Cuando cambiamos las propiedades de los componentes se produce un cambio en su funcionalidad.
Flujo de datos unidireccional
Ese patrón de funcionamiento que posee React hace que los componentes superiores propaguen los datos a los que están en un orden inferior, estos trabajarán con esos datos y cuando cambian su estado envían los eventos hacia los de orden superior para actualizarse.
Aunque el flujo suele ser unidireccional, en ocasiones podemos hacerlo bidireccional por comodidad, pero recuerda que si lo mantenemos unidireccional, el mantenimiento de la aplicación será mucho más sencillo.
Rendimiento gracias al DOM Virtual
Otra de las ventajas de React es que las operaciones que realiza, cuando se ejecutan las aplicaciones, son mucho más rápidas porque se realizan antes sobre el DOM Virtual, que cargado en memoria, permite actualizaciones de hasta 60 frames por segundo, dando como resultado una sensación de fluidez impresionante.
Isomorfismo
También conocido como Javascript Universal, es la capacidad de ejecutar el código tanto en el cliente como el servidor, solucionando problemas de posicionamiento tradicionales.
Elementos y JSX
El código que embebemos con ReactJS dentro de Javascript, es JSX, aunque tenga apariencia HTML, es decir, utilizamos una sintaxis propia y el resultado son elementos en memoria y no DOM tradicional. Sin intervención por nuestra parte, los encargados en convertir los elementos devueltos por JSX en DOM Real, son React DOM y la herramienta de diffing.
Componentes con y sin estado
Los que no tienen estado se llaman stateless y son los componentes que no guardan datos en su memoria, pudiéndose escribir una pequeña función que devuelve el JSX.
Los que pueden guardar un estado se les llama statefull. La diferencia respecto a los anteriores es que en su código se escribe por medio de una clase ES6 (Javascript con ECMAScript 2015, como puedes ver en el artículo ¿Qué es ECMAScript 6 (ES6)? ) y en la que podemos disponer de atributos y métodos para realizar todo tipo de operaciones.
Ciclo de vida de los componentes
La última de las características de React es que añade un método que se activa cuando pasan cosas frecuentes en un componente y que permite suscribir acciones cuando se provoca una inicialización, se obtiene la devolución de una promesa, etc.
Después de tanta teoría, en próximos artículos profundizaremos en el uso de ReactJS desde un punto de vista más práctico. ¡Permanece atento a nuestro blog!
Desarrollador web, crea y mantiene los sitios web de Arsys. También idea herramientas internas que facilitan y mejoran los procesos. Es experto en desarrollo FrontEnd y en la optimización del rendimiento web, áreas en las que constantemente busca innovar para ofrecer la mejor experiencia online.