WebSockets vs Server-Sent events EventSource

Question

Both WebSockets and Server-Sent Events are capable of pushing data to browsers  To me they seem to be competing technologies  What is the difference between them  When would you choose one over the other

User · Answer

One thing to note  I have had issues with websockets and corporate firewalls   Using HTTPS helps but not always    See https   github com LearnBoost socket io wiki Socket IO-and-firewall-software https   github com sockjs sockjs-client issues 94  I assume there aren t as many issues with Server-Sent Events  But I don t know   That said  WebSockets are tons of fun  I have a little web game that uses websockets  via Socket IO   http   minibman com

User · Answer

Websockets and SSE  Server Sent Events  are both capable of pushing data to browsers  however they are not competing technologies    Websockets connections can both send data to the browser and receive data from the browser  A good example of an application that could use websockets is a chat application   SSE connections can only push data to the browser  Online stock quotes  or twitters updating timeline or feed are good examples of an application that could benefit from SSE   In practice since everything that can be done with SSE can also be done with Websockets  Websockets is getting a lot more attention and love  and many more browsers support Websockets than SSE   However  it can be overkill for some types of application  and the backend could be easier to implement with a protocol such as SSE    Furthermore SSE can be polyfilled into older browsers that do not support it natively using just JavaScript  Some implementations of SSE polyfills can be found on the Modernizr github page   Gotchas    SSE suffers from a limitation to the maximum number of open connections  which can be specially painful when opening various tabs as the limit is per browser and set to a very low number  6   The issue has been marked as  Won t fix  in Chrome and Firefox  This limit is per browser   domain  so that means that you can open 6 SSE connections across all of the tabs to www example1 com and another 6 SSE connections to www example2 com  thanks Phate   Only WS can transmit both binary data and UTF-8  SSE is limited to UTF-8   Thanks to Chado Nihi   Some enterprise firewalls with packet inspection have trouble dealing with WebSockets  Sophos XG Firewall  WatchGuard  McAfee Web Gateway     HTML5Rocks has some good information on SSE  From that page      Server-Sent Events vs  WebSockets      Why would you choose Server-Sent Events over WebSockets  Good question       One reason SSEs have been kept in the shadow is because later APIs like WebSockets provide a richer protocol to perform bi-directional  full-duplex communication  Having a two-way channel is more attractive for things like games  messaging apps  and for cases where you need near real-time updates in both directions  However  in some scenarios data doesn t need to be sent from the client  You simply need updates from some server action  A few examples would be friends  status updates  stock tickers  news feeds  or other automated data push mechanisms  e g  updating a client-side Web SQL Database or IndexedDB object store   If you ll need to send data to a server  XMLHttpRequest is always a friend       SSEs are sent over traditional HTTP  That means they do not require a special protocol or server implementation to get working  WebSockets on the other hand  require full-duplex connections and new Web Socket servers to handle the protocol  In addition  Server-Sent Events have a variety of features that WebSockets lack by design such as automatic reconnection  event IDs  and the ability to send arbitrary events      TLDR summary   Advantages of SSE over Websockets    Transported over simple HTTP instead of a custom protocol Can be poly-filled with javascript to  backport  SSE to browsers that do not support it yet  Built in support for re-connection and event-id Simpler protocol No trouble with corporate firewalls doing packet inspection   Advantages of Websockets over SSE    Real time  two directional communication  Native support in more browsers   Ideal use cases of SSE    Stock ticker streaming twitter feed updating Notifications to browser   SSE gotchas    No binary support Maximum open connections limit

User · Answer

According to caniuse com   97 72  of global users natively support WebSockets 96 31  of global users natively support Server-sent events  You can use a client-only polyfill to extend support of SSE to many other browsers  This is less likely with WebSockets  Some EventSource polyfills   EventSource by Remy Sharp with no other library dependencies  IE7   jQuery EventSource by Rick Waldron EventSource by Yaffle  replaces native implementation  normalising behaviour across browsers   If you need to support all the browsers  consider using a library like web-socket-js  SignalR or socket io which support multiple transports such as WebSockets  SSE  Forever Frame and AJAX long polling  These often require modifications to the server side as well  Learn more about SSE from   HTML5 Rocks article The W3C spec  published version  editor s draft   Learn more about WebSockets from   HTML5 Rocks article The W3C spec  published version  editor s draft   Other differences   WebSockets supports arbitrary binary data  SSE only uses UTF-8

User · Answer

Websocket VS SSE    Web Sockets - It is a protocol which provides a full-duplex communication channel over a single TCP connection       For instance a two-way communication between the Server and Browser Since the protocol is more complicated  the server and the browser has to rely on library of websocket  which is socket io  Example - Online chat application    SSE Server-Sent Event  -  In case of server sent event the communication is carried out from server to browser only and browser cannot send any data to the server  This kind of communication is mainly used  when the need is only to show the updated data  then the server sends the message whenever the data gets updated      For instance a one-way communication between the Server to Browser  This protocol is less complicated  so no need to rely on the external library JAVASCRIPT itself provides the EventSource interface to receive the server sent messages   Example - Online stock quotes or cricket score website

User · Answer

Here is a talk about the differences between web sockets and server sent events  Since Java EE 7 a WebSocket API is already part of the specification and it seems that server sent events will be released in the next version of the enterprise edition

User · Answer

Opera  Chrome  Safari supports SSE  Chrome  Safari supports SSE inside of SharedWorker Firefox supports XMLHttpRequest readyState interactive  so we can make EventSource polyfil for Firefox

[html] WebSockets vs. Server-Sent events/EventSource

Examples related to html

Examples related to browser

Examples related to websocket

Examples related to server-sent-events