Keeping a countdown timer synchronized across multiple browsers via a date/time stored on the database

Question

I want to try and keep a timer synchronized across multiple browsers/clients which is counting down to a date stored within the database. If the date changes for some reason then I will need to update the timer appropriately. This is going to be eventually part of this JavaScript game that i am trying to create but i need the core of the game before i can really continue.

This timer will essentially be dynamic as the time will need to be easily changed if necessary. I came up with the idea of polling the database via a PHP script for changes every second which would also help to sync the timers across browsers. However, this seems rather server intensive and may not actually sync the timers if there is latency, which is likely.

Any ideas would be helpful, thanks.

SQL:

CREATE TABLE timer(
    timer_id    INT       PRIMARY KEY  AUTO_INCREMENT,
    timer_date  DATETIME  NOT NULL
);

JQuery:

$(document).ready(function() {
            $('#button').click(function() {                     
                //get timer id
                var timerId = $('#button').attr('tid');
                //disable button
                $('#button').attr('disabled', 'disabled');              
                //send ajax request
                $.ajax({
                    url: "process.php",
                    type: "POST",
                    data: "id="+timerId,
                    dataType: "json",
                    success: function(data){
                        //IF TIMER HAS CHANGED UPDATE ELSE DON'T DO IT

                        //re-enable button        
                        $('#button').removeAttr("disabled");
                    }
                });
            }); 

Answer 1

You have two options, polling or TCP keepalive. Either should work, though polling is easier to implement.

Think of this in terms of you providing a web service to your game client. From the clients perspective, it doesn't care that a database is involved. So with that in mind, setup your timestamp URL (say, sync.php) then setup something in memory like memcache to store the data so you're not incurring the db overhead all of the time.

I'd also think hard about critical paths in the client. Do you really need to poll every second? Network latency might just be a factor if that's the case. You client should have enough smarts to know if something is dependent on the time being accurate and you should code around that.

Update 1:

In response to your code sample, I'd like to suggest that you look at using GET instead of POST for polling, since you're not actually changing the state of the system but trying to retrieve information from it (I'm inferring this from your question since the code seems that you actually are changing the state of the system).