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

Real-time sweg

Real-time sweg

In this presentation i'll talk about sweg:

socket.io/sockjs
websockets
engine.io
google browserchannel

and why primus is yolo (your only library option) for sweg. I presented this at the first GrunnJS meetup.

Arnout Kazemier

September 24, 2014
Tweet

More Decks by Arnout Kazemier

Other Decks in Programming

Transcript

  1. socket.io 0.9 http://github.com/automattic/socket.io multiple transports cross domain invested with bugs

    poorly / not maintained / left for dead no message order guarantee dies behind firewall/virusscanners
  2. engine.io and socket.io 1.0 http://github.com/automattic/engine.io supports multiple transports cross domain

    upgrade instead of downgrade works behind firewalls & virusscanners not well battle tested yet no message order guarantee
  3. google’s browserchannel https://github.com/josephg/node-browserchannel https://code.google.com/p/closure-library/source/browse/closure/goog/net/browserchannel.js multiple transports client maintained by google

    message order guaranteed works behind firewalls & virusscanners not cross domain no websocket support coffeescript on the server for node ._. not well documented & relatively unknown
  4. Sending real-time updates Cross browser No need for binary data

    Medium lived connections Stability required over latency
  5. sockjs https://github.com/sockjs multiple transports 
 (tons of them) cross domain

    poor error handling no query string allowed for connect connection delay with firewalls poorly maintained in the way of developers
  6. Sendings lots of data using the most optimal transport Cross

    domain Cross browser No need for binary Long lived connected sessions
  7. cd your-awesome-project! ! $ npm install --save primus ws! !

    echo "??" ! echo “profit!”! ! vim index.js
  8. 'use strict';! ! var Primus = require("primus")! , server =

    require("http").createServer(fn)! , primus = new Primus(server, { transformer:"ws" });! ! primus.on("connection", function connection(spark) {! console.log("connection received", spark.id);! spark.write("ohai");! ! spark.on("data", function data(msg) {! console.log("received", msg);! });! });! ! server.listen(8080);
  9. <script src="http://localhost:8080/primus/primus.js"></script>! <script>! 'use strict';! ! var primus = new

    Primus("http://localhost:8080");! ! primus.on("open", function connected() {! console.log("connection opened");! primus.write("ohai");! });! ! primus.on("data", function data(msg) {! console.log(“received", msg);! });! </script>
  10. module.exports = require(“primus/transformer").extend({! server: function () {! // This is

    only exposed and ran on the server.! },! ! client: function () {! // This is stringified end send/stored in the client.! // Can be ran on the server, if used through Node.js! },! ! // Optional library for the front-end, assumes globals! library: fs.readFileSync(__dirname +"./yourclientlib.js")! });
  11. primus.on("end", function disconnected() {! console.log("connection ended");! });! ! primus.end();! primus.write();!

    ! fs.createReadStream(__dirname + '/index.html').pipe(spark, {! end: false! });
  12. var primus = new Primus(server, { ! parser: "EJSON" //

    or binary-pack or a third party module! });
  13. module.exports = {! encoder: function (data, fn) {! // encode

    data to a string.! },! ! decoder: function (data, fn) {! // decode data to an object! },! ! // Optional library for the front-end, assumes globals! library: fs.readFileSync(__dirname +"./yourclientlib.js")! };
  14. primus.transform('incoming', function (packet) {! // This would transform all incoming

    messages to foo;! packet.data = 'foo';! });! ! primus.transform('outgoing', function (packet) {! // This would transform all outgoing messages to foo;! packet.data = 'foo';! });
  15. var Primus = require("primus")! , server = require("http").createServer(fn)! , primus

    = new Primus(server, { transformer:"ws" });! ! primus.write("message"); // send message to all users! ! primus.forEach(function (spark) {! // Or iterate over all connections, select the once you! // want and only write to those! ! spark.write("message");! });
  16. // The long awaited Socket.IO 1.0 release with Primus:! !

    var server = require("http").createServer(fn)! , primus = new Primus(server, { transformer:"engine.io" });! ! primus.use(“emitter","primus-emitter")! .use(“multiplex”, require(“primus-multiplex”))! .use(“primus-emitter”, "primus-rooms");
  17. module.exports = {! server: function () {! // This is

    only exposed and ran on the server.! },! ! client: function () {! // This is stringified end send/stored in the client.! // Can be ran on the server, if used through Node.js! },! ! // Optional library for the front-end, assumes globals! library: fs.readFileSync(__dirname +"./yourclientlib.js")! };
  18. var server = require("http").createServer(fn)! , primus = new Primus(server, {

    transformer:"sockjs" });! ! primus.before(“session”, require(“session-parse-module”))! .before(“middleware-name”, "middleware-module-name");
  19. var server = require("http").createServer(fn)! , primus = new Primus(server, {

    transformer:"engine.io" });! ! primus.on(“connection”, function middlewarish(spark, next) {! // do async stuff, all other “connection” events will not! // be called until this one completes..! next();! });