How can I implement a realtime dashboard?

问题

I would like to implement a realtime dashboard like an index page of www.foursquare.com

I checked foursquare.com's index page with Chrome's developer tool and surprised that they don't use xhr to get those information approx. every 5 seconds.

Using ajax polling causes memory leak in some browsers and make a server busier.

Is there any way that I can implement a realtime dashboard efficiently with PHP and jQuery(AJAX)?

(Perhaps I need an extra server something like a push server?) :|

回答1:

Foursquare's homepage loads 30 items (id=recent29, id=recent28, ...) but displays only 11 at once. So you will have a real-time feeling for about 90 seconds (after that, the same items reappear).

...
$('#recent'+toShow).slideDown(1000, move(i));
$('#recent'+i).slideUp(1000, move(i));
...

For some bidirectional client server communication, take a look at websockets, even though they are not universally supported yet, they eventually become a standard.

The WebSocket API is being standardized by the W3C, and the WebSocket protocol is being standardized by the IETF.

回答2:

One method to get data pushed to a client is a loop like this:

Open AJAX request in browser.
Server waits with the request open until it either times out or new data is available.
Server returns the request with either new data or a timeout, and client immediately opens a new request.