Socket applications

926 views

Published on

Published in: Technology

Socket applications

  1. 1. João Moura
  2. 2. João Moura @joaomdmoura joaomdmoura.comgithub.com/joaomdmoura
  3. 3. Socket Applications
  4. 4. What?
  5. 5. What?Examples
  6. 6. What?ExamplesChat, a Livestream of feed, Games or even publicAPIs
  7. 7. What?ExamplesChat, a Livestream of feed, Games or even publicAPIsUsual Solution
  8. 8. What?ExamplesChat, a Livestream of feed, Games or even publicAPIsUsual SolutionAjax requests in regular times to an server( Pooling )
  9. 9. What?ExamplesChat, a Livestream of feed, Games or even publicAPIsUsual SolutionAjax requests in regular times to an server( Pooling )
  10. 10. Problems
  11. 11. Problems- Don’t support multiples simultaneouslyconnections.
  12. 12. Problems- Don’t support multiples simultaneouslyconnections.- Synchronous I/O, the real problem, if the serverare saving an archive or doing a query in databasethis process have to wait before continue.
  13. 13. Solution
  14. 14. SolutionMulti-thread model with an asynchronous I/O
  15. 15. SolutionMulti-thread model with an asynchronous I/OReactor Pattern
  16. 16. SolutionMulti-thread model with an asynchronous I/OReactor PatternInstead of waiting on a response from network, usethat time to process another request.
  17. 17. An constant, bi-directional andasynchronous communication flow
  18. 18. Action
  19. 19. Action
  20. 20. RequestAction
  21. 21. RequestAction Process
  22. 22. RequestAction Process
  23. 23. Request PackAction Process
  24. 24. Socket Connection
  25. 25. Socket ConnectionAction
  26. 26. Socket Connection Request / PackAction
  27. 27. Socket Connection Request / PackAction Process
  28. 28. Socket Connection Request / PackAction Process
  29. 29. Why?
  30. 30. Why? The deal is not about being connectedanymore, it’s about doing it faster, better and different
  31. 31. - Amazon: 100 ms of extra load time caused a 1%drop in sales (source: Greg Linden, Amazon).
  32. 32. - Amazon: 100 ms of extra load time caused a 1%drop in sales (source: Greg Linden, Amazon).- Google: 500 ms of extra load time caused 20%fewer searches (source: Marrissa Mayer, Google).
  33. 33. - Amazon: 100 ms of extra load time caused a 1%drop in sales (source: Greg Linden, Amazon).- Google: 500 ms of extra load time caused 20%fewer searches (source: Marrissa Mayer, Google).- Yahoo!: 400 ms of extra load time caused a 5–9%increase in the number of people who clicked“back” before the page even loaded (source: NicoleSullivan, Yahoo!).
  34. 34. It contribute to SPA concept and increasesthe performance and the UX.Examplehttp://www.toyota.com/itsacar/
  35. 35. IMPORTANT!
  36. 36. IMPORTANT!THERE IS NO SILVER BULLET!
  37. 37. How?
  38. 38. How?It’s up to you!
  39. 39. How?It’s up to you!
  40. 40. Tools ( gems, frameworks, external services )
  41. 41. Tools ( gems, frameworks, external services )- Pusher- Socket.IO- EventMachine- Cramp
  42. 42. Tools ( gems, frameworks, external services )- Pusher - Juggernaut- Socket.IO - ØMQ- EventMachine - Einhorn- Cramp - SocketStream
  43. 43. Redis
  44. 44. Redis“Redis is an open source, advanced key-value store.It is often referred to as a data structure serversince keys can contain strings, hashes, lists, sets andsorted sets.”
  45. 45. Show me the code!
  46. 46. Code!
  47. 47. Code!Cause I love Ruby and Javascript!
  48. 48. Code! Cause I love Ruby and Javascript!Rails ( Ruby )
  49. 49. Code! Cause I love Ruby and Javascript!Rails ( Ruby )Juggernaut gem - https://github.com/maccman/juggernaut
  50. 50. Code! Cause I love Ruby and Javascript!Rails ( Ruby )Juggernaut gem - https://github.com/maccman/juggernautNode.js ( Javascript )
  51. 51. Code! Cause I love Ruby and Javascript!Rails ( Ruby )Juggernaut gem - https://github.com/maccman/juggernautNode.js ( Javascript )SocketStream framework - https://github.com/socketstream/socketstream
  52. 52. WAT!
  53. 53. WAT!
  54. 54. ~$ irb>> aNameError: undefined local variable or method `a formain:Object! from (irb):1! from /Users/joaomdmoura/.rvm/rubies/ruby-1.9.2-p290/bin/irb:16:in `<main>>> a = bNameError: undefined local variable or method `b formain:Object! from (irb):2! from /Users/joaomdmoura/.rvm/rubies/ruby-1.9.2-p290/bin/irb:16:in `<main>
  55. 55. ~$ irb>> aNameError: undefined local variable or method `a formain:Object! from (irb):1! from /Users/joaomdmoura/.rvm/rubies/ruby-1.9.2-p290/bin/irb:16:in `<main>>> a = bNameError: undefined local variable or method `b formain:Object! from (irb):2! from /Users/joaomdmoura/.rvm/rubies/ruby-1.9.2-p290/bin/irb:16:in `<main>>> a = a => nil
  56. 56. ~$ irb>> aNameError: undefined local variable or method `a formain:Object! from (irb):1! from /Users/joaomdmoura/.rvm/rubies/ruby-1.9.2-p290/bin/irb:16:in `<main>>> a = bNameError: undefined local variable or method `b formain:Object! from (irb):2! from /Users/joaomdmoura/.rvm/rubies/ruby-1.9.2-p290/bin/irb:16:in `<main>>> a = a => nil
  57. 57. ~$ jsc> [] + []> [] +{}[object Object]> {}+ []0> {} + {}NaN
  58. 58. ~$ jsc> [] + []> [] +{}[object Object]> {}+ []0> {} + {}NaN
  59. 59. ~$ jsc
  60. 60. ~$ jsc> Array(16),,,,,,,,,,,,,,,
  61. 61. ~$ jsc> Array(16),,,,,,,,,,,,,,,>Array(16).join("wat")watwatwatwatwatwatwatwatwatwatwatwatwatwatwat
  62. 62. ~$ jsc> Array(16),,,,,,,,,,,,,,,>Array(16).join("wat")watwatwatwatwatwatwatwatwatwatwatwatwatwatwat> Array(16).join("wat" +1)wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1
  63. 63. ~$ jsc> Array(16),,,,,,,,,,,,,,,>Array(16).join("wat")watwatwatwatwatwatwatwatwatwatwatwatwatwatwat> Array(16).join("wat" +1)wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1> Array(16).join("wat" - 1) + "Batman!"NaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaN Batman!
  64. 64. ~$ jsc> Array(16),,,,,,,,,,,,,,,>Array(16).join("wat")watwatwatwatwatwatwatwatwatwatwatwatwatwatwat> Array(16).join("wat" +1)wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1wat1> Array(16).join("wat" - 1) + "Batman!"NaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaNNaN Batman!
  65. 65. RoR w/ Juggernaut
  66. 66. RoR w/ Juggernaut- Application Scaffold
  67. 67. RoR w/ Juggernaut- Application Scaffold- Juggernaut Installation
  68. 68. RoR w/ Juggernaut- Application Scaffold- Juggernaut Installation- Dependencies:
  69. 69. RoR w/ Juggernaut- Application Scaffold- Juggernaut Installation- Dependencies:- Redis
  70. 70. RoR w/ Juggernaut- Application Scaffold- Juggernaut Installation- Dependencies:- Redis- Node.js
  71. 71. RoR w/ Juggernaut- Application Scaffold- Juggernaut Installation- Dependencies:- Redis- Node.js- NPM ( Node Package Manager )
  72. 72. RoR w/ Juggernaut- Application Scaffold- Juggernaut Installation- Dependencies:- Redis- Node.js- NPM ( Node Package Manager ) npm install -g juggernaut gem install juggernaut
  73. 73. > redis-server > juggernaut http://localhost:8080<script src="http://localhost:8080/application.js" type="text/javascript"></script> > rails -s http://localhost:3000
  74. 74. Client<script type="text/javascript"> var jug = new Juggernaut; jug.subscribe("RubyDay", function(data){ console.log("DATA: " + data); });</script>
  75. 75. Serverrequire "juggernaut"Juggernaut.publish("RubyDay", "Welcome")// ORJuggernaut.publish("RubyDay", {:data => "Welcome"})// ORJuggernaut.publish(["RubySpace", "RubyMine"], {:data =>"Welcome"})
  76. 76. class PeopleController < ApplicationController  require "juggernaut"  def say_hello   @user = { :name => “You”, :email => “lol@lol.com” }         Juggernaut.publish( "RubyDay", @user , :except => params[:juggernaut_id] ) Juggernaut.publish( "RubyMine", @user , :except => params[:juggernaut_id] )    render :text => "SENT!"      endend
  77. 77. ! ! // RubyDay Users Channel! ! jug.subscribe( "RubyDay", function ( data )! ! {! ! ! console.log(data[ “name” ])! ! });! ! // RubyMine Users Channel! ! jug.subscribe( "RubyMine", function ( data )! ! {    !! console.log(data[ “email” ])! ! });
  78. 78. SocketStream
  79. 79. SocketStream- Generate a new applications- Installing SS ( https://github.com/socketstream/socketstream ) Dependencies: -Redis - Node.js - NPM ( Node PackageManager )
  80. 80. SocketStream- Generate a new applications- Installing SS ( https://github.com/socketstream/socketstream ) Dependencies: -Redis - Node.js - NPM ( Node PackageManager ) > npm -g install socketstream
  81. 81. Install the bundled (optional) dependencies> cd <name_of_your_project>> npm installTo start your app simply type:> node app.jshttp://localhost:3000
  82. 82. Structure:
  83. 83. Structure:/app /clientapp? /css /server /shared /views
  84. 84. Structure:/app / /lib /client client /app? / css /css / serverserver /shared /views
  85. 85. Structure:/app / /lib / /configclient client / app.coffeeapp? / css / db.coffeecss / server events.coffeeserver / http.coffeeshared /views
  86. 86. Structure:/app / /lib / /config /public /client client / app.coffee assetsapp? / css / db.coffeecss / server events.coffeeserver / http.coffeeshared /views
  87. 87. ClientSS.socket.on disconnect, -> console.log Server is downSS.socket.on reconnect, -> console.log Server is upexports.init = -> SS.server.app.init ( response ) -> console.log response Serverexports.actions =! init: (cb) ->! ! cb "SocketConnection is Okay!"
  88. 88. Client Index SS.socket.on disconnect, -> console.log Server is downSS.socket.on reconnect, -> console.log Server is upexports.init = -> SS.client.user.init( “João”, “Welcome to Ruby Day!” ) SS.events.on RubyDay, ( params ) -> console.log “#{params[“user”]}, #{params[“message”]}” User exports.init = ( user, message )-> SS.publish.broadcast RubyDay, ! ! ! { ! ! ! ! user: user, ! ! ! ! message: message ! ! ! }
  89. 89. Client Index SS.socket.on disconnect, -> console.log Server is downSS.socket.on reconnect, -> console.log Server is upexports.init = -> SS.client.user.init( “João”, “Welcome to Ruby Day!” ) SS.events.on RubyDay, ( params ) -> console.log “#{params[“user”]}, #{params[“message”]}” User exports.init = ( user, message )-> SS.publish.broadcast RubyDay, ! ! ! { ! ! ! ! user: user, ! ! ! ! message: message ! ! ! }
  90. 90. Return
  91. 91. Return Both have your advantages, what is make youchoose how you should use is the characteristics of your project
  92. 92. OpenSource
  93. 93. OpenSourceSweet - joaomdmoura.github.com/sweet
  94. 94. OpenSourceSweet - joaomdmoura.github.com/sweetGioco - joaomdmoura.github.com/gioco
  95. 95. OpenSourceSweet - joaomdmoura.github.com/sweetGioco - joaomdmoura.github.com/giocoFriendsShit - friendsshit.com
  96. 96. Thank you!
  97. 97. Thank you!@joaomdmourajoaomdmoura.comgithub.com/ joaomdmoura
  98. 98. Thank you! Have a nice day!@joaomdmourajoaomdmoura.comgithub.com/ joaomdmoura

×