Gwt I - entendiendo gwt

GWT, Google Web Toolkit
Parte 1: Entendiendo GWT

Manuel Carrasco Moñino
Seminarios de JavaHispano (16-Abril-2010)
manolo@apache.org

Acerca de Mí
 Licenciado en Farmacia e Ingeniero de Telecomunicaciones.
 Enganchado a los sistemas desde 2002, y a Internet desde 2005
 Experto en sistemas críticos, seguridad, redes y comunicaciones, empecé a
apasionarme por el software hace 5 años.
 Programador de cualquier cosa (asm, c, c++, shell, tcl-tk, dbase, vb,
javascript, perl, ruby, groovy, Java ...)
 Enamorado de Linux.
 Fanático de TDD y las filosofías ágiles.
 Aficionado al Opensource
– Creador de proyectos como mcmWebmail, powerFax, Lxp, y librerías como
gwtUpload, gwtChismes...
– Contribuciones a jetty, apache, ruby, perl, icewm, webmin, linux, uucp,
mgetty, postfix ...
– Contribuidor de Gwt
– Committer de Hudson (Performance, Emma, Spanish Translation)
– Miembro de la Apache Software Foundation (James y Hupa).
 Pero... mi gran pasión es la música folk (me podéis llamar hortera :-)

 He trabajado para Azkar, Intelligent Data, Cibernos, Lucent, Multiasistencia,
COATM, mirai, Yell ....
 Actualmente trabajo como Arquitecto de Sistemas y Sofware en Paradigma
Tecnológico.

Entendiendo GWT
¿Qué es, y qué no es?

Misión de GWT

To radically improve
the web experience for users
by enabling developers
to use existing Java tools
to build no-compromise Ajax
for any modern browser

Mejorar radicalmente la experiencia web de los usuarios al permitir a
los desarrolladores utilizar las herramientas de Java para hacer
Ajax (no comprometido), para cualquier navegador moderno.

¿Qué NO es GWT?


No es una librería más con utiliades
Javascript (jquery, prototype ...)

No es una librería de widgets (ext,
scriptaculous, yui ...)

No es un framework (mootools, dojo ...)

No es 'exclusivamente' un kit para crear
aplicaciones RIA.

¿Qué es GWT?
 Generador de javascript: convierte código java a javascript.
− Es un compilador
− Es un linker
− Es un optimizador completo (no sólo compresión y ofuscación)
− Es un SDK
 El código generado puede incluirse en cualquier html (estático o
dinámico), y puede interaccionar con éste (modificar el DOM,
ejecutando AJAX, validando forms ...).
 Proprorciona además un conjunto de herramientas para testear, depurar,
etc ..
 Proporciona un conjunto de módulos cliente: DOM, XML, I18N,
JSON, RPC, y Widgets básicos.
 Y... mucho mas (css sprite, image bundling ...)

 Es código java para la máquina virtual 'browser' en lugar de 'jre'

Ventajas de usar un compilador frente a
escribir javascript a mano

ASM sustituido por C, C++, GJC ...
Javascript sustituido por Java, ? ...

Alto nivel: Java 
Alto Nivel: C/C++
− <inherits − #include
− <replace-with − #define
− Inline JS native code − Inline ASM native code
− Compiler − Compiler
− Optimizer − Optimizer
− Linker − Linker
− Javascript para cada − Ensamblador para cada
navegador procesador
− Advanced IDE and tools − Advanced IDE and tools
for testing, debuging for testing, debuging

¿Porqué un compilador?


Separar la mantenibilidad del código de la efectividad del
ejecutable.

El javascript escrito a mano tiene un conflicto de
intereses:
− Identificadores largos y legibles = aplicaciones grandes y lentas.
− Buen Formato = aplicaciones grandes y lentas.
− Comentarios = aplicaciones grandes y lentas

La solución no es buscar convenciones en el código javascript
escrito a mano, es crear un nivel de separación para que no se
comprometan ambas (mantenibilidad, efectividad).

Muchos de los errores mas comunes (sintaxis, errores de
tipadom etc) son fácilmente corregibles en tiempo de
compilación en lugar de en tiempo de ejecución.

¿Porqué Java?

La sintaxis javascript es más próxima a java que en otros
lenguages, por lo que es mas facil la transformación de
java que de otros lenguages (perl, ruby, php ...).

Muchas herramientas Java para desarrollo.

El chequeo de tipos de java incrementa la productividad
porque reduce errores.

Asistencia en la escritura de código.

Refactoring de verdad.

Diseño, patrones, OO, hacen mas fácil de comprender el
código y las llamadas AJAX, con mucho menos
documentación.

