SlideShare une entreprise Scribd logo
1  sur  30
Télécharger pour lire hors ligne
@samijaber#GWT
Le retour en force de GWT
@samijaber#GWT
Speaker
@samijaber
@samijaber#GWT
Le retour en force de GWT
• Plus que jamais une techno d’avenir
• Les nouveautés de GWT 2.7
• Les applications hybrides
• Les performances
• GWT 2.8
• Support de Java 8, JSInterop
• Elemental, Mobile, Collections…
• Singular
@samijaber#GWT
On m’a dit que GWT était mort ?
• Technologie retenue pour Google Inbox (Gmail V2)
• Technologie retenue pour Google Spreadsheet
• Mais aussi AdWords, Google Groups, Hotel Finder,
Moderator, Google Flight, Google Checkout, Gerrit, Angry
Birds, Google Web Font, Google Blogger, Google Offers,
Google TakeOut, Google PageSpeed, Fusion Table, App
Script Editor …
• Et en dehors de Google ?
http://www.gwtproject.org/developer_spotlight.html
@samijaber#GWT
Nouveau logo, nouveau site
• Un nouveau logo et un nouveau site (intégrant la
documentation) ont été créés cette année
• Une communauté de plus de 100.000 utilisateurs à travers
le monde
• Des grands noms de l’industrie Google, Redhat, …
@samijaber#GWT
Nouveau site Web
http://www.gwtproject.org
@samijaber#GWT
Les performances ?
856
736
GWT
JS
223
213
GWT
JS
1031
638
GWT
JS
796
820
GWT
JS
DeltaBlue
Splay
RayTrace
Richards
Benchmark Octane (V8)
Exécutions par seconde
Source : https://plus.google.com/111111598146968769323/posts/7LRV7hBKgGH
@samijaber#GWT
En taille de code généré ?
@samijaber#GWT
La version actuelle ?
• GWT 2.7 sortie en Décembre 2014
• Nouveauté majeure : SuperDevMode, la compilation
JavaScript instantanée (Compile on Refresh)
• Intégration avec SourceMap
• Eclipse : SDBG
• IntelliJ : Natif
• Bug fixes + améliorations des performances (String,
Arraylist, Hashmap, ….)
@YourTwitterHandle@YourTwitterHandle@samijaber#gwt
Di, ci pas li dimo mitinant?
@samijaber#GWT
JSInterop
• S’intégrer à JavaScript n’a jamais été aussi simple
function SomeType(){}
SomeType.prototype.doStuff =
function(){};
SomeType.prototype.value = 3;
@JsType
interface SomeType {
void doStuff();
@JsProperty
int value();
@JsProperty
SomeType value(int v);
}
@samijaber#GWT
Héritage JavaScript/Java
• Une classe GWT s’intègre dans la chaîne d’héritage
JavaScript sans contrainte
@samijaber#GWT
WebComponent
• Avec JSInterop, GWT bénéficiera des Framework
JavaScript disponibles : Polymer, Etag, …
<script src=”/polymer/webcomponentsjs/webcomponents.js”></script>
<import rel=”import” href=”/polymer/paper-elements/paper-elements.html” />
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
xmlns:gwt='urn:import:com.google.gwt.user.client.ui'>
<gwt:HTMLPanel>
<paper-button ui:field=”button” raised=””>Click me!</paper-button>
</gwt:HTMLPanel>
</ui:UiBinder>
@YourTwitterHandle@YourTwitterHandle@samijaber#gwt
Di, ci pas li dimo mitinant?
@samijaber#GWT
Elemental mon cher ami
• JAR permettant d’utiliser en JAVA les dernières
fonctionnalités de HTML 5
• Extrait les définitions WebIDL du standard et génère les
fichiers JSInterop (et la javadoc)
• Plus qu’à ouvrir son IDE et à utiliser en Java « Push
Notification » « FullScreen », « WebStorage », « Offline »
ou « WebRTC »
@samijaber#GWT
Exemple
Window $win = Browser.getWindow();
$win.newEventSource(“http://...”).setOnMessage(e->...);
$win.newSpeechRecognition().start();
$win.newFileReader().readAsDataURL(...);
$win.getComputedStyle(e, null).getPropertyValue();
$win.getOpener().postMessage(...);
$win.getConsole().log(...);
$win.getHistory().pushState(...);
$win.getPerformance().getNow();
$win.getCrypto().getRandomValues(...);
$win.getUserMedia()
@samijaber#GWT
GSS
• Google Style Sheets
• Support et Extension de CSS3 (un peu comme Less ou
Sass)
• Possibilité d’utiliser des variables, des conditions, mixins
• Minification/compilation, RTL, réduction des styles non
utilisés
• Remplace CssResource (conversion à la volée de vos Css
vers Gss)
@samijaber#GWT
Exemple GSS
Génère
Style.gss
Style.css
<set-configuration-property name=CssResource.enableGss value=true />
@samijaber#GWT
Evalué à la compilation
• Les fonctions et conditions sont évaluées à la compilation
• On n’embarque que ce qui est nécessaire au navigateur
utilisé
@samijaber#GWT
GWT 2.8
• Supportera Java 8
• JsInterop en version 1
• Une meilleure expérience de debug
• Le support de GSS par défaut
• La compilation encore plus rapide
• Des collections encore plus rapides
@samijaber#GWT
Support du JDK 8
• Lambdas, référence de méthode & méthodes par défaut
(defender methods)
• Imp. des méthodes dans l’interface (méthodes statiques
aussi) + support de java.util.functional
interface MaClasse {
default void run() {
System.out.println(get());
}
static void accept(int value) { … }
String get() { … }
}
MaClasse example = () -> “Les lambdas c’est
génial !”;
Runnable r = example::run;
r.run(); // Affiche “Les lambdas c’est génial !”
@samijaber#GWT
Des collections plus rapides
• Optimisation des collections : ArrayList.get(i)
• Intégration plus étroite avec les types natifs JS (plutôt que
de passer par des itérateurs)
• Annotation @IterateAsArray
• Elimination de l’auto-boxing
• Mapping du type java.lang.Number vers le type natif
number de JS
• Utilisation des types natifs JS de ES6 (Map et Set)
@samijaber#GWT
Comparaison avec JS
• Java aussi concis que JavaScript
Java 7
Runnable task = new Runnable() {
@Override
public void run() {
doSomething();
}
};
Javascript
var task = function() { doSomething() }
Java 8
Runnable task = () -> doSomething();
Javascript
var task = function() { doSomething() }
@samijaber#GWT
Service Workers & DeltaJS
• Un client possède la version 1.2 de son application, il
demande la dernière version (1.3 située sur le serveur)
• Le serveur calcule un VCDIFF et envoie le patch
correspondant seulement au delta entre la 1.2 et 1.3
• Le Client met en cache en local la nouvelle version et
lance l’application
• Utilisé par Inbox
• Support de ES6
@samijaber#GWT
GWT 3.0
• Attention, quelques ruptures de compatibilité (aucune
rupture majeure depuis presque 10 ans!)
• JSInterop V2
• Elemental V2
• Ancien DevMode supprimé
• Collections encore plus rapides
• Support de DeltaJS, ServiceWorker
• Support de ES6 (modules, classes,…)
@samijaber#GWT
AngularJS
• Les avantages d’AngularJS : Productivité, Structuration du
code, MVC
• Les inconvénients : les performances, le scan permanent
du DOM au runtime, la boucle de $digest, difficile
d’optimiser le fonctionnement via un compilateur
• Réponse de Google => Singular
@samijaber#GWT
Qu’est-ce que Singular ?
• Pas un portage d’Angular en Java
• Réécriture complète d’un Framework Java basé sur
certains concepts d’Angular
• Parsing des templates à la compilation
• Résolution des directives à la compilation
• Pas de Dirty Checking
• Tire partie du compilateur GWT pour réduire la taille des
scripts
• Monte en charge pour les grosses applications
@samijaber#GWT
Singular
• API cross-plateformes
• Un template UI par
plateforme
• Web => HTML
• Android => Fichiers XML
• iOS => UiBuilder
• Partage des controleurs
sur toutes les plateformes
@YourTwitterHandle@YourTwitterHandle@YourTwitterHandle#YourSessionHashtag
En résumé
@YourTwitterHandle@YourTwitterHandle@YourTwitterHandle#YourSessionHashtag
Q & A

Contenu connexe

Tendances

Le futur de AngularJS (2.0)
Le futur de AngularJS (2.0)Le futur de AngularJS (2.0)
Le futur de AngularJS (2.0)Clément Dubois
 
Intégration continue & Qualité logicielle
Intégration continue & Qualité logicielleIntégration continue & Qualité logicielle
Intégration continue & Qualité logicielleDavid Buros
 
Apéro techno node.js + AngularJS @Omnilog 2014
Apéro techno node.js + AngularJS @Omnilog 2014Apéro techno node.js + AngularJS @Omnilog 2014
Apéro techno node.js + AngularJS @Omnilog 2014Yves-Emmanuel Jutard
 
De Google+ à twitter en passant par le Cloud
De Google+ à twitter en passant par le CloudDe Google+ à twitter en passant par le Cloud
De Google+ à twitter en passant par le CloudNicolas FRANCOIS
 
Comparatif des frameworks js mv
Comparatif des frameworks js mvComparatif des frameworks js mv
Comparatif des frameworks js mvMael Monnier
 
NodeJS for Mobile App
NodeJS for Mobile AppNodeJS for Mobile App
NodeJS for Mobile AppHabib MAALEM
 
comprendre angularJS en 10 minutes
comprendre angularJS en 10 minutescomprendre angularJS en 10 minutes
comprendre angularJS en 10 minutesDavid Bo
 
Introduction au Framework AngularJs
Introduction au Framework AngularJsIntroduction au Framework AngularJs
Introduction au Framework AngularJsRadhoueneRouached
 
AngularJS - Présentation (french)
AngularJS - Présentation (french)AngularJS - Présentation (french)
AngularJS - Présentation (french)Yacine Rezgui
 
Débuter avec Rails::API & AngularJS
Débuter avec Rails::API & AngularJSDébuter avec Rails::API & AngularJS
Débuter avec Rails::API & AngularJSFrédéric DUPERIER
 
Comment créer une application Angular performante ?
Comment créer une application Angular performante ?Comment créer une application Angular performante ?
Comment créer une application Angular performante ?Sébastien Ollivier
 
CocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrente
CocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrenteCocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrente
CocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrenteCocoaHeads France
 
Introduction à Angular 2
Introduction à Angular 2Introduction à Angular 2
Introduction à Angular 2Laurent Duveau
 
Angular + JHipster @ Paris JUG
Angular + JHipster @ Paris JUGAngular + JHipster @ Paris JUG
Angular + JHipster @ Paris JUGWilliam Marques
 
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)Café Numérique Arlon
 

