signalr. code, not toothpaste - techdays belgium 2012

34

Upload: maarten-balliauw

Post on 19-May-2015

13.843 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: SignalR. Code, not toothpaste - TechDays Belgium 2012
Page 2: SignalR. Code, not toothpaste - TechDays Belgium 2012

SignalR. Code, not toothpasteRealtime client/server communication

Maarten BalliauwTechnical ConsultantRealDolmen

@maartenballiauw

Page 3: SignalR. Code, not toothpaste - TechDays Belgium 2012

R

Page 4: SignalR. Code, not toothpaste - TechDays Belgium 2012

Maarten Balliauw

@maartenballiauw

Who am I?

Web & cloudWindows Azure

Page 5: SignalR. Code, not toothpaste - TechDays Belgium 2012

Agenda

Why real-time & how?Meet SignalRConnections and HubsClientsQ&A

Page 6: SignalR. Code, not toothpaste - TechDays Belgium 2012

Why real-time & how?

Page 7: SignalR. Code, not toothpaste - TechDays Belgium 2012

Users want the latest info, NOW!Twitter – live searches/updates Stock streamersAuctionsLive scoresReal-time notificationsInteractive gamesCollaborative appsLive user analytics…

6

Page 8: SignalR. Code, not toothpaste - TechDays Belgium 2012

HTTP is an old beast…

Never designed for real-time communicationsWeb is request-responseWeb is stateless

HTML5 WebSockets to the rescue, right?

Page 9: SignalR. Code, not toothpaste - TechDays Belgium 2012

HTML5 WebsocketsExtension to HTTP

Provide raw sockets over HTTP

Full-duplex

Traverses proxies

It’s still a draft…

Not every proxy server supports it

Not every webserver supports it

Not every browser supports it

They are raw sockets!

Page 10: SignalR. Code, not toothpaste - TechDays Belgium 2012

HTTP/1.1 200 OKContent-Type: text/plainTransfer-Encoding: chunked

Forever Frame

Server tells client that response is chunckedClient keeps connection open untill server closes itServer pushes data to the client followed by \0Consumes server threads

Client<script>eval("... ")</script>\0

<script>eval("... ")</script>\0

Server

Page 11: SignalR. Code, not toothpaste - TechDays Belgium 2012

Periodic polling

Poll from time to time using AjaxDelay in communications due to polling intervalWastes bandwidth & latency

Polling interval

Client

Server

Fiddlerhootsuite.com

Page 12: SignalR. Code, not toothpaste - TechDays Belgium 2012

Long polling

Poll but don’t respond untill there’s dataPoll again after data received or after the connection times outConsumes server threads & connection resources

Client

Server

Fiddlerfacebook.com

Page 13: SignalR. Code, not toothpaste - TechDays Belgium 2012

Options!Forever FramePeriodic pollingLong pollingHTML5 WebSockets(Server-Sent events)

Page 14: SignalR. Code, not toothpaste - TechDays Belgium 2012

Meet SignalR

ARRR!

Page 15: SignalR. Code, not toothpaste - TechDays Belgium 2012

SignalR?

Three-in-one!“Persistent” client/server connection over best transportAbstracts away the transportProvides just one programming model

Page 16: SignalR. Code, not toothpaste - TechDays Belgium 2012

SignalR?David Fowler and Damian Edwards(two guys on the ASP.NET team)

Not an official Microsoft project (yet?)OSS project on Github, MIT licensedhttp://github.com/signalr/signalr

Simple to setup & just worksDepends on C# (not VB.NET), .NET 4+ and jQuery

Page 17: SignalR. Code, not toothpaste - TechDays Belgium 2012

Where do I get it?

where else!

http://amzn.to/xrzS6j

Page 18: SignalR. Code, not toothpaste - TechDays Belgium 2012

Hello, SignalRdemo

Page 19: SignalR. Code, not toothpaste - TechDays Belgium 2012

BONUS DEMO!Knockout.js & SignalR

Page 20: SignalR. Code, not toothpaste - TechDays Belgium 2012

What just happened?The server is broadcasting a message every few secondsClients are receiving messagesCode looks easyNo polling or whatsoever (at least not in my code)

Page 21: SignalR. Code, not toothpaste - TechDays Belgium 2012

Connections and Hubs

Page 22: SignalR. Code, not toothpaste - TechDays Belgium 2012

Two connection modelsPersistentConnectionCan communicate with 1..N clientsIs an IHttpHandlerRequires a route to be definedLimited to sending messagesYou define the “protocol”

HubsCan communicate with 1..N clientsAbstraction over PersistentConnectionRoute automatically mapped (/signalr/hubs)Can send messages and call methodsSignalR defines the protocol

Page 23: SignalR. Code, not toothpaste - TechDays Belgium 2012

Hello, SignalR hubsdemo

Page 24: SignalR. Code, not toothpaste - TechDays Belgium 2012

HubsHub methods can be called from clientClient methods can be called from hubTarget individual clientTarget all clientsTarget group of clients

http://jabbr.net

Page 25: SignalR. Code, not toothpaste - TechDays Belgium 2012

Clients

Page 26: SignalR. Code, not toothpaste - TechDays Belgium 2012

So far we’ve used…

On the server sideHost in any ASP.NET application (SignalR.Server)

On the client sideJavaScript (SignalR.JS)

But there’s more…

Page 27: SignalR. Code, not toothpaste - TechDays Belgium 2012

There’s a lot more!

On the server sideHost in any ASP.NET application (SignalR.Server)Use “SelfHost” - https://github.com/SignalR/SignalR/tree/master/SignalR.SelfHost Use Windows Azure

On the client sideJavaScript (SignalR.JS)Any .NET client (SignalR.Client)Any WP7 device (SignalR.Client.WP7)iOSAndroid

Is this a replacement for WCF?

Page 28: SignalR. Code, not toothpaste - TechDays Belgium 2012

DeckCastdemo

Page 29: SignalR. Code, not toothpaste - TechDays Belgium 2012

Session Summary

SignalR is three-in-one!“Persistent” client/server connection over best transportAbstracts away the transportProvides just one programming model

Connections & HubsConnect various clients

Page 30: SignalR. Code, not toothpaste - TechDays Belgium 2012

Make the web realtime!Install-Package SignalR

Page 31: SignalR. Code, not toothpaste - TechDays Belgium 2012

Be what’s next• Find everything here

http://aka.ms/mbl-tech• Visual Studio Developer Preview Downloads

http://aka.ms/mbl-tech/devprev• MSDN HTML5 Developer Center

http://aka.ms/mbl-tech/html5

Page 32: SignalR. Code, not toothpaste - TechDays Belgium 2012

Maarten Balliauw

@maartenballiauwQ&A

Page 33: SignalR. Code, not toothpaste - TechDays Belgium 2012

© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Page 34: SignalR. Code, not toothpaste - TechDays Belgium 2012

ResourcesMy bloghttp://blog.maartenballiauw.be SignalR on Githubhttp://github.com/signalr/signalr SignalR on NuGethttp://www.nuget.org/packages?q=signalr Websocketshttp://github.com/signalr/signalr.websocketsScale-out on Windows Azurehttp://vasters.com/clemensv/2012/02/13/SignalR+Powered+By+Service+Bus.aspxObjective C clienthttps://github.com/DyKnow/SignalR-ObjCAndroid client (using MonoDroid)https://github.com/SignalR/SignalR/pull/127