Menú de navegaciónMenú
Categorías

La mejor forma de Aprender Programación online y en español www.campusmvp.es

?id=2f74244e-1c29-4744-a005-79534b755f86

Los 5 mejores frameworks de JavaScript en 2017

Icono de advertencia ATENCIÓN: este contenido tiene más de 2 años de antigüedad y, debido a su temática, podría contener información desactualizada o inexacta en la actualidad.

Por cierto... ¡Este es nuestro artículo número 500! :-)

Si has estado dentro del mundo del desarrollo web en los últimos años, te habrás dado cuenta del crecimiento imparable de JavaScript de un tiempo a esta parte. Incluso si no tienes pensado hacer desarrollo web, lo más probable es que te tropieces con JavaScript tarde o temprano en tu carrera profesional.

La popularidad de JavaScript sigue creciendo. Recientemente JavaScript ha sido designado como uno de los mejores lenguajes de programación para aprender en 2017 por IBM. Se usa tanto en el lado del cliente como en el lado servidor y ayuda a diseñar interfaces espectaculares, enriquecer aplicaciones web con multitud de funciones, editar páginas web en tiempo real y más cosas, extendiendo su influencia al servidor e incluso a dispositivos embebidos.

Pero es un mundo cambiante...

En 2016 ya vimos muchos grandes cambios, como la presentación de Angular, el auge imparable de React, la cada vez mayor popularidad de Vue.js, la evolución de ECMAScript, actualizaciones constantes de Node.js, el (aún hoy en día) dominio absoluto de jQuery que se utiliza en el 96% de las webs que usan JavaScript... Y todo esto sin contar con los movimientos constantes que hay en tooling con WebPack y npm/Yarn a la cabeza.

¿Qué esperar en 2017 en cuanto a bibliotecas y frameworks de lado cliente? Esto es lo que sabemos hasta ahora: Angular 4 salió a finales de marzo, la edición ECMAScript2017 es inminente y el lanzamiento de Bootstrap v4 también se prevé para pronto.

Los frameworks web de JavaScript pueden ser una solución muy útil para el desarrollo rápido de aplicaciones web. Sirven de estructura para aplicaciones de una sola página (SPA), permiten a los desarrolladores preocuparse menos de la estructura del código y el mantenimiento, y centrarse en la funcionalidad.

Las ventajas de usar frameworks de JavaScript son:

  • Eficiencia y velocidad de desarrollo: antiguamente crear un proyecto desde cero podría llevar varios meses y, ahora gracias al uso de funcionalidades pre-programadas, estructuras predefinidas y patrones probados (como MVVM), el desarrollo puede ser mucho más rápido.
  • Mantenimiento e incorporación de miembros a los equipos: gracias a que el uso de un framework fuerza a usar ciertas arquitecturas y formas de proceder, es mucho más fácil incorporar personas a un equipo de trabajo, pues sabrán entender el código y retomarlo de manera más rápida. Algunos, no obstante, son más "estrictos" que otros en cuanto a lo que dejan hacer o no a los programadores. Por ejemplo Angular es muy estricto en cuanto cómo desarrollar, por lo que resta algo de libertad a los programadores, y al mismo tiempo facilita la incorporación al proyecto, por lo que puede ser ideal para las empresas.
  • Seguridad: los mejores frameworks de JavaScript están diseñados con la seguridad en mente, y facilitan que nuestras aplicaciones sean más seguras. Por supuesto, la última palabra la tiene el desarrollador, que debe también pensar en la seguridad todo el tiempo mientras programa. Pero nos facilitan mucho la vida a este respecto también.
  • Coste: la práctica totalidad de los frameworks son de código abierto y gratuitos. Dado que ayuda a los programadores a crear soluciones personalizadas más rápidamente, el precio final de cualquier aplicación web también será menor.

Los mejores frameworks de JavaScript en 2017:

Angular

Tras el esperado lanzamiento de Angular hacia finales de 2016, su popularidad ha alcanzado nuevas cotas, aunque AngularJS no va a ceder mucho terreno en 2017 y seguirá siendo muy utilizado, ya que existen multitud de aplicaciones creadas con esa versión, y el equipo de Google la sigue manteniendo y lanzando nuevas versiones.

