Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

GWT Introduction and Overview - SV Code Camp 09

4,958 views

Published on

Google Web Toolkit - Introduction and Overview
Silicon Valley Code Camp 2009

Published in: Sports, Technology
  • Be the first to comment

GWT Introduction and Overview - SV Code Camp 09

  1. 1. 1 Google Web Toolkit Introduction & Overview Introduction & Overview Fred Sauer Developer Advocate fredsa@google.com SV Code Camp Oct 4, 2009
  2. 2. 2 Agenda Introduction Selecting a language Feature tour Developer productivity Need for speed Compiler magic Q&A
  3. 3. 3 Google Web Toolkit Write Core Java APIs Widgets Libraries Java IDEs Debug JVM Debugging Development Mode A real browser Developer Productivity Optimize GWT Compiler Image Bundle (Sprites) CSS Magic End User Performance Run Desktop Mobile Online/Offline Gadgets
  4. 4. 4 May 2006 GWT 1.0 Launch at JavaOne Aug 2008 GWT 1.5 Java 5 language support Apr 2009 GWT 1.7 Dedicated IE8 support Fall 2009 GWT 2.0 LOTS of interesting stuff 3+ years in review
  5. 5. 5 Mission statement "GWT's mission is to radically improve the web experience for users by enabling developers to use existing Java tools to build no-compromise AJAX for any modern browser."
  6. 6. 6 Focus Productivity for developers Language, IDEs, tools, libraries People, ecosystem Performance for your users 'Perfect' caching Whole program optimization Better than practical hand written code
  7. 7. 7 No plugins required VML Flash Silverlight
  8. 8. 8 What we don't want
  9. 9. 9 GWT Browser-Proofs Your JavaScript Code... IE Firefox Safari Chrome Opera
  10. 10. 10 Deferred Binding 14800 ms4836 ms1997 ms7148 msDOM manipulation 2469 ms1520 ms918 ms2477 msinnerText=... -1386 ms908 ms-textContent=... 4078 ms2053 ms1276 ms2876 msTypical portable setInnerText() IEOperaWebkit (Safari)Firefox Improvement 39%32%29%14%
  11. 11. 11 A More Powerful Web, Made Easier
  12. 12. 12 Eating our own dogfood 12
  13. 13. 13 Selecting a language
  14. 14. 14 Rich ecosystem of tools and libraries + + =
  15. 15. 15 Code completion and javadoc
  16. 16. 16 Can you find the bug? Hint: JavaScript is a dynamic language
  17. 17. 17 Java is a static language Catch errors at compile time
  18. 18. 18 Feature tour
  19. 19. 19 Pluggable Architecture
  20. 20. 20 More than just a compiler
  21. 21. 21 Sprites for free 20,558 bytes 6,824 bytes 11 separate images 1 bundled image
  22. 22. 22 Without ClientBundle
  23. 23. 23 Roundtrips are deadly 1 round trip for TCP connection setup (1 round trip for HTTP redirect?) 1 round trip for each HTTP request $ ping ohare.comPING ohare.com (70.142.247.22): 56 data bytes64 bytes from 70.142.247.22: icmp_seq=0 ttl=113 time=54.689 ms64 bytes from 70.142.247.22: icmp_seq=1 ttl=113 time=55.500 ms64 bytes from 70.142.247.22: icmp_seq=2 ttl=113 time=54.728 ms $ ping ohare.comPING ohare.com (70.142.247.22): 56 data bytes64 bytes from 70.142.247.22: icmp_seq=0 ttl=113 time=54.689 ms64 bytes from 70.142.247.22: icmp_seq=1 ttl=113 time=55.500 ms64 bytes from 70.142.247.22: icmp_seq=2 ttl=113 time=54.728 ms
  24. 24. 24 Reducing round trip time Use HTTP Expires and Cache-Control headers Use GWT 'Perfect Caching' Cache 'forever' - your entire app and all its resources Bundle, bundle, bundle Enable HTTP Pipelining Use multiple hostnames Defeat browser's two connection limit Watch out for DNS lookup overhead though
  25. 25. 25 Know your HTTP Headers <!-- See RFC 2616. Here's an example: Expires: Thu, 02 Sep 2010 03:21:55 GMT Cache-Control: public, max-age=31536000 --> <Files *.cache.*> ExpiresDefault "now plus 1 year" </Files> <Files *.nocache.*> ExpiresDefault "access" </Files>
  26. 26. 26 History just works
  27. 27. 27 Rich Text Area
  28. 28. 28 RTL, I18N, L10N, A11Y
  29. 29. 29 Widget Libraries • GWT (http://code.google.com/webtoolkit/) • Incubator (http://code.google.com/p/google-web-toolkit-incubator/) • Smart GWT (http://code.google.com/p/smartgwt/) • GWT-Ext (http://code.google.com/p/gwt-ext/) • Vaadin (IT Mill Toolkit) (http://vaadin.com/) • GWT mosaic (http://code.google.com/p/gwt-mosaic/) • Ext GWT (http://extjs.com/products/gxt/) • Advanced GWT Components (http://advanced-gwt.sourceforge.net/)
  30. 30. 30 GUI Editing
  31. 31. 31 Simple, Powerful RPCs interface SpellService extends RemoteService { /** * Checks spelling and suggests * alternatives. * @param the word to check * @return the list of alternatives */ String[] suggest(String word); }
  32. 32. 32 Shameless plugs (gwt-dnd, gwt-log, gwt- voices)
  33. 33. 33 Developer productivity
  34. 34. 34 GWT 2.0 operating modes Development Mode (Hosted Mode) All about productivity Java + JavaScript Now in any supported browser Production Mode (Web Mode) All about performance Compiled, Pure JavaScript
  35. 35. 35 Development Mode (Hosted Mode) JVM debugging Server & Client code in the same IDE Step in / over / out Introspect & modify variables Hot swap code (ignore the IDE warning!) NOT TRUE
  36. 36. 36 Java Virtu al Mac hine Development Mode Code Server Web Server Duke, the Java mascot Copyright © Sun Microsystems Inc., all rights reserved.
  37. 37. 37 Google Plugin for Eclipse
  38. 38. 38 Eclipse plugin highlights Extensive JSNI support RPC sync/async quick fixes Launch configurations GWT JUnit tests Contributor SDKs (gwt-user, gwt-dev-<platform>) Development Mode (GWT 2.0) Hosted Mode (GWT 1.7) Constantly improving; check back often
  39. 39. 39 GWT Debugging in the browser
  40. 40. 40 Need for speed
  41. 41. 41 Speed matters perceived as instantaneous. maintains the feeling that a single task is being carried out. limit for keeping user’s attention. 0.1 seconds 1 second 10 seconds
  42. 42. 42 Another reason speed matters 2. UI Changes 3. User Learns 1. User Action Performance for your
  43. 43. 43 GWT Helps Apps Startup More Quickly 26-Nov 29-Apr 18-Jun 28-Jul 12-Sep 27-Oct 24-Dec 16-Mar SizeofInitialJavaScriptDownload(KB) 375 750 1125 1500 0 7x Decrease In Initial Download Size with runAsync() 1400 KB 200 KB
  44. 44. 44 Developer guided code splitting
  45. 45. 45 Developer guided code splitting
  46. 46. 46 Manual code splitting - Don't try this at home 46
  47. 47. 47 Developer guided code splitting GWT.runAsync(new RunAsyncCallback() { public void onSuccess() { … } public void onFailure(Throwable caught) { … } });
  48. 48. 48 Story of Your Compile (SOYC) -C
  49. 49. 51 Compiler magic
  50. 50. 52 GWT quote to remember “The fastest code is that which does not run.” Joel Webber GWT co-creator
  51. 51. 53 Conventional and non-conventional Java transformations Dead-code elimination Method inlining Constant folding & propagation JavaScript transformations (gzip motivated) Method reordering Argument renaming
  52. 52. 54 EXPERIMENTAL arguments you should know // Don't care what Class#getName() returns? -XdisableClassMetadata 5% - 10% script reduction Showcase metadata before Showcase metadata after
  53. 53. 55 EXPERIMENTAL arguments you should know // In a real-world (very large) Google app... // 1% script size reduction // 10% faster in performance-sensitive code -XdisableCastChecking try { ((Quacker) animal).quack(); } catch (ClassCastException c) { Window.alert("Found a non-quacker"); }
  54. 54. 83 Thank you Read more http://code.google.com/webtoolkit/ Contact info Fred Sauer Developer Advocate fredsa@google.com Questions?

×