Tendances (20)

Le futur de AngularJS (2.0)
Le futur de AngularJS (2.0)Le futur de AngularJS (2.0)
Le futur de AngularJS (2.0)
 
Introduction à Vaadin
Introduction à VaadinIntroduction à Vaadin
Introduction à Vaadin
 
Angular retro
Angular retroAngular retro
Angular retro
 
Intégration continue & Qualité logicielle
Intégration continue & Qualité logicielleIntégration continue & Qualité logicielle
Intégration continue & Qualité logicielle
 
Apéro techno node.js + AngularJS @Omnilog 2014
Apéro techno node.js + AngularJS @Omnilog 2014Apéro techno node.js + AngularJS @Omnilog 2014
Apéro techno node.js + AngularJS @Omnilog 2014
 
De Google+ à twitter en passant par le Cloud
De Google+ à twitter en passant par le CloudDe Google+ à twitter en passant par le Cloud
De Google+ à twitter en passant par le Cloud
 
Comparatif des frameworks js mv
Comparatif des frameworks js mvComparatif des frameworks js mv
Comparatif des frameworks js mv
 
NodeJS for Mobile App
NodeJS for Mobile AppNodeJS for Mobile App
NodeJS for Mobile App
 
comprendre angularJS en 10 minutes
comprendre angularJS en 10 minutescomprendre angularJS en 10 minutes
comprendre angularJS en 10 minutes
 
