Why would I use SignalR over calling WebSockets directly?

[Music] [Applause] [Music] why would i want to use signalr why wouldn't i especially with websockets being so prevalent just start programming websockets instead uh have you ever programmed to get swim sockets i i i have and it's a bit of a clunky experience signal is not okay so there's your there's your first answer uh the second answer is you will find some clients and some servers out there who for insert reason here don't support websockets you know somebody might have an old browser it still happens believe me um uh uh some lower level devices don't necessarily support web sockets so like there are some smaller devices watches etc etc who might not have support for you know first class support for web sockets so in those cases they would back off and they would use something like long pole um i found that this usually works better with a set of slides that i brought which okay this pm move but do you mind not at all go for it okay cool let me let me hit this real quick now i've only got two monitors um and i think i think that's on the right monitor so if you feel free to speak and interrupt me because i won't see you so that's fine okay real quick like kind of a crash course in what signalr is uh so i'm going to go ahead and just click through a couple of slides so this is kind of your your lawn polling idea so in signalr the first thing we would do is we would do a negotiation which this is all over the signal our documentation i'll give you a link to that later um and and uh essentially what we do is the client will reach out to the server and do a negotiate request the server asp.net core server will basically tell it whether or not it supports web sockets so if it doesn't support web sockets what we do is we you know we go ahead and we start up with long polling you know it's kind of like websockets are first then we'll try server send events and if either one of those don't work then we back up and we tried long pulling because i'm calling this you know request response model so in long polling essentially what happens is this you know client would make it you know requested the server server is going to you know fire an event make a response and then immediately the client's going to make another request you know you've probably done this you know early on before we had websockets before we had signalr and this is really like your med equip refresh or like a javascript refresh or you know you just make a series of ajax calls and like you know a schedule so we've all had to do this kind of thing before um at one point uh it got better and we had the concept of servers and events in which case you could just create a new event source and then whenever an event happens on the server it actually sends a message back out to the client um you know this is kind of your your you know if you don't have websockets you want to have ssc you know um but you know lawn polling is always going to be your you know your all the way back off um but in the perfect world uh you know your client and your server would both have web sockets and web sockets basically what happens is you know you make that negotiate request the server says i support websockets you're good uh the clients that's cool i'd like you to upgrade this connection and make it a websocket connection uh the moment it does that it switches protocols to web sockets and now you are partying in real time and now all the messages just continue to go back and forth so this is kind of like most times with your new browsers this is what you're going to see because of the fact that you know most clients and servers actually already support you know you know this kind of an experience so um one thing i'd like to point out though is like it's always fun when you can see what you can do with it um so let me kind of show you just kind of a silly little 3d demo that i've got here and what i'll do is i'll pull open a quick little quick little uh thing right here and what i'll do is i'll drag this over and i know you've got some javascript uh watchers out there so you know you want you won't want to look at my javascript code in gratuitous detail i'm not that great at it we'll get to that later um but this is essentially kind of a 3d rendering or you know a 3d you know series of images stitched together using 3js which is a fantastic like 3d uh kind of javascript engine and what i can do with this is go like this which is pretty neat it looks great on screen you know basically i have this pane here and the pane kind of shows you know all the different images around essentially this is just a series of images that just get kind of stitched all together um now what i also have is a control panel and what i'll do is i'll copy this out and just paste this in and just go to controls and i'm not going to do it here because i want to be able to kind of i want you to be able to see what's going on on my screen so what i'll do is i'll show you that i've actually got that pulled up on my phone i don't know if you can see that very well but i've kind of got the same thing i've got an x y and z slider so what i'll do is now i'll grab one of those sliders let me refresh it and connect again let me grab one of those sliders and you can see as i move the x slider around we're actually spinning that on an x-axis when i spin the y-slider around we're spinning it on the y-axis and the javascript code that i have is old enough that the gyroscope part no longer works because a lot of those apis have been deprecated so i have to get back into the code and like update that but eventually what i'll be able to do is show you how i can take my phone and go like this and that plane will move around um but i'm using kind of some old javascript apis in there that don't really exist anymore but what i can do is just pull that other page back up again and what i can do here is kind of pull this off to the side and we'll get a couple of these panels open up um pull that one over here and just kind of do a new browser right here what you'll see is that for each one of these connected clients whenever i use this control panel they're all going to move so that's kind of what signalr is for it's for those like interactive experiences where you've got multiple browsers across multiple users maybe in different places like we are right now and the idea is that you can actually use signalr so that when something happens when an event fires when somebody does a send or an invoke on this side we actually have code over here that literally looks like on and then the event name and then how to process it so if you've ever done like a lower level websocket programming you know that's not what it looks like so this is sort of a hyper simplification of that um it's also something that you know you have to give uh david and damien a lot of respect they kind of have this ability to like see into the future and like one thing that david said at one point was like do you think websockets is going to be the last thing like of course not it goes well if you're using signalr it won't matter because we'll just add whatever the new thing is to it it'll keep working so that's one of the reasons for for signalr you know in the in you know the early days it was because we lacked web sockets support uh today it's because like websockets is probably not going to be the the last thing that we do to enable real time on the web so if you're programming against signalr at the point where we add it in and i'm not saying that we're going to do this let me just get that out there very quick just give you a random idea uh then not saying we're doing this i've i've pitched it in the team room and they throw things at me so i don't know if this will ever come but if you can imagine something like signalr over grpc again not proposing that we're doing that or signalr over http 3 or whatever protocol gets invented next month um uh you know that's where you know the the abstraction layer of signalr becomes pretty valuable you know at that point you can kind of do more stuff

Channel: Microsoft Developer

Views: 6,424

Keywords:

Id: -z7ylpXiwUQ

Length: 7min 46sec (466 seconds)

Published: Tue Jun 01 2021