¿Qué es ReactJS?

React-ivando el mundo Javascript

Creada por Facebook, esta librería Javascript de código abierto, ofrece grandes beneficios en performance, modularidad y, además, promueve un flujo muy claro de datos, facilitando el desarrollo de apps complejas.

ReactJS no se trata de un Framework completo como AngularJS, sino que está enfocada a la implementación de la vista, en lo que podría ser un patrón clásico como MVC.

¿Qué es ReactJS?

Lo primero que debemos saber de ReactJS, es que se trata de una librería para desarrollar interfaces de usuario. No hablamos de un framework ¨todo incluido¨como AngularJS, Durandalo Ember

ReactJS es una librería enfocada en la visualización, proporcionando un performance superior al momento para manipular el DOM.

Esto lo consigue creando un DOM virtual en lugar de renderizarlo todo en cada cambio. Es decir, hace los cambios en una copia en la memoria y después, usa un algoritmo para comparar las propiedades de la copia con las de la versión del DOM, y así, aplicar cambios exclusivamente en las partes que varían.

Esto implica un mayor consumo de memoria porque hay que mantener el DOM Virtual, pero generalmente no suele ser un problema, y la mejora de rendimiento lo compensa.

 

¿Qué abarca? 

ReactJS está orientado al desarrollo del cliente, por lo que no es un Framework al uso como pueden ser AngularJS o Knockout, que son un ¨todo incluido¨.

ReactJS se centra en el desarrollo de la Vista. Por esto, es muy común verlo relacionado con otras librerías formando tándem para cumplimentar el desarrollo del resto de la aplicación, como puede ser ReactJS + BackBone.

Este planteamiento rompe con los patrones habituales, facilitando el no tener que ¨casarnos¨ con una librería para implementar nuestra aplicación.

Facebook, por otro lado, nos propone una arquitectura para modelar el resto de la aplicación: Flux, dotándonos de una flexibilidad a la hora de elegir compañeros de viaje en el desarrolllo.

 

¿Qué novedades aporta ReactJS? 

.Databinding unidireccional

Promueve un flujo de datos en un solo sentido, facilitando la planeación y detección de errores en aplicaciones complejas.

Habitualmente Frameworks como AngularJS usan un binding bidireccional, haciendo la carga de la página mucho más compleja.

Con el binding unidireccional se facilita toda esta carga de datos y simplifica mucho a la hora de testear nuestra aplicación.

.DOM virtual

Con esta característica se evita renderizar el DOM cada vez que hay cambios. En este caso, los cambios son recogidos en el DOM virtual (copia virtual del DOM), y luego se comparan con el original para, posteriormente, aplicar los cambios en el mismo.

Se paga un coste de memoria. No obstante, es mucho más eficiente. Sobre todo, a la hora de renderizar gran cantidad de elementos cuando solo han cambiado unos pocos.

¡Hasta aquí todo por hoy developers!

¡Permaneced atentos a todos nuestros recursos!

 

Escrito por Abel García, Developer en Bravent.