Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Realtimeconf.oct.2012.pdf

 Realtimeconf.oct.2012.pdf

The slides of the talk that I did during Realtimeconf 2012

Arnout Kazemier

October 23, 2012
Tweet

More Decks by Arnout Kazemier

Other Decks in Programming

Transcript

  1. ENTERPRISE ready connections & start building those real-time WEBSUCKETS removing

    the “suck” out of fancy pancy Tuesday, October 23, 12
  2. version released details 0 Jan 2009 Initial version 53 Oct

    2009 Sub protocol 76 May 2010 draft-hixie-thewebsocketprotocol - XX Tuesday, October 23, 12
  3. version released details 1 Aug 2010 Binary support 4 Jan

    2011 Security issues 14 Sep 2011 Versioning RFC 6455 Dec 2011 Final draft-ietf-hybi-thewebsocketprotocol - XX Tuesday, October 23, 12
  4. Ok, I get it there are many protocols omg what

    does this mean Tuesday, October 23, 12
  5. 4+ 4+ 11+ 4.2+ 10+ Chrome for android 18+ Firefox

    for android 15+ Opera Mobile 12+ LULZ, no android browser Supports a WebSocket protocol Tuesday, October 23, 12
  6. 20+ 12+ 12.1+ 6+ 10+ RFC RFC RFC RFC RFC

    Supports latest RFC 6455 protocol Chrome for android 18+ Firefox for android 15+ Opera Mobile 12+ TROLOLOL no android browser RFC RFC RFC Tuesday, October 23, 12
  7. Usage or detecting a HTTP proxy (AutoProxyDiscovery) crashes < Safari

    5.1.4 and Mobile Webkit This includes tabs and full browser crashes, not “feature” detectable Tuesday, October 23, 12
  8. if ( // target safari browsers $.browser.safari // not chrome

    && !$.browser.chrome // and correct webkit version && parseFloat($.browser.version) < 534.54 ) { // don’t use websockets } seal of approval Tuesday, October 23, 12
  9. Writing to a closed WebSocket connection can crash the browser

    & tabs Caused by a race condition on Mobile devices Tuesday, October 23, 12
  10. var ws = new WebSocket("wss://localhost:8080/"); ws.onmessage = function(event) { //

    wrap sends in a setTimeout out to allow the readyState // to be correctly set to closed setTimeout(function () { ws.send("g’day realtimeconf"); }); }; seal of approval Tuesday, October 23, 12
  11. var ws = new WebSocket("wss://localhost:8080/"); ws.onmessage = function(event) { //

    wrap sends in a setTimeout out to allow the readyState // to be correctly set to closed, make this only happen // on mobile devices if (mobile) return setTimeout(function () { ws.send("g’day realtimeconf"); }); ws.send("g’day realtimeconf"); }; seal of approval Tuesday, October 23, 12
  12. 3G doesn’t always work with WebSocket or causes a crash

    Not detectable Tuesday, October 23, 12
  13. var ua = navigator.userAgent.toLowerString(); // detect all possible mobile phones

    to filter out // websuckets if ( ~ua.indexOf('mobile') || ~ua.indexOf('android) || .. and more .. ) { // don't use websuckets } seal of approval Tuesday, October 23, 12
  14. Pressing ESC in Firefox will drop the established connection. Even

    after the page has fully loaded. Capture the event early and try to cancel it, still happening in latest firefox but they are “working” on it Tuesday, October 23, 12
  15. $('body').keydown(function (e) { // make sure that you capture the

    `esc` key and prevent // it's default action from happening if (e.which === 27) e.preventDefault(); }); seal of approval Tuesday, October 23, 12
  16. Sending “invalid” UTF-8 can drop the connection, for example emoji’s

    escape & encodeURI your data, yes both Tuesday, October 23, 12
  17. var ws = new WebSocket("wss://localhost:8080/"); ws.onopen = function(event) { //

    encode and then unescape all messages that contain // utf8, and also user input ws.send(unescape(encodeURIComponent( ))); }; seal of approval Tuesday, October 23, 12
  18. Firefox doesn’t connect to ws:// from a secure https page.

    they called it a security “feature”, but I call it annoying Tuesday, October 23, 12
  19. Safari doesn’t allow you to connect using self signed certificates

    if you do this in production you are a nut head, but it can be annoying for development Tuesday, October 23, 12
  20. ~3% of all requests on port 4000 were blocked out

    of the unique 100k connections tested enterprise proxies usually block everything except port 80,443,843 and virus scanners usually target port 80 for scanning & blocking port testing Tuesday, October 23, 12
  21. Sharing is caring var indicator = document && "MozAppearance" in

    document.documentElement.style; if (indicator) { setTimeout(function () { // creating and removing an iframe is enough to // kill a loading indicator var iframe = document.createElement('iframe'); document.body.appendChild(iframe); document.body.removeChild(iframe); }, 100); } Tuesday, October 23, 12