Search code examples
phpjavascriptjquerywebsocketserver-sent-events

Best way for client to retrieve chat messages from server?


I'm building a chat application with JavaScript, jQuery, MySQL and PHP, and I'm just wondering what is the best way for the client to retrieve chat messages from the server? My current potential candidates are Polling, Long Polling, HTML5 Server-Sent Events (EventSource), and WebSockets. Which of these would be the fastest (instantaneous messages) and most efficient method (explain why too if possible)? Or if there a better way to do this, please detail it in the answer.

Additionally, I've also looked at Node.js + Socket.IO, but the documentation and sample code I found for those did not make a drop of sense to me.

Finally, I'm using XAMPP as my local server and MySQL as my database for this application.

Any help would be appreciated.


Solution

  • Coincidentally, your listed options are listed in order of efficiency, from least to most.

    Polling is the least efficient. It will poll whether there are messages or not and it introduces a latency between a message being sent and received by other clients.

    Long polling is better; then you can get the message when it's sent, but then there might be a slight delay in reconnecting. During that delay, messages will not be delivered, but otherwise, it's practically instantaneous.

    COMET (not mentioned) is better than long polling, but worse than Server-Sent Events. It, too, must occasionally reconnect due to most web servers and browsers having timeouts on connections, but connections need not be re-established whenever a message is sent. Like long polling, there might be a delay while reconnecting, but otherwise, it's usually instantaneous.

    Server-Sent Events are similar to COMET, but when not shimmed, it has native support from the browser, so it can bypass the timeout limitations and only needs to make one connection over its lifetime (as long as the connection isn't broken). Another advantage is that it automatically reconnects if the connection is broken without any client-side code needed on your part. This is instantaneous.

    WebSockets are by far the best out of all of those options; it only needs one connection, and it's duplex: not only can you receive messages through it, but you can also send messages through it rather than needing to connect to the server separately every time you want to send a message. Unlike Server-Sent Events, it does require some more code: it does not automatically reconnect if a connection is broken and server-side implementations are typically more complex. I'm also not sure if you can use it with Apache/XAMPP. This is instantaneous.

    Socket.io is a library that supports (almost?) all of these and some more (e.g., Flash sockets) and abstracts it behind a nice API, so you don't have to deal with the idiosyncrasies of browser support for each of them. It is as fast as the transport it chooses to use, which depends on the browser it's running on. It also can cut down on the amount of code you have to write. However, if it's too complex for you and you don't care about older browsers, it is certainly not necessary. Additionally, it really likes to be run on its own. You might be able to get XAMPP to proxy to it, but again, I don't know if Apache can be configured to forward WebSockets to it.