Y... TDD

GWT nos facilita

Versionado de ficheros (para cada compilación)

Sólo lo necesario para cada navegador y lenguaje. Descarga sólo lo que se usa.

Eliminar código no usado (sólo las clases, y métodos utilizados).

Código ofuscado, comprimido y optimizado.

Los ficheros pueden ser cacheados para siempre.

Ejecución más rápida pero con código legible.

Herramientas para Test y Debug.

Librerías de lado servidor (RPC java)

Mismos objetos Servidor <=> Cliente

Deja a GWT hacer las cosas que tenemos que hacer a mano, o que dejamos de
hacer por desconocimiento, complejidad, etc.
− Selección e inclusión de librerías en la página.
− Herramienas de optimización
− Herramientas de ofuscación
− Versionado de ficheros para publicar.
− Mantenimiento de versiones legibles/ilegibles del código.
− Configuración http para enviar información de caché

¿Rendimiento?

JavaScript
− GWT genera código mucho más pequeño que el que podamos
escribir a mano. A diferencia de las aplicaciones tradicionales en
javascript, Gwt analiza tu código e incluye exclusivamente lo
necesario para cada navegador.
− Pudiera no ser más rápido, pero sí mas eficaz

Usuario
− Las aplicaciones GWT son normalmente más rápidas que las escritas a
mano, y normalmente requieren menos trucos HTTP. Gwt elimina el
uso envoltorios para funcionalidades incluidas nativamente en esa
versión de navegador.

Desarrollo
− Con el ahorro del tiempo invertido en depurar los problemas en cada
navegador, puedes emplear mucho mas tiempo en la funcionalidad de
tu aplicación. La eficiencia en el desarrollo es la parte favorita en Gwt.

Componentes GWT

Libreria emulada JRE:
− java.util
− java.lang

GWT librería Core
– JSON, XML, RPC
– DOM, UI, I18N

Compiler, Optimizer, Linker

Herramientas para desarrollo:
− Scripts de utiliad:
− webAppCreator, i18nCreator
− Testing library (GWTestCase, HtmlUnit)
− Customized App Server: Jetty/Tomcat
− Eclipse Plugin
− Browser plugin
− Speed Tracer (extensión para chrome)

¿Y qué más?

Historia de navegación (Botón atras, adelante)

ClientBundle: permite agrupar y manipular recursos en tiempo de compilación
(Imágenes, Optimización de Css, Sprite, lenguages …)

UIBinder: lenguage declarativo y extensivo para construir interfaces de usuario.
Injecta constructores en el código Java, y genera HTML en tiempo de
compilación.

Code split: fragmenta el código javascript en partes para que sean cargadas
asíncronamente.

LayoutPanels: comportamiento predecible de la disposición de elementos.

Compresión: Utiliza las mas avanzadas técnicas de compresión conocidas.

Gestor de Eventos y Schedule propios, sin memory leaks.

JSNI (JavaScript Native Interface)

SOYC (Story of your compile)

Actividad GWT

Comunidad muy activa:
– GWT-users cien mensajes diarios
– GWT-contributors (lista moderada) 10 mensajes diarios

Desarrollo
– Grupo de committers limitado
– Decenas de contributors
– Exhaustiva revisión de código
– Tests muy exigentes
– Elevada calidad de código (javadocs, codstyle …)
– Excelentes desarrolladores.

Documentación
– Muy bien explicado
– Muy Actualizada

Cientos de librerías

Google.

GWT no hace posible nada que no fuera posible hacer de otra manera, pero sí
hace que la acción sea mucho mas productiva.

GWT no intenta ensalzar las virtudes de Java, sino reconocer el pragmatismo de
las herramientas existentes, IDEs, entornos de prueba, tipos, etc.

GWT no quiere hacernos olvidar DOM, CSS, navegador, etc, sino permitir
escribir abstracciones de todo ello y hacernos mas productivos que
escribiendo código JS a mano.

Posiblemente, algún día GWT será capaz de compilar otros lenguages, o incluso
procesar JS con anotaciones de tipos.

GWT hace productivo y posible el desarrollo de sitios webs de gran escala y
abre la posibilidad de crear aplicaciones de nueva generación de manera
fiable.

Ray Cromwell

Preguntas

Manuel Carrasco Moñino

http://manolocarrasco.blogspot.com
twitter.com/dodotis

manolo@apache.org

Gwt I - entendiendo gwt

Más contenido relacionado

La actualidad más candente (20)

Destacado (8)

Similar a Gwt I - entendiendo gwt (20)

Más de Manuel Carrasco Moñino (20)

Gwt I - entendiendo gwt