El término "Angular 2" ha sido abandonado a partir de la versión 4. Dicho esto, debemos empezar a llamarle simplemente "Angular" sin el sufijo de la versión, como ya hemos dicho en varias ocasiones en este blog.

Angular a menudo se le define como framework MVW (Model-View-) y entre sus principales ventajas, para startups y PYMES destacan, por citar las más importantes solamente:

  • Desarrollo rápido.
  • Enlazado de datos en ambas direcciones.
  • Es muy "opinionado" (com dicen los yankis), es decir, te fuerza a usar buenas prácticas y una serie de arquitecturas, por lo que es fácil que cualquiera retome tu trabajo y también colaborar.
  • Facilidad de testing.

    Desde su lanzamiento ha llegado más lejos de lo que nadie se imaginada. Por ahora se le considera razonablemente el framework de JavaScript más usado para desarrollos de SPAs (incluyendo AngularJS y Angular) y es el que tiene, probablemente, la comunidad más grande de desarrolladores.

Angular viene con una larga lista de funcionalidades que permiten desarrollar de todo, desde aplicaciones web hasta aplicaciones de escritorio y móviles. El framework está hecho con TypeScript, con la intención de hacer que JavaScript sea más ágil y atractivo para grandes empresas. Angular destaca por tener una arquitectura basada en componentes, una inyección de dependencias mejorada, un servicio de logging eficiente, comunicación entre componentes y mucho más...

Angular es probablemente la mejor opción para empresas o para entornos de programación estrictos, con altos estándares en cuanto a la legibilidad del código.

ReactJS

React (también llamada React.js o ReactJS) es una biblioteca JavaScript de código abierto para crear interfaces de usuario con el objetivo de animar al desarrollo de aplicaciones en una sola página. Intenta ayudar a los desarrolladores a construir aplicaciones que usan datos que cambian todo el tiempo. Su objetivo es ser sencillo, declarativo y fácil de combinar.

Aunque lo hayamos incluido en la lista, hay que tener claro que, al contrario que Angular, es una biblioteca de UI, y no tanto un framework. Es decir, hay muchísimas cosas que deja fuera y que sus competidores sí que tienen, ya que está centrado en lo que está centrado: interfaces de usuario. En el patrón MVC (Modelo-Vista-Controlador), React.js sería la "V"

Lo bueno y malo a la vez es que puede ser integrado con cualquier arquitectura, pero debemos tenerla clara, ya que no nos viene marcada. Por ello es más demandante por parte de los desarrolladores, que necesitan utilizar otros frameworks, arquitecturas y componentes para dotar a sus aplicaciones de la funcionalidad que React no ofrece.

Debido al uso del "DOM virtual" ofrece un enorme rendimiento en el renderizado de interfaces, sobre todo si lo compramos con frameworks "viejos" de hace solo un par de años, como AngularJS (no Angular, ojo).

Se le considera el framework (aún sin serlo realmente) con mayor crecimiento. React está detrás de las interfaces de usuario de Facebook o Instagram, dando prueba de su valía en aplicaciones dinámicas con mucho tráfico.

A pesar de que tiene una curva de aprendizaje mayor que la de otros frameworks, una vez que lo aprendes es una forma de crear aplicaciones bastante sencilla y fácil de entender. Además puede encajar bien con soluciones de software complejas, ya que es fácil de combinar.

Es interesante para programadores individuales que disfruten con JavaScript, proyectos Open Source, empresas con una dirección técnica muy estricta y equipos con una formación de base en JavaScript/ECMAScript alta.

Vue.js

Vue 2.0 también se presentó en 2016. La idea era tomar prestado lo mejor de Angular, React e incluso EmberJS y convertirlo en una nuevo framework. Está demostrado en numerosas pruebas que es más rápido y ligero en comparación con Angular e incluso con React (¡herejía!).

Al igual que Angular, Vue.js ofrece enlace a datos en dos direcciones, posibilidad de renderizado en lado del servidor (también ReactJS). Del mismo modo, al igual que ReactJS, utiliza un DOM virtual, proporciona componentes reactivos y componibles, y se centra mucho en su núcleo, dejando cosas como el enrutado o el estado global en componentes de terceros. En este sentido es menos completo que Angular, pero más que ReactJS. Ah, e incluso ofrece soporte para componentes JSX de ReactJS si lo necesitásemos, pudiendo combinar ambas.