Introduction au Framework AngularJs
Introduction au Framework AngularJsIntroduction au Framework AngularJs
Introduction au Framework AngularJs
 
AngularJS - Présentation (french)
AngularJS - Présentation (french)AngularJS - Présentation (french)
AngularJS - Présentation (french)
 
Retour d'experience projet AngularJS
Retour d'experience projet AngularJSRetour d'experience projet AngularJS
Retour d'experience projet AngularJS
 
Débuter avec Rails::API & AngularJS
Débuter avec Rails::API & AngularJSDébuter avec Rails::API & AngularJS
Débuter avec Rails::API & AngularJS
 
Comment créer une application Angular performante ?
Comment créer une application Angular performante ?Comment créer une application Angular performante ?
Comment créer une application Angular performante ?
 
CocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrente
CocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrenteCocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrente
CocoaHeads Toulouse - Marc Boudou / FreezySnail - Programmation concurrente
 
Introduction à Angular 2
Introduction à Angular 2Introduction à Angular 2
Introduction à Angular 2
 
Introduction à Angular 2
Introduction à Angular 2Introduction à Angular 2
Introduction à Angular 2
 
Angular + JHipster @ Paris JUG
Angular + JHipster @ Paris JUGAngular + JHipster @ Paris JUG
Angular + JHipster @ Paris JUG
 
iTunes Stats
iTunes StatsiTunes Stats
iTunes Stats
 
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
Café Numérique Arlon S03#02: Je code mon blog (EU code week Arlon)
 

En vedette

