Communicating with the help of HTML5

Digvijay Upadhyay
3 min readOct 28, 2018

--

Web Sockets, Server-Sent Events and WebRTC

In an old front end world a typical communication looks like below.

A typical client-server communication

The client send a request and the server sends the response. The communication is stateless. I will not go into the pros and cons of stateless communication. The objective of this blog is simply to learn what other approaches are available.

1. Web Sockets

The WebSocket API is an advanced technology that makes it possible to open a two-way interactive communication session between the user’s browser and a server. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply.

Web Socket connection with server

The connection is a two way connection, server can update the client at any event and vice versa. This is most useful when polling server for the data or event.

2. Server-Sent Events

With server-sent events, it’s possible for a server to send new data to a web page at any time, by pushing messages to the web page. These incoming messages can be treated as Events + data inside the web page.

Server-Sent events

The server sent events are one way messages from server to the client. Client interprets the message and uses the data to perform an action.

3. WebRTC

WebRTC (Web Real-Time Communications) is a technology which enables Web applications and sites to capture and optionally stream audio and/or video media, as well as to exchange arbitrary data between browsers without requiring an intermediary. The set of standards that comprises WebRTC makes it possible to share data and perform teleconferencing peer-to-peer, without requiring that the user install plug-ins or any other third-party software.

WebRTC gets rid of the middle man and allows multiple browser to communicate directly. The browsers establish connection using the server and once the they are connected they are able communicate directly.

Advantages

  • Can reduce the use of communication apps using the browser is much more efficient
  • More secure since RTC components use encryption
  • Runs inside the browser without creating a new process

Challenges

  • It’s not compatible with all the browsers yet
  • There is no standard signalling protocol

--

--

No responses yet