Su herramienta de línea de comandos, Vue-cli, proporciona una forma rápida de comenzar los proyectos sin partir de cero.

En este enlace de su página se ofrece una extensa comparativa entre Vue.js y otros frameworks y bibliotecas.

Su principal ventaja es que no tiene que cargar a cuestas con el "equipaje" que tienen Angular o React, y ha ido aprendiendo de sus aciertos y errores, por lo que es como aunar lo mejor de los dos mundos. Tiene un rendimiento brutal y es más fácil de aprender que los dos anteriores. Muchos desarrolladores se están pasando a Vue.js. La comunidad de Laravel (PHP) es el framework de lado cliente que ha elegido mayoritariamente.

Ember.js

Ya en 2015 Ember era considerado por muchos como el mejor framework JavaScript para aplicaciones web, dejando a React y AngularJS atrás. Hoy en día puede presumir de una gran comunidad online, actualizaciones periódicas y un uso de buenas prácticas de JavaScript que garantizan la mejor experiencia ya por defecto.

Ember proporciona también enlace de datos en dos direcciones, manteniendo tanto la vista como el modelo sincronizados todo el tiempo, y tiene integrada la popular sintaxis de Hadlebars para crear plantillas. Al igual que Angular ofrece una arquitectura clara para que no tengas que estar tomando decisiones todo el rato, lo cual facilita el desarrollo siguiendo buenas prácticas. Está más pensado para crear aplicaciones grandes desde cero que para pequeñas pruebas de concepto, componentes o incorporarlo a aplicaciones existentes.

Ofrece mucha solera y sabemos que está muy probado, lo cual siempre es una garantía. Es fácil de aprender comparado con Angular o React, y tiene una buena documentación online. Sería recomendable si quieres algo bien probado, que te marque bien las pautas para hacer bien las cosas e incorporar nuevos desarrolladores al proyecto sin problema. Frente a Angular ofrece mayor estabilidad histórica, ya que lleva años en existencia, con una gran calidad y sin romper la compatibilidad al sacar nuevas versiones. Además la empresa que tiene detrás, Tilde, muy conocida en el mundo del desarrollo, lo utiliza para todos sus productos, por lo que tienen mucho cuidado de que esto sea así.

Aurelia

Como les gusta decir a sus fans, Aurelia es el framework JavaScript más popular del que nunca has oído hablar. Y es que se trata de un framework que tiene una gran cantidad de seguidores que simplemente lo adoran.

Su creador es Rob Eisenberg, que fue el creador de su predecesor, el mítico Durandal.js. Rob trabajó en el equipo de Angular creando su actual encarnación (lo que se llamó al lanzarlo Angular 2), pero lo abandonó por no estar muy de acuerdo con las decisiones técnicas y de diseño que se tomaban.

Aurelia es un nuevo framework creado con los últimos estándares en mente (lo cual es una gran cosa, comparándolo con React y Angular), y con todo el aprendizaje que tiene detrás Rob y su equipo con Durandal y Angular. No es tan conocido como los demás, ni tiene una comunidad tan grande detrás, pero a cambio ofrece un equipo de desarrolladores más dedicado que ningún otro, siempre dispuesto a ayudar y resolver tus preguntas.

La gente que aprende Aurelia generalmente lo adora y no quiere saber nada de los otros frameworks, de los que dicen estar a años luz.

Aurelia es como si fuese una variante Angular más elegante y sencilla de entender. Utiliza también TypeScript, por lo que la escritura de código es menos propensa a errores y más sencilla que con JavaScript. Una de las cosas que más le gusta a sus seguidores es la forma de definir componentes, sin el uso de sintaxis rebuscadas, como sí ocurre con Angular y (sobre todo) React. Los componentes escriben en JavaScript y HTML estándar (bueno, en realidad en TypeScript y HTML, que luego se generan a JavaScript) y se parecen mucho a las plantillas que se han usado tradicionalmente en desarrollo web. Es muy rápido y ligero, a pesar de no usar un DOM virtual, que no tiene nada que envidiar en rendimiento a React. Utiliza convenciones para evitar tener que configurar tantas cosas. No depende de componentes de terceros.

Aquí tienes una comparación interesante con Angular y React en palabras de su creador.

