Desarrollo de Rich Entreprise Applications con Flex

Desarrollo de Rich Entreprise Applications con Flex
Desarrollo de Rich Entreprise Applications con Flex
Aplicaciones empresariales orientadas a web.
Qué hemos ganado con las aplicaciones web
•
•
•
•
•
Total ubicuidad. Basta un ordenador conectado y un navegador.
Se resuelven todos lo problemas derivados de la distribución del software.
Administración centralizada. No es necesario un CPD distribuido.
Total aprovechamiento de la infraestructura de INTERNET.
Los requerimientos de hardware disminuyen en los puestos de trabajo.
Qué hemos perdido
•
•
•
•
•
Necesitamos construir pantallas con HTML+Javascript+CSS.
Para ello necesitamos tecnologías de desarrollo de la lógica de presentación:
Servlets, JSP, Struts, JSF, ASP, etc.
Las herramientas especializadas en lo primero no hacen lo segundo y a la
inversa.
Los especialistas en lo primero no hacen lo segundo y a la inversa.
Construir la capa de presentación se lleva el 70% del coste de desarrollo y el
70% de los problemas de escalado y rendimiento.
¿Qué pasa con la "Experiencia de usuario"?
•
•
•
•
•
El resultado que ofrecemos al usuario es considerablemente peor que en las
“desktop applications”.
La pantalla debe ser recargada cada vez que el usuario interactúa con ella.
El tráfico de red se incrementa. Los elementos de presentación viajan muchas
veces.
La navegación ya no es componente a componente, sino página a página.
Para los usuarios de “desktop applications” la nueva generación de aplicaciones
orientadas a web supone un paso atrás.
•
"Time to market"
•
•
•
•
•
•
¿Cuantas pantallas son necesarias? ¿Cuanto tardamos en desarrollar una
pantalla?
La capa de presentación orientada a web es extremadamente pesada de construir.
Es necesario saber: HTML, Javascript, CSS, Servlets, JSP, JSTL.
(Opcionalmente Struts, JSF, AJAX.)
Necesitamos perfiles distintos: diseñadores y/o desarrolladores.
No existen herramientas altamente productivas.
La capa de presentación supone:
¾ Más del 70% del esfuerzo de desarrollo.
¾ Más del 90% del origen de los problemas.
Equipos de desarrollo
•
•
La barrera de entrada para disponer de un buen desarrollador en muy alta:
¾ Demasiadas tecnologías.
¾ Programación a muy bajo nivel: demasiados APIs.
¾ Demasiados patrones.
¾ Ausencia de IDEs para un desarrollo rápido end-to-end.
Necesitamos expertos en diseño web: HTML, JavaScript.
Rendimiento
•
•
•
•
•
•
Las aplicaciones orientadas a web son difíciles de escalar.
Se deriva de la necesidad de mantener el estado de la sesión en el servidor.
En un escalado horizontal implica el problema de la replicación de sesión.
En un escalado vertical implica introducir invocaciones remotas a la capa de
servicios de negocio y la necesidad de introducir tecnologías de componentes
distribuidos.
Alto tráfico de red: el 80% del tráfico son componentes de presentación.
Total desaprovechamiento de la capacidad de proceso de los PCs.
Rich Entreprise Applications
Desarrollo actual de aplicaciones web
•
•
•
•
•
Generan un plantilla HTML en la que se incrustan etiquetas que corresponden a
controles o elemento gráficos del interfaz de usuario.
La plantilla se compila a un componente software que se ejecuta con cada
solicitud generando las páginas.
Navegación page-to-page.
Este modelo obliga a:
¾ Gestionar la navegación de pantallas en el servidor.
¾ Gestionar las validaciones en el servidor.
¾ Mantener el estado de la sesión en el servidor.
Las herramientas de desarrollo son limitadas en la creación de interfaces ricos
arrastrando controles a un lienzo.
Rich Internet Applications
•
•
•
•
•
•
Aplicaciones cuya capa de presentación se ejecuta en un navegador.
Sus pantallas son similares a las que teníamos en las “desktop applications”, con
amplias librerías de controles gráficos.
Navegación “component-to-component”, en lugar de "page-to-page".
Riqueza de controles de usuario.
Reducir el tráfico de red enviando y recibiendo exclusivamente datos.
Dos enfoques: AJAX y Flex.
AJAX
•
•
•
•
•
•
•
•
AJAX - Asynchronous JavaScript and XML.
Se fundamenta en el enriquecimiento de la capacidad de Javascript mediante un
conjunto de APIs que permiten:
¾ Manipular dinámicamente el Document Object Model.
¾ Comunicarse con un servidor web mediante XML.
Existen distintas librerías AJAX, tanto open-source como comerciales:
Backbase, Tibco, JackBe, Thinkcap, etc.
Los navegadores interpretan el código JavaScript y el lenguaje de marcado
particular de cada librería AJAX.
Se basa en el lenguaje de programación de Adobe: Actionscript y el lenguaje de
marcado MXML.
El desarrollo se realiza con una herramienta avanzada: Flex Builder.
Los ficheros generados se compilan a ficheros de bytecodes que son descargados
y ejecutados en el plug-in del navegador: Flash-Player.
Permite invocar a los servicios de negocio de muy diversas maneras:
¾ Mediante request HTTP.
¾ Mediante servicios web.
¾ Directamente invocando clases Java en el servidor.
¾ Mediante sincronización transparente entre objetos Flex y objetos Java.
¾ Mediante Data-Push.
Flex vs. AJAX
•
•
•
•
•
•
No existen herramientas de desarrollo para AJAX que puedan compararse al
Flex Builder.
La calidad de las pantallas de Flex está muy por encima de las obtenidas con
AJAX.
Las capacidades de integración con el servidor son muy superiores en Flex.
Flex garantiza la compatibilidad entre navegadores, al ejecutarse sobre el FlashPlayer.
Javascript puede tener comportamientos distintos dependiendo del navegador.
Flex es compilado:
¾ Permite detectar errores en tiempo de compilación.
¾ Su rendimiento es muy superior en el navegador.
La plataforma Flex.
Componentes básicos
•
•
•
•
•
Una herramienta de desarrollo altamente productiva: Flex Builder basada en
Eclipse.
Un lenguaje de marcado basado en XML que define el interfaz de usuario:
MXML.
Un lenguaje para procesar los eventos de usuario en las pantallas: ActionScript.
Un compilador integrado en la herramienta que crea ficheros ejecutables en el
Flash Player del navegador.
Una aplicación web instalable en cualquier contenedor web que permite invocar
directamente objetos Java desde el cliente.
Flex Builder
•
•
•
•
•
IDE altamente productivo de desarrollo de pantallas basadas en Flex
proporciona un conjunto de ricas librerías de controles gráficos.
Desarrollado sobre la plataforma Eclipse. Puede instalarse como un plug-in,
conviviendo con otros plug-in, como el de Java.
Integrado con Flex Data Charting proporciona una poderosa librería de trabajo
con gráficos.
Integrado con el compilador Flex, que genera los bytecodes para su despliegue.
Permite integrar efectos multimedia y ricos interfaces basados en efectos
visuales (transitions, skining).
Flex Data Services
• Aplicación web estándar J2EE que proporciona:
• Acceso a servicios de negocio y persistencia basados en:
¾ Request directos HTTP.
¾ Servicios web.
¾ Directamente objetos remotos Java.
¾ Servicios gestionados en contenedores como Spring.
• Otras características avanzadas como:
¾ Sincronización transparente cliente-servidor.
¾ Mensajería asíncrona Publish-Subscribe (integrable JMS).
¾ Data Push.
InfoWorld: Mejor tecnología desarrollo RIA 2007
Ejemplo: Gestión Comercial
Ejemplo: SAP NetWeaver Business Cient
Ejemplo: SAP NetWeaver Visual Composer
Ejemplo: SAP NetWeaver Visual Composer
Ejemplo: Yahoo Maps
Ejemplo: Brocade
Ejemplo: Cynergy Systems
INDITEX. Sistema de selección de personal
CASER. Sistema de GESTIÓN DE FACTURAS
CASER. Sistema de Bases Técnicas
CLH. Sistema de Gestión de Indicadores de Negocio
Aplicaciones empresariales Flex-Java.
Arquitectura básica de una aplicación web J2EE
Arquitectura básica de una aplicación Flex-J2EE
La capa de presentación
Genera eventos de dos tipos:
•
•
Eventos de presentación.
¾ No implican un cambio en el “Estado del servidor”.
¾ No implican acceder a las BBDD.
¾ Relación directa con una determinada pantalla.
Eventos de negocio.
¾ Implican acceder a los servicios de negocio.
¾ Implican acceder a las BBDD o servicios externos (servicios web).
¾ Pueden implicar un cambio de estado.
Capa de presentación basada en HTML-Javascript
•
•
Eventos de presentación.
¾ Casi todos viajan al servidor; unos pocos se resuelven con Javascript.
¾ Casi todos implican recarga de página.
¾ La lógica de presentación se sitúa en el servidor.
Eventos de negocio.
¾ Son preprocesados por la capa de presentación en el servidor.
¾ Implican reenvío de página o de componentes de presentación.
Capa de presentación Flex
•
•
Eventos de presentación.
¾ Ninguno viaja al servidor; todos se resuelven en la capa Flex.
Eventos de negocio.
¾ Desde la capa de presentación o aplicación Flex se invoca directamente a
los servicios de negocio.
¾ Únicamente viajan datos.
¾ No es necesario desarrollar ningún componente de presentación para su
ejecución en el servidor.
Acceso a los servicios de negocio desde Flex
•
•
•
•
Se utiliza Flex LifeCycle Data Services o BlazeDS.
El programador puede incluir llamadas a los servicios de negocio desarrollados
en Java directamente desde la aplicación Flex ejecutándose en el navegador.
Flex utiliza el protocolo AMF que empaqueta la invocación y la respuesta en
formato binario sobre HTTP.
Al no viajar componentes de presentación es extremadamente rápido.
Beneficios en el cliente
•
•
•
•
•
"Experiencia de usuario". Sobre todo para aquellos acostumbrados a las
"desktop applications".
"Time-to-Market". Desarrollo rápido, gracias a Flex Builder.
Mínima barrera de entrada para los desarrolladores. Únicamente una herramienta
de desarrollo amigable.
No es necesario maquetadores HTML.
Aumenta drásticamente la capacidad de adaptación de las aplicaciones a los
cambios en los procesos de negocio.
Beneficios en el servidor
•
•
•
•
•
El desarrollo de la parte servidora es extremadamente sencillo.
Se accede a través de un conjunto de servicios "sin estado".
Evitamos la tentación de gestionar transacciones desde la capa de presentación.
Cualquier herramienta Java estándar es suficiente, sin necesidad de complejos
plug-in que gestionen la navegación de pantallas y los componentes de
presentación. (Eclipse).
Evitamos la necesidad de gestionar la sesión en el servidor.
Beneficios en la escalabilidad
•
•
•
•
Evitamos la replicación del estado de la sesión entre los servidores balanceados.
Por tanto, podemos hacer crecer el escalado horizontal indefinidamente,
evitando el escalado vertical.
Los servidores hacen una utilización mínima de memoria. No se mantiene
información entre solicitudes consecutivas.
El número de usuarios concurrentes por servidor aumenta decisivamente.
Beneficios en el rendimiento
•
•
•
Mejor aprovechamiento de la capacidad de procesamiento y memoria de los
equipos de sobremesa.
La mayoría de los eventos de usuario son procesados localmente en el cliente.
Únicamente viajan al servidor los eventos:
¾ Consultan información.
¾ Procesan una transacción de negocio.
Se reduce el tráfico de red. En las aplicaciones web el 80% del tráfico
corresponde a elementos de presentación.
ROI
•
•
El ahorro más importante de deriva de:
¾ Reducción de los equipos de desarrollo.
¾ Reducción del ciclo de vida de desarrollo.
¾ Mejora en la adaptabilidad futura de las aplicaciones.
Otras fuentes de ahorro:
¾ Drástica reducción de los servidores necesarios para la explotación de las
aplicaciones.
¾ Ahorro en las licencias de servidores de aplicaciones.
¾ Al hacerse una utilización menos intensiva del servidor de aplicaciones
puede optarse por plataformas más baratas o incluso open-source.
Puesta en marcha
Evaluación
Workshops técnicos.
Pruebas de concepto.
Proyecto Piloto.
Implantación
Dpto. Arquitectura Tecnológica:
Definición de arquitectura completa.
• Elaboración de estándares.
• Elaboración de plantillas de desarrollo.
• Desarrollo proyectos ejemplo.
Plan de divulgación y formación.
Definición y prestación de servicios a proveedores y factorías.
Quién usa Flex
•
•
•
•
Lista completa de clientes:
¾ http://www.adobe.com/products/flex/customers/customer_list.html
Empresas IT usando Flex:
¾ http://www.infoq.com/news/2007/10/who-is-using-flex
Ejemplos de aplicaciones Flex:
¾ http://www.flex.org/showcase/
Toda la información en la web de Flex:
¾ http://www.adobe.com/products/flex/