Desarrollo multiplataforma de apps con GWT y PhoneGap

1,557 views
1,349 views

Published on

Transparencias de la charla de Luis Muñoz @munozluis en el primer Betabeers Córdoba, sobre desarrollo multiplataforma de apps móviles, usando Google Web Toolkit (GWT) y Phonegap (Apache Cordova)

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,557
On SlideShare
0
From Embeds
0
Number of Embeds
64
Actions
Shares
0
Downloads
37
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Desarrollo multiplataforma de apps con GWT y PhoneGap

  1. 1. DESARROLLOMULTIPLATAFORMA DE APPS CON GWT Y PHONEGAP Betabeers Córdoba 27/9/2012 GWT
  2. 2. MI TIMELINE1996 2001 2002 2005 2006 2007 2010 2012
  3. 3. EL MOMENTO QUE LO CAMBIÓ TODOJulio 07 Noviembre 07
  4. 4. LA TECNOLOGÍA MÁS PENETRANTE DE LA HISTORIA
  5. 5. TODAVÍA NO SE CONOCEN LAS IMPLICACIONES We#do#not#currently#directly#generate#any# meaningful# revenue# from# the# use# of# F a c e b o o k# m o b i l e# p r o d u c t s ," [ … ] ." Accordingly," if" users# continue# to# increasingly# access# Facebook# mobile# products# as# a# substitute# for# access# through# personal# computers," […]" our" revenue" and" financial" results" may" be" negatively"affected.< The" decrease" in" the" average" cost? per?click" paid" by" our" advertisers" was" driven" by" various" factors.. [ i n c l u d i n g ]" t h e# c h a n g e s# i n# platform#mix#due#to#traffic#growth# in# mobile# devices," where" the" average" cost?per?click" is" typically" l o we r" c o m p a r e d" t o" d e s k t o p" computers"and"tablets.<
  6. 6. SÓLO MÓVIL “Lo que menos me importa es la página web, lo más importante para mí es el entorno móvil”
  7. 7. PERO EL DESARROLLO PARA MÓVILES ES COMPLICADO
  8. 8. APPS NATIVAS VS. MOBILE WEB VS. HÍBRIDAS
  9. 9. FRAMEWORKS HÍBRIDOS Mono Touch
  10. 10. PHONEGAP Phonegap (Core APIsHTML5 + CSS3 + JS Target platforms + Plugins)
  11. 11. CÓMO ES EN IOS?
  12. 12. CÓMO ES EN ANDROID?
  13. 13. PHONEGAP CORE API
  14. 14. EJEMPLO
  15. 15. PHONEGAP PLUGINS 4657
  16. 16. EJEMPLO
  17. 17. DEBUGGING?iOS: iWebInspector
  18. 18. DEBUGGING?Android, iOS: Weinredebug.phonegap.com
  19. 19. QUÉ UTILIZAR PARA LA UI?• HTML5 + CSS3 + JS• AJAX 100%• No olvidarse del servidor• Ni de la “performance” y limitaciones en el móvil• Simular el Look & Feel de la plataforma• Open Source con amplia comunidad• Otrascaracterísticas: facilitar la depuración, el testeo, incrementar la productividad, etc.
  20. 20. ALGUNAS ALTERNATIVAS
  21. 21. EL PROBLEMA CON JAVASCRIPT...
  22. 22. WTFJS.COM
  23. 23. GWT• Introducido por Google en 2006• Compila Java a Javascript• Soporta todos los principales navegadores* • También los móviles (Webkit)• Usado en producción por Google en numerosos proyectos • Google Adwords, Android Play, Google Groups...• Rencientemente Google ha liberado la dirección del proyecto*
  24. 24. GWT EN MODO DE DESARROLLO
  25. 25. EJEMPLO
  26. 26. WIDGETS
  27. 27. Y SI HAY DISEÑADORES? UIBINDER
  28. 28. “DEFERRED BINDING”
  29. 29. GWT.XML
  30. 30. INTERNACIONALIZACIÓN (I18N)• Construido sobre “Deferred binding” • Se genera una permutación adicional por idioma • Muy potente: plurales, mensajes por defecto, RTL...• Incrementa el tamaño de la compilación
  31. 31. CSS COMPILADOConstantes:Condiciones (perfecto para emular L&F según la plataforma): Recursos: Sprites:
  32. 32. SERVIDOR: GWT-RPC
  33. 33. PROBLEMAS CON GWT-RPC• GWT-RPC “marca” los objetos serializables con un hash MD5• Siel servidor detecta una discrepancia al deserializar lanza una excepción • Consecuencia: No soporta clientes con versiones antiguas
  34. 34. JSNI (JAVASCRIPT NATIVE INTERFACE)
  35. 35. M-GWT
  36. 36. GWT-PHONEGAP
  37. 37. LO QUE IMPORTA: LA COMPILACIÓN• Al final, tenemos que compilar la versión de producción y GWT es perfecto: • Elimina código muerto y css no utilizado • Optimiza, ofusca y comprime el JS • Optimiza el css (image inlining) • Consolida los ficheros (JS/CSS/HTML) • Mecanismo de caché • Análisis del resultado de la compilación (SOYC)
  38. 38. COSAS QUE ME HE DEJADO• Google plugin for Eclipse • GWT Designer• Integración GWT - Google app engine• Speed tracer• Mayor integración Javascript - JSON: Javascript Overlay Types• Seguridad: Anti XSS• Request factory • Libreria de comunicaciones basada en JSON con versión Android• Librerías específicas JUnit• Code splitting• MVP Framework• GWT superavanzado • GWT super dev mode • Elemental - “to the metal” HTML5 bindings
  39. 39. PROBLEMAS CON GWT• Curva de aprendizaje compleja• No soporta todo el JRE• Algunas características pueden ser contraproducentes en desarrollo móvil • Deferred binding + I18N • GWT-RPC• Desde que salió, se duda del soporte que Google le presta • Roadmap oscuro • Peor desde que se anunció Dart • Quizás el problema es que Java ha dejado de ser “cool”• Mantenimiento del modo de desarrollo• Mantenimiento de las apis de Google, HTML5
  40. 40. GWT + PHONEGAP Java Phonegap (Core APIsHTML5 + CSS3 + JS Target platforms + Plugins)
  41. 41. DUDAS / PREGUNTAS?
  42. 42. GRACIAS! luis@serendipio.comhttp://es.linkedin.com/in/lumunoz @munozluis

×