Migration de Tomcat vers Vert.x
Migration de Tomcat vers Vert.xMigration de Tomcat vers Vert.x
Migration de Tomcat vers Vert.xFlorianBoulay
 
Les Streams sont parmi nous
Les Streams sont parmi nousLes Streams sont parmi nous
Les Streams sont parmi nousJosé Paumard
 
How to fail at benchmarking?
How to fail at benchmarking?How to fail at benchmarking?
How to fail at benchmarking?Pierre Laporte
 
[DevoxxFr] Savoir faire le deuil de son code
[DevoxxFr] Savoir faire le deuil de son code[DevoxxFr] Savoir faire le deuil de son code
[DevoxxFr] Savoir faire le deuil de son codeElleneDijoux
 
API Asynchrones en Java 8
API Asynchrones en Java 8API Asynchrones en Java 8
API Asynchrones en Java 8José Paumard
 
Introduction à GWT
Introduction à GWTIntroduction à GWT
Introduction à GWTArcbees
 
Migrating from Ext GWT 2.x to 3.0
Migrating from Ext GWT 2.x to 3.0Migrating from Ext GWT 2.x to 3.0
Migrating from Ext GWT 2.x to 3.0Sencha
 
Introduction aux web components
Introduction aux web componentsIntroduction aux web components
Introduction aux web componentsFrancois ANDRE
 
Using UIBinder with Ext GWT 3.0
Using UIBinder with Ext GWT 3.0Using UIBinder with Ext GWT 3.0
Using UIBinder with Ext GWT 3.0Sencha
 
GWT.create 2013: Themeing GWT Applications with the Appearance Pattern
GWT.create 2013: Themeing GWT Applications with the Appearance PatternGWT.create 2013: Themeing GWT Applications with the Appearance Pattern
GWT.create 2013: Themeing GWT Applications with the Appearance Patternniloc132
 
Introducing Sencha Touch 2
Introducing Sencha Touch 2Introducing Sencha Touch 2
Introducing Sencha Touch 2Sencha
 
Bbl microservices avec vert.x cdi elastic search
Bbl microservices avec vert.x cdi elastic searchBbl microservices avec vert.x cdi elastic search
Bbl microservices avec vert.x cdi elastic searchIdriss Neumann
 
SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...
SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...
SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...Sencha
 
SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark Brocato
SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark BrocatoSenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark Brocato
SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark BrocatoSencha
 
Réactif, parallèle, asynchrone. Pourquoi!
Réactif, parallèle, asynchrone. Pourquoi!Réactif, parallèle, asynchrone. Pourquoi!
Réactif, parallèle, asynchrone. Pourquoi!Henri Tremblay
 

En vedette (20)

Comment manager des geeks - Devoxx 2015
Comment manager des geeks - Devoxx 2015Comment manager des geeks - Devoxx 2015
Comment manager des geeks - Devoxx 2015
 
Migration de Tomcat vers Vert.x
Migration de Tomcat vers Vert.xMigration de Tomcat vers Vert.x
Migration de Tomcat vers Vert.x
 
Les Streams sont parmi nous
Les Streams sont parmi nousLes Streams sont parmi nous
Les Streams sont parmi nous
 
Git flow in action
Git flow in actionGit flow in action
Git flow in action
 
How to fail at benchmarking?
How to fail at benchmarking?How to fail at benchmarking?
How to fail at benchmarking?
 
[DevoxxFr] Savoir faire le deuil de son code
[DevoxxFr] Savoir faire le deuil de son code[DevoxxFr] Savoir faire le deuil de son code
[DevoxxFr] Savoir faire le deuil de son code
 
API Asynchrones en Java 8
API Asynchrones en Java 8API Asynchrones en Java 8
API Asynchrones en Java 8
 
Introduction à GWT
Introduction à GWTIntroduction à GWT
Introduction à GWT
 
GWT- Google Web Toolkit
GWT- Google Web ToolkitGWT- Google Web Toolkit
GWT- Google Web Toolkit
 
Migrating from Ext GWT 2.x to 3.0
Migrating from Ext GWT 2.x to 3.0Migrating from Ext GWT 2.x to 3.0
Migrating from Ext GWT 2.x to 3.0
 
Formation gwt
Formation gwtFormation gwt
Formation gwt
 
Introduction aux web components
Introduction aux web componentsIntroduction aux web components
Introduction aux web components
 
Using UIBinder with Ext GWT 3.0
Using UIBinder with Ext GWT 3.0Using UIBinder with Ext GWT 3.0
Using UIBinder with Ext GWT 3.0
 
