¿Qué es React JS?
React JS es una librería JavaScript creada por Facebook para gestionar el renderizado de las vistas de una aplicación web. Lo más habitual es utilizarla en el frontend pero también puede ser utilizada en el backend.
Actualmente grandes compañías están utilizando esta tecnología… Facebook, Instagram o Netflix son algunos ejemplos.
Comúnmente se denomina a React como “la V de los diferentes patrones MV*” ya que no se trata de un framework como AngularJS o Backbone, sino de un framework para renderizar vistas.
Principales características de React
1. Virtual DOM
Sin duda React es tan conocido y potente gracias a su Virtual DOM. El funcionamiento puede parecer sencillo, pero es realmente complejo (hasta ahora nadie había conseguido un rendimiento similar en el renderizado de vistas).
El Virtual DOM genera un árbol donde va registrando cada componente creado. Cuando se produce un cambio a algún elemento de la vista, su algoritmo de Diff marca que elementos dentro del árbol generado (Virtual DOM) tienen cambios para renderizar. De este modo, a la hora de renderizar, solo se repintan los elementos marcados y el framework no tiene que revisar y el DOM completo.
Para obtener más información sobre el algoritmo de React visitar http://calendar.perfplanet.com/2013/diff/
2. Diseño orientado a componentes
Siguiendo la buena práctica de utilizar componentes en el frontend, React trabaja exclusivamente con ellos. Aunque pueda parecer algo obvio en el desarrollo de software, la utilización de componentes en el frontend no ha sido algo habitual. El concepto es simple, pero aporta muchísimo valor a la hora de generar interfaces complejas o escalar aplicaciones.
Para obtener más información sobre componentes de React visitar http://react-toolbox.com/
3. JSX
JSX un pseudolenguaje que facilita el desarrollo de aplicaciones con React. JSX no es compatible con los navegadores, por lo que es necesario compilarlo a JavaScript (existen diferentes formas como por ejemplo Babel o Browserify).
En un principio puede parecer raro manejar HTML desde JSX o JavaScript pero debes tener en cuenta que React se enfoca en la renderización de vistas. Toda la estructura está en el Virtual DOM, el cual se compara con el DOM actual, y se aplican sólo las diferencias en los componentes que sean necesarios.
Cómo escribimos nuestra aplicación
Una aplicación React JS puede ser escrita utilizando JavaScript puro (nada recomendable) o JSX bien mediante ES5 o utilizando el nuevo estándar ES6. Esta segunda opción es la más recomendable sobre todo por legibilidad del código, pero también porque es la tendencia, lo que te ayudará en diferentes foros, etc.
Posteriormente hay que compilar el código con aplicaciones como Babel o Browserify para generar una versión en ES5 que funcione en los navegadores actuales o incluso utilizar JSXTransformer para entornos de desarrollo.
Lo recomendable escribir JSX con ECMAScript 6 por legibilidad del código y para posibles solicitudes de ayuda en Internet como por ejemplo foros.
