google web toolkit introduction michel buffa daprès le ppt original de didier girard –...
Post on 03-Apr-2015
106 Views
Preview:
TRANSCRIPT
Google Web ToolkitIntroductionMichel Buffa d’après le ppt original de Didier Girard – girard.d@sfeir.com04 juillet 2007
Sommaire
• Comment GWT fonctionne ?
• Les fonctionnalités
Composants graphiques plus évolués
• Des composants tous plus beaux les uns que les autres
Serveur sans état
• Client avec état
• Meilleure scalability
ApplicationApplication
IHM+MétierIHM+Métier
+ Session+ Session
Base de donnéesBase de donnéesDonnéesDonnées
Au début, Ajax c’est cool
• C’est beau
• Efficace
• Les clients en redemandent
Les difficultés
• Cross-navigateur
• Fuite mémoire
• Lourdeur du chargement
• Peu de « Docteur es Javascript »
• Pas de bons IDE
• Bug (javascript est un langage interprété)
• Pas de debug
• Sécurité
• …
COMMENT GWT FONCTIONNE ?
L’objectif
• Permettre de développer simplement, des applications
– Cross navigateurs
– Efficaces
– Stables
• Dans un environnement amical pour les développeurs
– Support des IDE, Debugging, refactoring, typage fort,…
L’approche
• Développer en Java
• Compiler le Java en Javascript/CSS
Hello World
• Démonstration
BrowserIE, Firefox, Safari, Opera
BrowserIE, Firefox, Safari, Opera
RWA in JavaRWA in Java
Java Runtime LibraryJava Runtime Library
Architecture
java.langjava.lang
java.utiljava.util
Java.ioJava.io
Code de l’application
GWT GUI LibraryGWT GUI Library
Panels
PopupStack
AbsoluteVertical
…
WidgetsButton MenuBar
Radio TreeCheck Table
TextArea ….
Javascript Application
GWT Runtime100Ko
GWTCompiler
GWTCompiler
TOUR D’HORIZON
Des widgets « 100% java »
• Démonstration (Kitchen Sink)
Support de l’historique
• « Single Page Interface », mais gestion de l’historique !
• Démonstration (Kitchen Sink)
• Le code
History.addHistoryListener(myCommand);
Support de RPC (JSON/XML-RPC)
• AJAX est d’abord une histoire de requêtes asynchrones
– Avec GWT, c’est simple !
Absolute Panel
• Permet de développer efficacement
– Un vrai bonheur !
• Il y a bien d’autres Panel : Grid, Row, Flex, Vertical, Tab,…
Support multi-navigateuret multi-plateforme
• Et ça marche…
Support des CSS
• Tous les composants GWT supportent nativement les CSS
Support du debug
Support de javascript
• JSNI, une API astucieuse
• Beaucoup de bibliothèques de javascript populaires sont déjà « wrappées » : scriptaculous, yui, timeline,…
• Démonstration
public static native void alert(String msg) /*-{ $wnd.alert(msg); }-*/;
Optimisation du code
• Le javascript est optimisé durant la compilation
• Seul le javascript nécessaire est téléchargé par le navigateur
– Javascript pour la plateforme cible
– Seule l’API effectivement utilisée est téléchargée
Très bonne scalabilité
• Avec GWT les serveurs sont stateless
• Il est donc très facile d’augmenter la puissance CPU des serveurs
– Plus de « session affinity »
Des outils
• GWT est supporté par tous les grands IDE Java : Eclipse, NetBeans, IntelliJ IDEA, Jdeveloper,…
• Publicité : GWT Designer pour Eclipse (payant)
La communauté GWT
• Plusieurs millions de téléchargements
• Plusieurs dizaines de millier d’abonnés sur les mailing listes de développeurs
• Des ouvrages
• De nombreux articles/tutoriaux
• Des formations
• Des blogs
GWT 1.7.1 aujourd’hui ! (IE8, FF 3.5, SF 4)
• GWT 1.4
– Par exemple : ImageBundle (téléchargement optimisé d’images), une espèce de base d’images
– Passage de 12 requêtes HTTP à une seule…
ClippedImage timeIcon = new ClippedImage("icons.png", 22, 0, 22, 22);
• GWT 1.5 apporte le support des annotations de code et de la généricité
– Du coup, on peut par exemple passer des classes entity du serveur (java) vers le client (java compilé en javascript)
– Nécessite les sources des annotations
– GWT 1.6 : + de widgets, plugin eclipse officiel
GWT Gears
• Gears permet d’accéder à une base local depuis javascript.
• Il existe une API pour GWT :
– http://code.google.com/p/gwt-google-apis/
26 Google Confidential
GWT est efficace
• Il est couramment admis que développer avec GWT permet d’être plus efficace pour le développement de gros projets de web applications
– Refactoring
– Debugging
– Serveur Stateless
– Cross-navigateurs
– I18N
– Hosted mode
– JSNI
QUELQUES TRUCS
Attention, un langage peut en cacher un autre
• Le code qui s’exécute côté client n’est pas du java, mais du javascript.
• Par exemple « long » n’existe pas en javascript !
29 Google Confidential
LES IDEES REÇUES
Java est nécessaire sur le serveur
• Non, GWT n’impose pas de technologie sur le serveur
• GWT est simplement plus pratique à utiliser avec Java sur le serveur
Le code Javascript généré est difficile à débugger
• Il est possible, via les options du compilateur, d’avoir un code javascript lisible.
Les widgets GWT ? Bof….
• Les widgets GWT sont des widgets de bases.
• Il existe beaucoup de projet qui proposent des widgets évolués
– GWT Ext
– GWT Rialto
– Tatami
– GWT Widget
– GWTaculous
– …
33 Google Confidential
Les applications GWT sont lourdes
• Le code généré est optimisé et gzippable
– La démo Google Showcase pèse 60K !
GWT ne supporte pas l’existant
• Faux
– Il est tout à fait possible d’intégrer des composants GWT dans une page HTML classique.
GWT est propriétaire
• Mais non
– GWT est sous licence opensource Apache depuis la version 1.3 (12/2006)
MISC
• Version de JDK ?
– Codez le code serveur et client en jdk 5/6 mais attention, côté client toutes les classes du SDK ne sont pas re-implémentées (mais la plupart le sont)
• Intégration avec Spring ?
– Facilité depuis GWT 1.4
• Intégration avec Hibernate ?
– Facilité avec GWT 1.5 avec les annotations de code (attention néanmoins : il faut les sources !)
• Intégration avec les EJBs
– Naturel avec les entity beans
– Nécessite un wrapper pour les session beans
– Normalement full support avec GWT 1.5
Misc
• GWT pour mobiles : http://code.google.com/p/gwt-mobile-webkit/
• GWT on the Wave : http://code.google.com/p/cobogwave/
• GWT-gdata : accèder aux APIs Google depuis GWT (youtube, google map, search, calendar, etc.) : http://code.google.com/p/gwt-gdata/
38 Google Confidential
Ressources
GWT :http://code.google.com/webtoolkit/
Forum pour les développeurs :http://groups.google.com/group/Google-Web-Toolkit
Blog officiel : http://googlewebtoolkit.blogspot.com/
onGWT, Tracking news on GWT : http://www.ongwt.com/
top related