GWT.create 2013: Themeing GWT Applications with the Appearance Pattern
GWT.create 2013: Themeing GWT Applications with the Appearance PatternGWT.create 2013: Themeing GWT Applications with the Appearance Pattern
GWT.create 2013: Themeing GWT Applications with the Appearance Pattern
 
Introducing Sencha Touch 2
Introducing Sencha Touch 2Introducing Sencha Touch 2
Introducing Sencha Touch 2
 
Bbl microservices avec vert.x cdi elastic search
Bbl microservices avec vert.x cdi elastic searchBbl microservices avec vert.x cdi elastic search
Bbl microservices avec vert.x cdi elastic search
 
SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...
SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...
SenchaCon 2016: The Changing Landscape of JavaScript Testing - Joel Watson an...
 
SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark Brocato
SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark BrocatoSenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark Brocato
SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark Brocato
 
BackDay Xebia : Microservices en démo
BackDay Xebia : Microservices en démoBackDay Xebia : Microservices en démo
BackDay Xebia : Microservices en démo
 
Réactif, parallèle, asynchrone. Pourquoi!
Réactif, parallèle, asynchrone. Pourquoi!Réactif, parallèle, asynchrone. Pourquoi!
Réactif, parallèle, asynchrone. Pourquoi!
 

Similaire à Présentation DevoxxFR 2015 sur GWT

Presentation of GWT 2.4 (PowerPoint version)
Presentation of GWT 2.4 (PowerPoint version)Presentation of GWT 2.4 (PowerPoint version)
Presentation of GWT 2.4 (PowerPoint version)Celinio Fernandes
 
Presentation of GWT 2.4 (PDF version)
Presentation of GWT 2.4 (PDF version)Presentation of GWT 2.4 (PDF version)
Presentation of GWT 2.4 (PDF version)Celinio Fernandes
 
Présentation GWT et HTML 5 pour l'Offline
Présentation GWT et HTML 5 pour l'OfflinePrésentation GWT et HTML 5 pour l'Offline
Présentation GWT et HTML 5 pour l'OfflineDNG Consulting
 
Introduction à GWT - GTI780 & MTI780 - ETS - A08
Introduction à GWT - GTI780 & MTI780 - ETS - A08Introduction à GWT - GTI780 & MTI780 - ETS - A08
Introduction à GWT - GTI780 & MTI780 - ETS - A08Claude Coulombe
 
GWT Approfondissement - GTI780 & MTI780 - ETS - A09
GWT Approfondissement  - GTI780 & MTI780 - ETS - A09GWT Approfondissement  - GTI780 & MTI780 - ETS - A09
GWT Approfondissement - GTI780 & MTI780 - ETS - A09Claude Coulombe
 
Gwt fast overview_v1
Gwt fast overview_v1Gwt fast overview_v1
Gwt fast overview_v1David Herviou
 
Gwt oxiane-novae-lr
Gwt oxiane-novae-lrGwt oxiane-novae-lr
Gwt oxiane-novae-lroxmed
 
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilité
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilitéNouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilité
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilitéJulien Dubois
 
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et Mobile
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et MobileNouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et Mobile
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et MobileIppon
 
Google App Engine For Java
Google App Engine For JavaGoogle App Engine For Java
Google App Engine For Javatcouery
 
GWT Approfondissement - GTI780 & MTI780 - ETS - A08
GWT Approfondissement - GTI780 & MTI780 - ETS - A08GWT Approfondissement - GTI780 & MTI780 - ETS - A08
GWT Approfondissement - GTI780 & MTI780 - ETS - A08Claude Coulombe
 
Devoxx java script-1280-720
Devoxx java script-1280-720Devoxx java script-1280-720
Devoxx java script-1280-720Romain Linsolas
 
Introduction à GWT - GTI780 & MTI780 - ETS - A09
Introduction à GWT - GTI780 & MTI780 - ETS - A09Introduction à GWT - GTI780 & MTI780 - ETS - A09
Introduction à GWT - GTI780 & MTI780 - ETS - A09Claude Coulombe
 
Gtug2 Mobile app with web technlogy
Gtug2 Mobile app with web technlogyGtug2 Mobile app with web technlogy
Gtug2 Mobile app with web technlogySacha Leprêtre
 
Ingénieur étude et développement JAVA JEE.pdf
Ingénieur étude et développement JAVA JEE.pdfIngénieur étude et développement JAVA JEE.pdf
Ingénieur étude et développement JAVA JEE.pdfJEANCLAUDECAMARA
 
Introduction à Groovy - OpenSource eXchange 2008
Introduction à Groovy - OpenSource eXchange 2008Introduction à Groovy - OpenSource eXchange 2008
Introduction à Groovy - OpenSource eXchange 2008Guillaume Laforge
 
