Firebase Countdown Timer Synched Across Multiple Clients

Question

I am going to take a crack at building a penny auction site for a specific niche using angular JS. I am trying to plan the countdown timers and i've been itching for a reason to try out firebase.

I had the idea yesterday to have each auction somehow have a countdown in the actual database, because with 2 way data binding, peoples clientside will always stay updated.

When the firebase changes, all the connected clients instantly change. So my question is this... How could I do a server side countdown within a particular record.

So say I had a record for item x and it had all that items information and one of the array keys is "countdown: 59:01:00". What is a realistic and scalable way to countdown from 59:01:00 to 00:00:00 on the SERVER side.

I was thinking maybe a cronjob that runs every 1 second? But then with hundreds of database entries running hundreds of countdowns each second, the server would probably crash.

Any good ideas?

Answer 1

Firebase could indeed handle hundreds of database operations every second (many more in fact). But this would be greatly over-engineered.

Instead of running a timer that updates every second on the server, simply store the start/stop times of the event and allow the clients to manage their own timers. This should not be done by decrementing by 1 every second (as setInterval and other client-side tools are not very exact) but by comparing the current timestamp to the end, and determining the difference.

timeout = setInterval(countDown, 1000);
function countDown() {
    setTime(Math.max(0, endsAt - Date.now()));
    if( endsAt <= Date.now() ) { clearInterval(timeout); }
}

function setTime(remaining) {
    var minutes = Math.floor(remaining / 60000);
    var seconds = Math.round(remaining / 1000);
    $('#timer').text(lpad(minutes) + ':' + lpad(seconds));
}

Most likely, the reason you want the server in charge of the timer is to make it "fair." But this isn't logical. If each user keeps their own "ticker" down to the end time, and the start/end time are fixed, there is nothing to hack here.

Answer 2

I was dealing with similar problem as you do.

The problem number one is that there is no server side code. Firebase is data storage and whatever logic you have to implement needs to be divided into database design and client side code.

The second problem how to make client listen to time stamp change from future to past if the actual time stamp field in database is not changed.

Client can always ask for current server time by pushing time stamp placeholder and listening to change.

auction:{
  countdown:{
    ends_in: NUMBER_IN_MLS,
    start_time: TIME_STAMP
  }
}

users_current_time: TIMESTAMP_PLACEHOLDER

if user starts on the app and wants to see current auctions the current server time is immediatelly pulled and the timer on client side starts from 0. - This action can be repeated everytime user goes Online. Now when the user pulls the auction he will get the time when it started and the duration. You also have the current server time and the time you are online. This should give you quite precise information on how much time is left.

Third problem: My bigger concern here would be security. The auction should be closed once the time is up however with only firebase as backend all clients still have write permission to submit their bids.

I still would recommend some server which would do all the housekeeping and calculating the countdown.