14

I've noticed while browsing Stack Exchange that there are dynamic notifications like "3 new messages, click to show". I want to have this kind of dynamic updating for what I'm about to explain.

Let's say I want to create a carousel/slideshow of 10 recent news articles. I want this carousel to be updated hourly, in a queue. Newer articles will push older articles out of the queue. The solution off the top of my head would be.

  1. User logs on to client.
  2. Client calculates # of minutes until next hour mark and sets a timer to execute at the hour.
  3. At hour mark, send a request to the server about any new news articles that haven't been in the carousel already.
  4. Handle response.
  5. Reset timer.

Is this an acceptable strategy? Can I achieve this without relying on client requests? In other words how does Stack Exchange achieve its dynamic updating?

8
  • 4
    Have a look at SignalR. Jul 14, 2015 at 2:37
  • I recommend you read up on RSS and AJAX for ideas. RSS is an example of a standard protocol for subscription feeds, and AJAX is a high-level concept for how to update a client (browser) without reloading the page. I would bet this is how Stack Exchange works.
    – user22815
    Jul 14, 2015 at 2:38
  • 1
    @Snowman Stack Exchange uses WebSocket. See meta.stackexchange.com/questions/10369/… Jul 14, 2015 at 2:42
  • Is the client a browser, a custom client or something else?
    – outis
    Jul 14, 2015 at 7:26
  • It's somewhat user hostile, but you could have the HTML page refresh itself every 15 minutes or so. Most news web pages do this. Jul 14, 2015 at 14:51

3 Answers 3

7

In order to push data, you'd have to identify a Client, and that would be done by subscribing the client to the server. Once that's done you'd have a list of subscribed client with a persistent connection.

Depending on what you want to achieve, I'd say it's best for the client to request to the server, so that you don't have to maintain a persistent connection and make use of request/response communication protocols as HTTP.

One example that comes to mind to keep a persistent connection would be a live chat / instant messaging system, as the communication should happen real time.

Keep in mind persistent connection are usually implemented through the use of sockets, which adds an overlay in implementing your own communication protocol, encryption, etc...

2

Basically you need to push data to the client, and as a bidirectional communication is not in the scope of http protocol, its not easy to implement it on your own.

The Solution of your problem is socket.io

As its website states,

"Socket.IO enables real-time bidirectional event-based communication. It works on every platform, browser or device, focusing equally on reliability and speed."

Hope this will solve your problem.

2
  • 8
    It would be helpful, if you state if and how you are affiliated with socket.io and how it will help solving the questioners problem based on your knowledge/experience with the framework (in contrast to a mere "mission statement" of the website)
    – Benni
    Jul 14, 2015 at 7:26
  • 1
    WebSockets are strictly preferable to Socket.IO now that all major browsers implement the standard. Most major languages have websocket implementations, but not socket.io ones. Socket.io adds additional structure to the messages, so it isn't readily compatible, either. Dec 6, 2018 at 9:51
1

I cannot speak for how SE does it although since it is a website there are several ways that they could which could include a cron job set to run a php/asp/what-have-you script on the hour to push data. But this would be if you were looking for a web only solution.

But since you are mentioning a client you could perhaps create a file with the date/time of the latest news update to that client and have the client check the value stored in said file and compare it to the user's system time to see if an hour has passed since the last update. If it has been at least an hour then the client requests the latest news stream from your server which then returns the latest news stream to the client.

I would avoid using a timer or at least using a timer solely as that method would work only if the user keeps the client open to keep the timer running. But if you (also) have the file as I suggested then you can create a subroutine to open the file, store the time into a variable and compare it to the system time and make the request if it has been at least an hour. Then you simply make calls to the sub in relation to certain events. I would definitely call it on form load because if the user is just restarting their client then you'd want the latest news. If it had been a few days since they were on the client then it would be showing news that old. In the least tie that sub to client load and kick off the timer as you suggested. Theoretically as long as the user keeps the client open the timer will keep doing its thing and then you have the sub run on load for when there is no active timer to keep track of the timing.

I apologize if I misunderstood what you were going for as I am not totally certain what you are going for. But hopefully either way there's something of value in here for you!

Not the answer you're looking for? Browse other questions tagged or ask your own question.