GWT Principes & Techniques
GWT Principes & TechniquesGWT Principes & Techniques
GWT Principes & TechniquesRachid NID SAID
 

Similaire à Présentation DevoxxFR 2015 sur GWT (20)

Presentation of GWT 2.4 (PowerPoint version)
Presentation of GWT 2.4 (PowerPoint version)Presentation of GWT 2.4 (PowerPoint version)
Presentation of GWT 2.4 (PowerPoint version)
 
Presentation of GWT 2.4 (PDF version)
Presentation of GWT 2.4 (PDF version)Presentation of GWT 2.4 (PDF version)
Presentation of GWT 2.4 (PDF version)
 
Présentation GWT et HTML 5 pour l'Offline
Présentation GWT et HTML 5 pour l'OfflinePrésentation GWT et HTML 5 pour l'Offline
Présentation GWT et HTML 5 pour l'Offline
 
Introduction à GWT - GTI780 & MTI780 - ETS - A08
Introduction à GWT - GTI780 & MTI780 - ETS - A08Introduction à GWT - GTI780 & MTI780 - ETS - A08
Introduction à GWT - GTI780 & MTI780 - ETS - A08
 
Gdd07 Gwt Dig
Gdd07 Gwt DigGdd07 Gwt Dig
Gdd07 Gwt Dig
 
GWT Approfondissement - GTI780 & MTI780 - ETS - A09
GWT Approfondissement  - GTI780 & MTI780 - ETS - A09GWT Approfondissement  - GTI780 & MTI780 - ETS - A09
GWT Approfondissement - GTI780 & MTI780 - ETS - A09
 
Gwt fast overview_v1
Gwt fast overview_v1Gwt fast overview_v1
Gwt fast overview_v1
 
Gwt oxiane-novae-lr
Gwt oxiane-novae-lrGwt oxiane-novae-lr
Gwt oxiane-novae-lr
 
Gwt intro-101
Gwt intro-101Gwt intro-101
Gwt intro-101
 
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilité
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilitéNouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilité
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et mobilité
 
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et Mobile
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et MobileNouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et Mobile
Nouveau look pour une nouvelle vie : HTML5, Spring, NoSQL et Mobile
 
Google App Engine For Java
Google App Engine For JavaGoogle App Engine For Java
Google App Engine For Java
 
GWT Approfondissement - GTI780 & MTI780 - ETS - A08
GWT Approfondissement - GTI780 & MTI780 - ETS - A08GWT Approfondissement - GTI780 & MTI780 - ETS - A08
GWT Approfondissement - GTI780 & MTI780 - ETS - A08
 
Devoxx java script-1280-720
Devoxx java script-1280-720Devoxx java script-1280-720
Devoxx java script-1280-720
 
Introduction à GWT - GTI780 & MTI780 - ETS - A09
Introduction à GWT - GTI780 & MTI780 - ETS - A09Introduction à GWT - GTI780 & MTI780 - ETS - A09
Introduction à GWT - GTI780 & MTI780 - ETS - A09
 
Gtug2 Mobile app with web technlogy
Gtug2 Mobile app with web technlogyGtug2 Mobile app with web technlogy
Gtug2 Mobile app with web technlogy
 
Ingénieur étude et développement JAVA JEE.pdf
Ingénieur étude et développement JAVA JEE.pdfIngénieur étude et développement JAVA JEE.pdf
Ingénieur étude et développement JAVA JEE.pdf
 
Introduction à Groovy - OpenSource eXchange 2008
Introduction à Groovy - OpenSource eXchange 2008Introduction à Groovy - OpenSource eXchange 2008
Introduction à Groovy - OpenSource eXchange 2008
 
Vert.x 3
Vert.x 3Vert.x 3
Vert.x 3
 
GWT Principes & Techniques
GWT Principes & TechniquesGWT Principes & Techniques
GWT Principes & Techniques
 

Plus de DNG Consulting

Concevoir, développer et sécuriser des micro-services avec Spring Boot
Concevoir, développer et sécuriser des micro-services avec Spring BootConcevoir, développer et sécuriser des micro-services avec Spring Boot
Concevoir, développer et sécuriser des micro-services avec Spring BootDNG Consulting
 
Introduction aux Web components (DNG Consulting)
Introduction aux Web components (DNG Consulting)Introduction aux Web components (DNG Consulting)
Introduction aux Web components (DNG Consulting)DNG Consulting
 
GWT Introduction for Eclipse Day
GWT Introduction for Eclipse Day GWT Introduction for Eclipse Day
GWT Introduction for Eclipse Day DNG Consulting
 
