The Best Way to Send Data From Backend to Frontend: Server Sent Events

hey everyone welcome back and in this video we're gonna discuss about server sent events sse what they are in backend programming and how they differ from web sockets and in general what is the need for a system like this let's go if you're new here make sure you leave a like subscribe to the channel and hit the bell icon this is free of cost and helps the channel grow so we're gonna start off very quickly with a little bit of background around how data from server to client comes so if this is your server let's say and this is your client there are mainly two three ways today you can transfer some data to this client over internet when you're using a browser right the first one is you establish a connection over http which is your regular you know you're visiting index.html or any sort of page like this when you visit these pages you establish a http connection over tcp you transfer something and you're done the second way you establish connection is using something like websockets where you know you open a bi-directional tcp connection with the client and the server so the client can send something to the server the server can send something to the client and you're good enough right and the third thing which is it's kind of built on http itself it's like polling or you can also say servocent events right so it's they are not exactly same but they work in a similar fashion so what is the difference between you know all three of them and how they all work let's take a look so let's start with http first because when we understand both of them then only we can understand what sse is and why it is required so http over here is a short-lived connection right the client quickly tells that hey i want this slash abc.html page whatever it is and the server quickly gives it back and that's it that's done everything is done connections are closed http connection is closed on the other hand websocket if you take a look opens up a kind of a pipe between your server and client right this is something which we have discussed a lot of times on this channel as well how its sockets work how http works and so on but this pipe over here allows the client and the server to speak simultaneously with each other which is also something you might need for example in case of chat application polling on the other hand is a hack or is a kind of a compromise between http and web sockets where polling says that hey as a client i would probably you know just ping the server every once in a while maybe once every single second or a couple of seconds and then ask sir what if there is new information then i'm gonna do that again if there is new information then i'm going to do that again if there is new information so this is like polling or short polling there is another way that is called as long polling which where you as a client send the request and the server does not respond until it has data right so in long polling this delay is not 1 2 second it might be 20 30 seconds as well and then server immediately replies i have some data clients get the data and they send another request and the cycle repeats so you see over here in these three architectures which we discussed the http one the websocket one and the polling one the polling one actually makes a little bit of sense if you think about this when only server needs to send data to the client and there are a lot of applications for example if you're seeing a dashboard a real-time dashboard of some sort where you know you have graphs and stuff and bad shots and what have you anything here if you want to add a real-time functionality then having a system like polling or server-side events would be useful but how does server side event work and how is it different from polling let's take a look on that now so just like polling or websockets what server side even does is that this establishes an http request from client to server right so this connection is over http it's not upgraded to websocket in websocket case the connection actually gets upgraded to the tcp connection in this case it stays http but this server side event is a special form of polling or you know it's not polling at all it's a special form of infrastructure or it's a special form of conveying data from server to client where this connection over here is stable in a way that if your server implements server side events it can open a server side event and even source using an event source with the client where server has the capability of sending unidirectional messages to the client that means it almost acts like a single flow pipe where server can inform the client about all the necessary updates which the server wants now you might ask what is the advantage of server side events over websockets let's say so the fact that server side events only work on http layer i mean they don't do any funky stuff with connection upgrades and tcp and all that stuff this is actually compliant or this is like friendly with firewalls or load balancers or you know reverse proxies and so on so servo send events these requests to the browser would actually not be blocked or not be interfered with firewalls load balances and stuff not to say that websockets are unsupported or anything like that but if you're if you're actually coding in a constrained environment maybe like in a college or in a university or somewhere where they are actively blocking access to a few applications then maybe server side events might be a one way to you know implement certain functionality over that i do believe like listing a bunch of more benefits would be one thing which we can do for example some people say that they have found server side events to be more beneficial or more performant than web sockets but i don't know if this is true or not in a universal way so take it with a grain of salt but yeah i mean in most cases you can pretty much work with websockets too if you're working with server side events because at the end of the day you are stuck with the primary server right it's a stateful connection unlike polling or unlike long polling where when this new connection gets established you can probably get a different server all together in server certain events or server side events you actually have to you know stick to the same server for the whole life cycle of that sse so yeah i mean the server sent events is an interesting technology and maybe you can also see a couple of examples so far on how it works and how it implements it is implemented but i do believe like websockets is still a good way that's just my personal opinion to actually implement anything which is real time and even unidirectional in some cases right but again like i said you should know about service and events because this is like an important topic for back-end web development it is supported by most of the modern browsers but it comes with a severe limitation that currently it only supports six simultaneous connections in a browser right that means until until you are running this on http 2 why http 2 because http 2 can multiplex things right so even though you have two connections on a single server your browser can multiplex this thing into a single connection single tcp connection i should rather say and then just work with your client right so until you are using servers and defense on http 2 i think there is no use of using a lot of service and events on http 1.1 and so on so that's one thing about servers and events but yeah i mean other than that it's basically a technology it's basically a tool to communicate from server to client and you should use it if you feel it is appropriate for your stack yep that's pretty much it for this video hopefully you like this if you did make sure you leave a like and subscribe to the channel that is all for this one i'm gonna see you in the next video really soon if you're still watching this video make sure you comment down in the comment section i watched this video till the end also if you're not part of code dam's discord community you are missing out a lot on events which we organize on a weekly basis to code you already know the drill make sure you like the video subscribe to the channel if you haven't already and thank you so much for watching

Channel: Mehul - Codedamn

Views: 40,067

Keywords: mehul mohan, codedamn, programming, backend, frontend, https, web sockets, http, server sent events, node, node.js, javascript, java, wsbrowser, html5, dom, learn programming for beginners, coding, learn to code for beginners, full stack programming, programming for beginners, nodejs, web developer, web development, python, web3, web2, full stack

Id: KkI3yHjKjqs

Length: 7min 25sec (445 seconds)

Published: Mon Feb 21 2022