Ionic 4: alejándose de lo conocido

Artículo

Ionic 4: alejándose de lo conocido

Ionic-core, Ionic-Angular, Stencil y Capacitor son los cuatro principales pilares de Ionic 4.

Ionic ha sido, desde su publicación en 2013, el gran abanderado del desarrollo hibrido, construido sobre dos pilares solidos: framework web y wrapeo nativo. Ahora publicará su versión 4 con un cambio drástico. Esta versión se encuentra actualmente en desarrollo y no hay publicado ningún roadmap público. Más que un framework pasa a ser un ecosistema completo, dividido en cuatro pilares principales:

Deloitte

1. Ionic-core

El objetivo en Ionic 4 es la abstracción de framework, por ello adoptan 100% el estándar WebComponents. De esta manera se podrá utilizar Ionic tanto en Angular, React, Vue o cualquier otro framework o librería web, incluido html/js plano.

2. Ionic-Angular

Para no romper y abandonar a todos los usuarios actuales del framework, Ionic mantendrá, al menos en la versión 4, una librería denominada Ionic-Angular. Esta librería ofrecerá un wrapeo sobre ionic-core para complementarlo y mantener las funcionalidades existentes hasta ahora dentro de Angular: Routing, Forms de Angular, etc. En muchos casos esta seguirá siendo la versión utilizada de Ionic, y no debería observarse un cambio demasiado grande entre las versiones 3 y 4.

3. Stencil

Es el generador de WebComponents. Stencil sigue un principio muy simple: generar WebComponents estándar, sin la necesidad de cargar ninguna librería o framework extra. Además, es la herramienta utilizada internamente para generar los componentes que conforman ‘ionic-core’. Este mismo enfoque es el compartido con la futura versión 3 de Polymer y en Angular con “Angular Elements”, introducido en la versión 6 pero no maduro aún.

Algunas de las funcionalidades a destacar en Stencil son:

  • Virtual DOM
  • Async rendering
  • Reactive data-binding
  • TypeScript
  • JSX

El soporte en navegadores es equivalente al soporte del estándar de WebComponents: Chrome, Safari, Firefox*, Edge* y IE11*. Los navegadores marcados con ‘*’ no soportan completamente el estándar, por ello Stencil incluye un polyfill dinámico que cubre esas funcionalidades hasta que el soporte sea completo.

4. Capacitor

Ionic decide crear su propio wrapper nativo, moderno y especializado para las plataformas actuales. Las dos principales diferencias con Cordova son:

1. Concepto de plataforma
En lugar de tener como Cordova una configuración común y gestionar todo el proceso de build y ejecucion de cada plataforma automáticamente, Capacitor sigue un enfoque diferente: El te ofrece el seed de un proyecto nativo que es el wrapper para la plataforma en concreto, pero toda la configuración, compilación y ejecución se realiza como si de una aplicación nativa se tratase.

2. API estándar
Capacitor incluye de fábrica una API para cubrir las funcionalidades más comunes, reduciendo la necesidad del uso de plugins para todo. Esto no elimina el soporte de plugins en Capacitor. Por tanto, las plataformas soportadas son:

  •  Android e iOS: para las plataformas móviles sustituye a Cordova completamente. Por el momento intenta mantener soporte de plugins de Cordova, centrándose en los más comunes.Además, dentro del plan a medio plazo entraría el posible soporte de elementos UI nativos como usan React Native o NativeScript, de modo que una etiqueta <list> se convertiría en una lista nativa.
  • Progressive Web Apps: incluye soporte para PWA’s, tratándolo como una plataforma más a la hora de compartir API.
  • Escritorio: el soporte de escritorio, mediante integración con Electron, está en proceso de desarrollo.

Ángel Hernández Fernández

Ángel es analista senior del área de tecnología de Deloitte con más de 6 años de experiencia. Se incorporó a Deloitte en 2011 dentro del área de DxD. Su carrera ha estado enfocada desde el inicio en el ámbito front-end formando parte de la iniciativa de la compañía desde su creación. Ha participado en proyectos que abarcan desde portales web, aplicaciones web SPA y aplicaciones móviles tanto hibridas como nativas en ambas plataformas, trabajando con las arquitecturas y frameworks más comunes en el mercado.

Did you find this useful?