WebRTC Tutorial - How does WebRTC work?

all right my name is Jonathan and my talk is going to be on web RTC so this is the agenda I'm going to talk about what is web RTC what does it do how it works and what's going on behind the scenes I'm going to talk about some of the challenges that this new technology faces and why it's useful to learn and use web RTC so what is web RTC it stands for web real time communication it's basically a connect a collection of api's that allows direct connection between browsers and this allows them to exchange files information any type of data so looking at this write direct connection between browsers it sort of sounds familiar right like WebSockets but not really so the key word here is direct as you can see so for WebSockets it's what happens is there's a connection or communication between only the client and the server there's a lot of things going on in between but that's irrelevant right now if a client wants something it makes a request to the server and the server responds it says ok sure we're connected now if there are multiple clients the same thing they make multiple requests server responds to all of it and since it's a socket it looks more like that so now the client doesn't need to keep making requests every time it's looking for something so if one of the client changes something or makes an update let's say they type in text or upload a file they send it to the server the server processes the information and immediately pushes update to all the other clients and what this process does is that it there's actually a sort of delay right so between the sending client and the server and the server processing all of the information these two clients on the right will have to sort of just sit there and wait normally this isn't a big it's probably only a second at most but this is a huge issue if it comes down to a voice chat or live streaming where one second can change a lot of things so let's take a look at web RTC so with web RTC the clients can actually directly communicate with each other and completely bypass the server so this decreases the latency by a lot because now it doesn't have to the the receiving client does not have to wait for the sending client to the server and then the server to itself so let's let's really take a look at this and try to understand what this means all right so normally a client is really just a browser it's HTML and it makes requests to the server and it waits for a response so that it can update itself and have and contain new information but with web RTC this changes fundamentally the way we think of browsers because now browsers can communicate to each other without the server so how do we kind even know about each other how does it know which client is a connected to if you haven't noticed it at the title it says signaling so that's how it knows so let me give you guys an example this is a server and it's clients so client a would signal to the server like and say something along the lines of hey I need to talk to client B here's my information the server will then take that to client B and say hey client a wants to talk to you do accept and client B says sure here's my information the server then takes that back to client a and says okay this is client feeds information it accepted the connection and it starts the connection between the two clients and with this plot with this connection the client a can now directly talk to type B and the server will know nothing about it so how does this work and what information is client a and B sending to the server and receiving so this is sort of what happens behind the scenes first of course everything goes through the API so the developer interacts with the API the client and server uses this API to set up the connection then there's identifying the client right so how does the server know this is the client and it's not just someone pretending to be the client then there's the type of data that it's sending over is it a video that voice chat is it just some random files what's being sent over then there's Matt traversal so that stands for network address translation and that alone can be attack talk were five so I won't I won't go too deep into it basically what it is is it's a technique that establishes a connection between the clients it's commonly used in peer-to-peer sharing and transferring and it transfers sort of like metadata from the browser such as browser information IP addresses ports and many many more then there's security so identity is already sort of like a type of security but this type of security is about encryption so when data is being sent over and transferred over web RTC automatically encrypts any type of data so that way if someone were to somehow listen in into this transfer of data they won't be able to obtain any useful information finally its codec so this just determines how the data is going to be compressed and sent over so WebRTC sounds great right I mean it allows communication direct communication why did we learn about WebSockets then why isn't this used more often than why isn't it used everywhere well web RTC uses UDP so this in itself isn't really an issue but this type of protocol you P isn't reliable for transferring important data so it's all it does is it sends data really really quickly it just constantly sends data but it doesn't check whether or not the data is being received so this could be useful for something like video on video chat because you can lose a few frames and it's not going to be noticeable but if a file being transferred loses a few bytes of data the entire file can be corrupted another challenge is that web RTC does not have any standard signaling protocol so all the different developers different companies will have their own methods of implementing different protocols and lastly it's not compatible with all of the browsers popular browsers such as Chrome Firefox and Oprah is fully supported no plugins needed it just works straight out but other browsers such as a Microsoft edge and Apple's Safari require external plugins so that WebRTC can sometimes work and if you're using Internet Explorer I mean I'm assuming you don't care for updated technology so that doesn't matter why web RTC then so with WebSockets live streaming is possible but as as I mentioned earlier the streaming is way too slow and there's a very noticeable latency very noise a very noticeable lag but with web RTC streaming can be much quicker and this allows or rather this makes it so that we have no need for extra apps such as Skype or even zoom or vent or whatever people use these days all of you can be done directly from the web browser and companies such as Google and Facebook already implemented this technology in their chat services web RTC is embedded in web technologies so since there's already a connection between client to client the server does not need to use any more resource to process incoming data and then transfer it over so what this allows is that now this company or this server can just say okay here's the connection you guys deal with it and basically they don't have to waste any resources but they're giving their client extra features and there are many many development kits tools and open source libraries that can give us as developers many new interfaces WebRTC also solves many security issues because encryption is mandatory for all WebRTC components and since it's not a plug-in or an extra app it runs inside of the browser's sandbox without creating a new process so no spyware malware or anything can get into your system and also since it's it's using your browser security camera and microphone access has to be granted explicitly so that way you know you won't just your face won't show up on someone else's computer by accident so lastly WebRTC is still a pretty new tool for the browser but it has a lot of potential as its name states for real-time communications so if you guys want to learn more you can go directly to web RTC website or you can check out on YouTube Google i/o just type in web RTC 2013 thank you [Applause]

Channel: Fullstack Academy

Views: 189,964

Keywords: WebRTC, WebRTC Tutorial, How does WebRTC work, How to use WebRTC, WebRTC demo

Id: 2Z2PDsqgJP8

Length: 10min 21sec (621 seconds)

Published: Fri May 05 2017