Session GWT Devoxx France 2012 Cobra
Session GWT Devoxx France 2012 CobraSession GWT Devoxx France 2012 Cobra
Session GWT Devoxx France 2012 CobraDNG Consulting
 
Linq et Entity framework
Linq et Entity frameworkLinq et Entity framework
Linq et Entity frameworkDNG Consulting
 
Introduction au Domain Driven Design
Introduction au Domain Driven DesignIntroduction au Domain Driven Design
Introduction au Domain Driven DesignDNG Consulting
 
Resource Oriented Architecture
Resource Oriented ArchitectureResource Oriented Architecture
Resource Oriented ArchitectureDNG Consulting
 

Plus de DNG Consulting (7)

Concevoir, développer et sécuriser des micro-services avec Spring Boot
Concevoir, développer et sécuriser des micro-services avec Spring BootConcevoir, développer et sécuriser des micro-services avec Spring Boot
Concevoir, développer et sécuriser des micro-services avec Spring Boot
 
Introduction aux Web components (DNG Consulting)
Introduction aux Web components (DNG Consulting)Introduction aux Web components (DNG Consulting)
Introduction aux Web components (DNG Consulting)
 
GWT Introduction for Eclipse Day
GWT Introduction for Eclipse Day GWT Introduction for Eclipse Day
GWT Introduction for Eclipse Day
 
Session GWT Devoxx France 2012 Cobra
Session GWT Devoxx France 2012 CobraSession GWT Devoxx France 2012 Cobra
Session GWT Devoxx France 2012 Cobra
 
Linq et Entity framework
Linq et Entity frameworkLinq et Entity framework
Linq et Entity framework
 
Introduction au Domain Driven Design
Introduction au Domain Driven DesignIntroduction au Domain Driven Design
Introduction au Domain Driven Design
 
Resource Oriented Architecture
Resource Oriented ArchitectureResource Oriented Architecture
Resource Oriented Architecture
 

