Desde su creación, Kabel ha realizado desarrollos con las más novedosas tecnologías del momento. El desarrollo web ha evolucionado mucho en los últimos años con la aparición de HTML5, con una tendencia clara de desarrollo cada vez más en el lado cliente.

Nuestros clientes están demandando que desarrollemos aplicaciones que se comporten como lo hace cualquier aplicación de escritorio y móvil, sin tener que esperar a que el servidor nos responda con toda la vista y sus datos cargados en ella. Por lo tanto, para satisfacer estas necesidades hace ya algo más de dos años, comenzamos a experimentar con el desarrollo de aplicaciones Single Page Application (SPAs).

Anteriormente hemos hablado de las bondades del desarrollo de SPAs (Single page application, o aplicaciones de una sola página) así que hoy no vamos a hablar de ellas. Hoy vamos a hablar de uno de los Frameworks más usados para el desarrollo de estas aplicaciones, en concreto AngularJS, en su versión 2 (actualmente en versión beta).

Hay infinidad de entradas en blogs que intentan disipar la duda sobre aprender ahora a desarrollar con Angular2 o esperar a que salga de su versión beta y ver como la acepta tanto el mercado como la comunidad de desarrolladores, no obstante, las necesidades de las empresas y por lo tanto de nuestros clientes están en constante evolución y es por ese motivo por el cual estamos viendo como el uso de Angular2 empieza a ser habitual. Según Brad Green (Engineering director at Google) alrededor de 330.000 desarrolladores lo están usando actualmente para desarrollar sus aplicaciones.

Ilustración 1: Uso de Angular2 en entornos de producción. Extraído de https://channel9.msdn.com/Events/Build/2016/T627

 

Principales cambios de Angular2

¿Qué cambios trae consigo Angular2? Hay tantos que no sé ni por dónde empezar. Una cosa sí está clara, el paradigma de desarrollo cambia por completo. Con AngularJS teníamos por un lado las vistas y por otro los controladores. En Angular2, tenemos componentes, y son éstos los encargados de devolver la vista u otros componentes. Con esto hay que afrontar una curva de aprendizaje mucho más grande pues no se trata de un MVC/MVVM tradicional.

Angular 1.X

Angular 2

Rendimiento

Desde su inicio, Google ha querido recalcar que iniciaban otra rama de desarrollo para empezar de cero con un Framework cuyo foco de atención sería el rendimiento. Desde sus principios AngularJS tenía unos problemas de rendimiento enormes que mejoraron mucho con la versión 1.3, pero que no daban los resultados esperados con grandes listas o grandes colecciones de datos, donde esa primera versión dejaba mucho que desear. Por eso iniciaron el desarrollo en paralelo de esta versión 2 del Framework, en donde, como decía al principio, su obsesión iba a ser el rendimiento, y más cuando el mercado de las aplicaciones móviles estaba alcanzando las cifras que se manejan hoy día.

Ilustración 2: Test de rendimiento extraído de http://info.meteor.com/blog/comparing-performance-of-blaze-react-angular-meteor-and-angular-2-with-meteor

 

Lenguajes de programación

Angular2 puede desarrollarse con 3 lenguajes distintos: Dart (el JS de Google), TypeScript (el JS de Microsoft), o Javascript puro y duro (si eres un purista del JS este es el tuyo :)). Como recomendación, y tras mucho buscar, te das cuenta de que tu lenguaje a elegir es TypeScript, pues es de donde más documentación existe y, en consecuencia, parece que va a ser el estándar a seguir.

 

Plataformas

Angular2 ofrece multitud de opciones para su despliegue, así, si lo que queremos es desplegarla en un entorno web podemos optar por cualquier tipo de servidor pues se trata de una aplicación estándar de HTML (IIS, Apache, NodeJS, etc…).

Si por el contrario lo que queremos es crear aplicaciones nativas para dispositivos móviles, podemos utilizar NativeScript o React Native.

Además de aplicaciones Web y móviles podemos crear aplicaciones convencionales de escritorio embebiendo nuestro código con Electron o Meteor.

Sin duda, ésta es una de las grandes mejoras de Angular2.

Carga dinámica

Con AngularJS teníamos que incluir todos los controladores, servicios, factorías en la página inicial. Con Angular2, los componentes se van cargando dinámicamente a medida que se van usando.

Templates

El procesamiento de las templates ahora se hace de forma asíncrona, pues se cargan dinámicamente.

Directivas

En Angular2 hay 3 tipos de directivas nativas distintas:

• Componentes: el componente propiamente dicho.
• Directivas estructurales: modifican el DOM añadiendo o quitando elementos del mismo. ej: ngIf, ngFor.
• Directivas de atributo: cambian la apariencia o el comportamiento de un elemento. ej: ngClass, ngStyle.

Como siempre, podremos crear nuestras propias directivas.

Angular 1.X

Angular 2

Desaparece $scope

A diferencia de la versión anterior, en Angular2 el binding de los datos no se hace a través del Scope, si no que se hace a través de cada componente. De este modo, es el componente el encargado de manejar toda su lógica.

Angular 1.X

Angular 2

Enrutamiento

El enrutador de Angular2 se ha vuelto mucho más sencillo de usar y configurar.

Mejoras SEO (Prerendering)

Una de las desventajas que tenía usar Angular era los problemas que existían para posicionar la página en los buscadores debido a la carga dinámica de la misma. Con Angular2 cabe la posibilidad de renderizar las páginas en servidor (en NodeJS), de este modo, cuando los crawlers de los buscadores accedan a nuestra página, todo el contenido estará cargado en ella.

Conclusiones

Muchas son las novedades, y muchos los proyectos que están apostando por integrar Angular2. Incluso Microsoft abrió sus puertas en la útlima “//build/ conference” a Brad Green (Manager de Desarrollo de AngularJS en Google) para que explicara los progresos que están alcanzando con las últimas versiones de Angular2.

Como siempre, antes de afrontar un desarrollo con este Framework, habrá que realizar un estudio para ver si realmente es lo que se necesita para satisfacer las necesidades del cliente, o puede tratarse más bien un stopper, que de una decisión acertada.

Habrá que ver como evoluciona todo esto, pero parece que aun estando en beta, se atisba un gran futuro por delante a este Framework cuya versión 1.X ya ha sido todo un éxito

Si quereis comentarnos lo que sea podeis hacerlo en info@kabel.es