View
621
Download
2
Category
Preview:
DESCRIPTION
Présentation Ippon Technologies REX GWT 2.0 du jeudi 10/06/2010www.ippon.frblog.ippon.fr
Citation preview
Open-REX - GWT 2.0
10/06/2010 David Laurent
• Cette présentation vous est fournie sous licence Creative Commons Attribution Share Alike
• Vous êtes libres : o De reproduire, distribuer et communiquer cette création au public
• Selon les conditions suivantes : o Paternité. Vous devez citer le nom des auteurs originaux mais pas
d'une manière qui suggérerait qu'ils vous soutiennent ou approuvent votre utilisation de l'œuvre.
o A chaque réutilisation ou distribution de cette création, vous devez faire apparaître clairement au public les conditions contractuelles de sa mise à disposition sous licence identique Creative Commons Share Alike.
o Chacune de ces conditions peut e o Rien dans ce contrat ne diminue ou ne restreint le droit moral de
l'auteur ou des auteurs.
Retour d'expérience
• Application comptable Carrefour o Gestion de campagne marketing o < 50 utilisateurs o GWT basé sur GXT
• Application de vente FranceBillet / Fnac o Guichet de vente du réseau de billetterie o > 10000 utilisateurs / jour o + de 1000 points de vente magasin o Infrastructure hétérogène ≠ réseaux de commercialisation
navigateurs, tailles d'écran, écran guichet + écran client o Réelles contraintes de performances o Objectifs de charge de 100 000 réservations / heure o GWT only
• Expérience utilisateur ... UI + Vitesse !
And now ... :-) :-| :-( Points abordés��� • Introduction / Performances / Architecture / Tests • Compilation de bonnes pratiques Google IO + GTAC en // mises en oeuvre terrain • Démos sur la base des samples du GWT SDK
Google IO 2009 • Measure in Milliseconds: Performance Tips for • Google Web Toolkit Architecture: Best Practices For Architecting Your GWT App
Google IO 2010 • Measure in milliseconds redux: Meet Speed Tracer • Architecting for performance with GWT • Architecting GWT applications for production at Google
Google Test Automation Conference 2009 • Even better than the real thing : Lessons learned from testing GWT applications • Selenium: to 2.0 and Beyond!
Google Web Toolkit • GWT "Manifesto" / les designs axioms (2006)
o L'expérience utilisateur est primordiale o Simplifier le développement d'applications AJAX
Java debugging non-négociable, ... o Les principaux composants doivent être utiles indépendamment
Widgets, RPC disponibles mais non obligatoires, ... Le compilateur Java-to-Javascript est utile sans les libs gwt-user
o Interopère avec l'existant Protocoles autres que RPC, pour coopérer les composants n'ont pas
besoin d'un serveur spécifiquement GWT Rendu avec CSS
o Faciliter la réutilisation de code AJAX partage de composants et d'applications entières via JARs
o Optimiser de façon agressive les performances Ne pas faire à l'exécution ce que l'on peut faire à la compilation
o Proposer la sécurité par défaut Ne pas exposer les services automatiquement
Des apps AJAX écrites en JAVA
Exemples introductifs • EntryPoint, Widgets, Module, GWT, Service RPC
Exemples introductifs • Handler, Event, ServiceAsync RPC
Démos #1
• Exemples du SDK o Sample Hello o Sample Mail (versions antérieures à GWT 2.0) o Sample Mail (version 2.0 et au delà)
• InspectorWidget o inspecter rapidement le nb de widget d'un état du DOM o inspecter rapidement la nature des widgets
Démarrage
#1 Concevoir pour les perfs • La vitesse compte!
• Limites de temps de réponse o 0.1 secondes : impression d'instantanéité o 1 seconde : impression d'ininterruption o 10 secondes : maintient de l'attention
• Points de contention d'une application 1. Démarrage 2. Récupération des données 3. Calcul de rendu, Affichage 4. Interactions utilisateur
#1 Démarrage
#1 Démarrage optimisé
#1 Récupération des données • Pièges à éviter
o trop de requêtes HTTP o récupérer des données dont on a pas besoin
• Principes o concevoir des interfaces RPC avec précaution
interfaces côtés serveur adaptées à l'UI les services génériques amènent à requêtes +
données non nécessaires o récupérer que ce dont on a besoin o attention aux types qui sont sérialisés avec RPC o grouper si possible les requêtes (batch requests)
#1 Calcul de rendu, Affichage • Pièges à éviter
o créer des composants trop tôt o lorsque ce n'est pas nécessaire o associer les données aux widgets
• Principes o Utiliser le LazyPanel o Savoir quand utiliser des widgets : events ? parent ? o Comment éliminer des widgets
Utiliser UiBinder pour remplacer les widgets / HTML Utiliser le pattern Flyweight pour listes, tables et tree
o UiBinder : templates d'HTML et de Widgets (+ simple) utiliser HTML autant que possible utiliser des CSS optimisées avec CssRessource
les règles CSS les + simples = + rapides
#1 Interactions utilisateurs
• Une intéraction utilisateur doit être inférieure à 100 ms
• Handler trop long à répondre bloque le thread (unique) JS
• Evénements ne peuvent être intercepté si JS en exécution
• Deffered Command, Incremental Command
• Le Layout est plus rapide avec les LayoutPanels
Démos #2
• Exemples du SDK o Sample Showcase (Chargement à la demande) o Sample Simple RPC o Sample Simple RPC modifié en deRPC
• Mesure des performances avec SpeedTracer o Comparaison Simple RPC / deRPC o à suivre en 2010 dans la version 2.1 :
SpeedTracer côté serveur et ... SpeedTracer en Intégration Continue
identifier les regressions de perfs au commit
#2 Architecture : Principes
• "Le test logiciel ne consiste pas à écrire des tests mais ... des logiciels testables"
• Quels sont les principes de structuration énoncés pour les applications GWT?
• Le principe fondamental : o isolation / séparation des responsabilités
#2 Bonne / mauvaise isolation
#2 Mauvaise isolation + Code natif
#2 Séparation des responsabilité
#2 Model View Presenter
#2 Model View Presenter
Martin Fowler l'entomologiste du pattern énonce :
o Passive View : "A screen and components with all application specific behavior extracted into a controller so that the widgets have their state controlled entirely by controller." ... "A Passive View handles this by reducing the behavior of the UI components to the absolute minimum by using a controller that not just handles responses to user events, but also does all the updating of the view. This allows testing to be focused on the controller with little risk of problems in the view.”
o Presenter : "The view of MVP is a structure of these widgets. It doesn't contain any behavior that describes how the widgets react to user interaction. The active reaction to user acts lives in a separate presenter object. The fundamental handlers for user gestures still exist in the widgets, but these handlers merely pass control to the presenter. The presenter then decides how to react to the event"
Démos #3 • Exemples GWT Docs
o Sample Contacts 1
• Webdriver / Selenium 2
• Tests de charges serveur o junit + contiperf + gwtrpc4j
Future ... GWT 2.1
• MVP refactorisation o Model : RequestFactoryServlet, Record, SyncRequest o Presenter : ActivityManager, Activity o View : EditorSupport
• Améliorations Widget Library o CellWidgets
Recommended