Si no tienes miedo de tener menos apoyo de la comunidad que con los anteriores, Aurelia es un framework completo y capaz de hacer cualquier cosa que tengas en mente, es más ligero que Angular y tan rápido como React. ¿Te atreves con él?

Conclusión

La elección de un framework de JavaScript no está supeditado a las funcionalidades que cada uno pueda proporcionar. Depende de los objetivos iniciales de la empresa o el programador, los requisitos de los proyectos, cómo se pueden aplicar dentro de cada caso e incluso de tus gustos personales, tu perfil y tus conocimientos de base.

Aquí hemos revisado someramente los 5 más importantes tratando de ver en un espacio reducido sus principales características, no necesariamente técnicas, y tratando de ayudarte a empezar a decidirte por uno u otro. Todos son muy capaces aunque algunos ofrecen más funcionalidad que otros (React lo tendrás que combinar con más cosas, pues no lo hace todo).

Angular y React son sin duda los más conocidos y utilizados, Ember es un clásico con una base de fans muy activa y fiel que lo convierte en una buena opción. VUE.js parece la gran promesa de futuro, pero en esto nunca se sabe, y Aurelia es adorado por todo el que lo usa.

Así que ahora te queda a ti la tarea más difícil de todas: decidirte por uno...

Fecha de publicación:
campusMVP campusMVP es la mejor forma de aprender a programar online y en español. En nuestros cursos solamente encontrarás contenidos propios de alta calidad (teoría+vídeos+prácticas) creados y tutelados por los principales expertos del sector. Nosotros vamos mucho más allá de una simple colección de vídeos colgados en Internet porque nuestro principal objetivo es que tú aprendas. Ver todos los posts de campusMVP
Archivado en: Desarrollo Web

Boletín campusMVP.es

Solo cosas útiles. Una vez al mes.

🚀 Únete a miles de desarrolladores

DATE DE ALTA

x No me interesa | x Ya soy suscriptor

La mejor formación online para desarrolladores como tú

Comentarios (6) -

Como siempre, estupendo artículo! Según vuestra opinión que framework de los comentados tiene una curva de aprendizaje menor?

Muchas gracias

Responder

Hola Mariola:

Seguramente VUE.js. Los demás en mayor o menor medida son más complejos para empezar con ellos.

Saludos.

Responder

Q paso con POLYMER ya casi va por la 3, siempre lo actualizan ahorita ya usa ES6
y esta siendo usado en YOUTUBE lo que dice mucho del mismo y su super integración con material
A mi parecer ya que he usado todos ellos
1- Polymer
2- Angular
3- Vuejs ... Aurelia (casi la copia)
4- React

MMM EMBER se actualiza pero n me convence del todo \m/

Responder

Hola Oscar:

Polymer es una biblioteca para crear componentes de UI, nada que ver con Angular, VUE o Aurelia, que son frameworks completos que te dan muchas más cosas, como routing, comunicaciones con el servidor y muchas otras cosas.

Aunque puedes construir aplicaciones con Polymer, todo lo demás te lo tienes que hacer tú desde cero.

En ese sentido se parece más a React, que ya avisamos en el artículo que se incluye dada su enorme popularidad, pero que realmente no es un framework como los demás que mencionamos. La comparación entre React y Polymer sería más justa, y es casi una cuestión de preferencias. Hay quien React lo ve muy complicado y Polymer mucho más fácil de usar, pero también React es mejor enlazándose con el modelo o con datos... Hay para pros y contras para todos los gustos.

Gracias por comentar.

Responder

En su opinión, qué opción sería la más adecuada para combinar con, por ejemplo, Ruby on Rails?

Responder

campusMVP
campusMVP

Hola Ángel:

Cualquier framework JavaScript debería llevarse bien con tu aplicación RoR ya que uno es lado cliente y el otro es lado servidor, y no deberían interaccionar más que a través de algún servicio. El framework del servidor no debería condicionar el framework que uses en el lado cliente.

Saludos.

Responder

Agregar comentario

Los datos anteriores se utilizarán exclusivamente para permitirte hacer el comentario y, si lo seleccionas, notificarte de nuevos comentarios en este artículo, pero no se procesarán ni se utilizarán para ningún otro propósito. Lee nuestra política de privacidad.