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-pushstateA library providing HTML5 History API     support for GWT applications
Johannes Barop●   Mail: jb@barop.de●   Google+: http://bit.ly/jbarop●   Github: https://github.com/jbarop●   LinkedIn: htt...
Browser history● GWT applications usually consist only of a  single page● Applications should meet the users  expectations...
GWT Standard History Mechanism● GWT uses the fragment identifier (#) to  provide a history state● Chosen because updating ...
GWT Standard History Mechanism● Fragment identifier is optional and isnt a part  of the URI itself● "http://example.com/ap...
GWT Standard History Mechanism● Many user agents do not send the fragment  to the server● No simple server redirect possib...
HTML5 History API● Function: window.history.pushState● Event: onpopstate● Browser Support:  ○ Chrome: 5  ○ Firefox: 4  ○ I...
gwt-pushstate - Featureshttps://github.com/jbarop/gwt-pushstate● Integrates well with GWT● Development mode supported● Hyp...
gwt-pushstate - Caveats● Complete path treated as history token● Path depended stuff might break  ○ GWT.getHostPageBaseURL...
Demo & Feedback● http://gwt-pushstate-examples.appspot.comFeedback & improvements heavily appreciated
Upcoming SlideShare
Loading in …5
×

gwt-pushstate

1,420 views

Published on

A library providing HTML5 History API support for GWT applications

  • Be the first to comment

  • Be the first to like this

gwt-pushstate

  1. 1. gwt-pushstateA library providing HTML5 History API support for GWT applications
  2. 2. Johannes Barop● Mail: jb@barop.de● Google+: http://bit.ly/jbarop● Github: https://github.com/jbarop● LinkedIn: https://www.linkedin.com/in/jbarop● Freelancer● Focus on Java and GWT● GWT experience since 2008● Hacking at GWT internals since end of last year
  3. 3. Browser history● GWT applications usually consist only of a single page● Applications should meet the users expectations compared to traditional web pages● URLs... ○ Identify a unique resource ○ can be linked, bookmarked and shared
  4. 4. GWT Standard History Mechanism● GWT uses the fragment identifier (#) to provide a history state● Chosen because updating the fragment doesnt causes reload● This is a hack
  5. 5. GWT Standard History Mechanism● Fragment identifier is optional and isnt a part of the URI itself● "http://example.com/app.html#page_1" and "http://example.com/app.html#page_2" reference the same resource "app.html"
  6. 6. GWT Standard History Mechanism● Many user agents do not send the fragment to the server● No simple server redirect possible● Supporting crawlers not straightforwardhttps://groups.google.com/forum/?fromgroups#!topic/google-web-toolkit/w2h-b8OSm2shttps://groups.google.com/forum/google-web-toolkit/w2h-b8OSm2s?fromgroups
  7. 7. HTML5 History API● Function: window.history.pushState● Event: onpopstate● Browser Support: ○ Chrome: 5 ○ Firefox: 4 ○ Internet Explorer: 10 ○ Safari: 5.0 ○ Opera: 11.50 ○ Mobile: Its tricky● Support for non-pushstate browser needed
  8. 8. gwt-pushstate - Featureshttps://github.com/jbarop/gwt-pushstate● Integrates well with GWT● Development mode supported● Hyperlinks with nice URLs● Oldskool Browser support
  9. 9. gwt-pushstate - Caveats● Complete path treated as history token● Path depended stuff might break ○ GWT.getHostPageBaseURL() ○ GWTP-dispatchs auto discovery of service URLs● Deeplinking needs server configuration ○ URL rewriting
  10. 10. Demo & Feedback● http://gwt-pushstate-examples.appspot.comFeedback & improvements heavily appreciated

×