Présentation DevoxxFR 2015 sur GWT

  • 3. @samijaber#GWT Le retour en force de GWT • Plus que jamais une techno d’avenir • Les nouveautés de GWT 2.7 • Les applications hybrides • Les performances • GWT 2.8 • Support de Java 8, JSInterop • Elemental, Mobile, Collections… • Singular
  • 4. @samijaber#GWT On m’a dit que GWT était mort ? • Technologie retenue pour Google Inbox (Gmail V2) • Technologie retenue pour Google Spreadsheet • Mais aussi AdWords, Google Groups, Hotel Finder, Moderator, Google Flight, Google Checkout, Gerrit, Angry Birds, Google Web Font, Google Blogger, Google Offers, Google TakeOut, Google PageSpeed, Fusion Table, App Script Editor … • Et en dehors de Google ? http://www.gwtproject.org/developer_spotlight.html
  • 5. @samijaber#GWT Nouveau logo, nouveau site • Un nouveau logo et un nouveau site (intégrant la documentation) ont été créés cette année • Une communauté de plus de 100.000 utilisateurs à travers le monde • Des grands noms de l’industrie Google, Redhat, …
  • 7. @samijaber#GWT Les performances ? 856 736 GWT JS 223 213 GWT JS 1031 638 GWT JS 796 820 GWT JS DeltaBlue Splay RayTrace Richards Benchmark Octane (V8) Exécutions par seconde Source : https://plus.google.com/111111598146968769323/posts/7LRV7hBKgGH
  • 8. @samijaber#GWT En taille de code généré ?
  • 9. @samijaber#GWT La version actuelle ? • GWT 2.7 sortie en Décembre 2014 • Nouveauté majeure : SuperDevMode, la compilation JavaScript instantanée (Compile on Refresh) • Intégration avec SourceMap • Eclipse : SDBG • IntelliJ : Natif • Bug fixes + améliorations des performances (String, Arraylist, Hashmap, ….)
  • 11. @samijaber#GWT JSInterop • S’intégrer à JavaScript n’a jamais été aussi simple function SomeType(){} SomeType.prototype.doStuff = function(){}; SomeType.prototype.value = 3; @JsType interface SomeType { void doStuff(); @JsProperty int value(); @JsProperty SomeType value(int v); }
  • 12. @samijaber#GWT Héritage JavaScript/Java • Une classe GWT s’intègre dans la chaîne d’héritage JavaScript sans contrainte
  • 13. @samijaber#GWT WebComponent • Avec JSInterop, GWT bénéficiera des Framework JavaScript disponibles : Polymer, Etag, … <script src=”/polymer/webcomponentsjs/webcomponents.js”></script> <import rel=”import” href=”/polymer/paper-elements/paper-elements.html” /> <ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' xmlns:gwt='urn:import:com.google.gwt.user.client.ui'> <gwt:HTMLPanel> <paper-button ui:field=”button” raised=””>Click me!</paper-button> </gwt:HTMLPanel> </ui:UiBinder>
  • 15. @samijaber#GWT Elemental mon cher ami • JAR permettant d’utiliser en JAVA les dernières fonctionnalités de HTML 5 • Extrait les définitions WebIDL du standard et génère les fichiers JSInterop (et la javadoc) • Plus qu’à ouvrir son IDE et à utiliser en Java « Push Notification » « FullScreen », « WebStorage », « Offline » ou « WebRTC »
  • 16. @samijaber#GWT Exemple Window $win = Browser.getWindow(); $win.newEventSource(“http://...”).setOnMessage(e->...); $win.newSpeechRecognition().start(); $win.newFileReader().readAsDataURL(...); $win.getComputedStyle(e, null).getPropertyValue(); $win.getOpener().postMessage(...); $win.getConsole().log(...); $win.getHistory().pushState(...); $win.getPerformance().getNow(); $win.getCrypto().getRandomValues(...); $win.getUserMedia()
  • 17. @samijaber#GWT GSS • Google Style Sheets • Support et Extension de CSS3 (un peu comme Less ou Sass) • Possibilité d’utiliser des variables, des conditions, mixins • Minification/compilation, RTL, réduction des styles non utilisés • Remplace CssResource (conversion à la volée de vos Css vers Gss)
  • 19. @samijaber#GWT Evalué à la compilation • Les fonctions et conditions sont évaluées à la compilation • On n’embarque que ce qui est nécessaire au navigateur utilisé
  • 20. @samijaber#GWT GWT 2.8 • Supportera Java 8 • JsInterop en version 1 • Une meilleure expérience de debug • Le support de GSS par défaut • La compilation encore plus rapide • Des collections encore plus rapides
  • 21. @samijaber#GWT Support du JDK 8 • Lambdas, référence de méthode & méthodes par défaut (defender methods) • Imp. des méthodes dans l’interface (méthodes statiques aussi) + support de java.util.functional interface MaClasse { default void run() { System.out.println(get()); } static void accept(int value) { … } String get() { … } } MaClasse example = () -> “Les lambdas c’est génial !”; Runnable r = example::run; r.run(); // Affiche “Les lambdas c’est génial !”
  • 22. @samijaber#GWT Des collections plus rapides • Optimisation des collections : ArrayList.get(i) • Intégration plus étroite avec les types natifs JS (plutôt que de passer par des itérateurs) • Annotation @IterateAsArray • Elimination de l’auto-boxing • Mapping du type java.lang.Number vers le type natif number de JS • Utilisation des types natifs JS de ES6 (Map et Set)
  • 23. @samijaber#GWT Comparaison avec JS • Java aussi concis que JavaScript Java 7 Runnable task = new Runnable() { @Override public void run() { doSomething(); } }; Javascript var task = function() { doSomething() } Java 8 Runnable task = () -> doSomething(); Javascript var task = function() { doSomething() }
  • 24. @samijaber#GWT Service Workers & DeltaJS • Un client possède la version 1.2 de son application, il demande la dernière version (1.3 située sur le serveur) • Le serveur calcule un VCDIFF et envoie le patch correspondant seulement au delta entre la 1.2 et 1.3 • Le Client met en cache en local la nouvelle version et lance l’application • Utilisé par Inbox • Support de ES6
  • 25. @samijaber#GWT GWT 3.0 • Attention, quelques ruptures de compatibilité (aucune rupture majeure depuis presque 10 ans!) • JSInterop V2 • Elemental V2 • Ancien DevMode supprimé • Collections encore plus rapides • Support de DeltaJS, ServiceWorker • Support de ES6 (modules, classes,…)
  • 26. @samijaber#GWT AngularJS • Les avantages d’AngularJS : Productivité, Structuration du code, MVC • Les inconvénients : les performances, le scan permanent du DOM au runtime, la boucle de $digest, difficile d’optimiser le fonctionnement via un compilateur • Réponse de Google => Singular
  • 27. @samijaber#GWT Qu’est-ce que Singular ? • Pas un portage d’Angular en Java • Réécriture complète d’un Framework Java basé sur certains concepts d’Angular • Parsing des templates à la compilation • Résolution des directives à la compilation • Pas de Dirty Checking • Tire partie du compilateur GWT pour réduire la taille des scripts • Monte en charge pour les grosses applications
  • 28. @samijaber#GWT Singular • API cross-plateformes • Un template UI par plateforme • Web => HTML • Android => Fichiers XML • iOS => UiBuilder • Partage des controleurs sur toutes les plateformes