Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
@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 applicati...
@samijaber#GWT
On m’a dit que GWT était mort ?
• Technologie retenue pour Google Inbox (Gmail V2)
• Technologie retenue po...
@samijaber#GWT
Nouveau logo, nouveau site
• Un nouveau logo et un nouveau site (intégrant la
documentation) ont été créés ...
@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
Ri...
@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
...
@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.do...
@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, …
<scr...
@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
• Extrai...
@samijaber#GWT
Exemple
Window $win = Browser.getWindow();
$win.newEventSource(“http://...”).setOnMessage(e->...);
$win.new...
@samijaber#GWT
GSS
• Google Style Sheets
• Support et Extension de CSS3 (un peu comme Less ou
Sass)
• Possibilité d’utilis...
@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...
@samijaber#GWT
GWT 2.8
• Supportera Java 8
• JsInterop en version 1
• Une meilleure expérience de debug
• Le support de GS...
@samijaber#GWT
Support du JDK 8
• Lambdas, référence de méthode & méthodes par défaut
(defender methods)
• Imp. des méthod...
@samijaber#GWT
Des collections plus rapides
• Optimisation des collections : ArrayList.get(i)
• Intégration plus étroite a...
@samijaber#GWT
Comparaison avec JS
• Java aussi concis que JavaScript
Java 7
Runnable task = new Runnable() {
@Override
pu...
@samijaber#GWT
Service Workers & DeltaJS
• Un client possède la version 1.2 de son application, il
demande la dernière ver...
@samijaber#GWT
GWT 3.0
• Attention, quelques ruptures de compatibilité (aucune
rupture majeure depuis presque 10 ans!)
• J...
@samijaber#GWT
AngularJS
• Les avantages d’AngularJS : Productivité, Structuration du
code, MVC
• Les inconvénients : les ...
@samijaber#GWT
Qu’est-ce que Singular ?
• Pas un portage d’Angular en Java
• Réécriture complète d’un Framework Java basé ...
@samijaber#GWT
Singular
• API cross-plateformes
• Un template UI par
plateforme
• Web => HTML
• Android => Fichiers XML
• ...
@YourTwitterHandle@YourTwitterHandle@YourTwitterHandle#YourSessionHashtag
En résumé
@YourTwitterHandle@YourTwitterHandle@YourTwitterHandle#YourSessionHashtag
Q & A
Prochain SlideShare
Chargement dans…5
×

Présentation DevoxxFR 2015 sur GWT

6 381 vues

Publié le

Présentation Devoxx 2015 de GWT

Publié dans : Internet

Présentation DevoxxFR 2015 sur GWT

  1. 1. @samijaber#GWT Le retour en force de GWT
  2. 2. @samijaber#GWT Speaker @samijaber
  3. 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. 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. 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, …
  6. 6. @samijaber#GWT Nouveau site Web http://www.gwtproject.org
  7. 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. 8. @samijaber#GWT En taille de code généré ?
  9. 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, ….)
  10. 10. @YourTwitterHandle@YourTwitterHandle@samijaber#gwt Di, ci pas li dimo mitinant?
  11. 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. 12. @samijaber#GWT Héritage JavaScript/Java • Une classe GWT s’intègre dans la chaîne d’héritage JavaScript sans contrainte
  13. 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>
  14. 14. @YourTwitterHandle@YourTwitterHandle@samijaber#gwt Di, ci pas li dimo mitinant?
  15. 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. 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. 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)
  18. 18. @samijaber#GWT Exemple GSS Génère Style.gss Style.css <set-configuration-property name=CssResource.enableGss value=true />
  19. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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
  29. 29. @YourTwitterHandle@YourTwitterHandle@YourTwitterHandle#YourSessionHashtag En résumé
  30. 30. @YourTwitterHandle@YourTwitterHandle@YourTwitterHandle#YourSessionHashtag Q & A

×