The clock problem - to if or not to if?

Question

Let's say, we have a simple digital clock. To "power" it, we use a routine executed every second. We update seconds part in it. But, what about minutes and hours part?

What is better / more professional / offers better performance:

1. Ignore all checking and update hour, minute and seconds part each time, every second.

2. Use if + a variable for checking, if 60 (or 3600) seconds passed and update minute / hour part only at that precise moments.

This leads us to a question, what is better -- unnecessary drawings (first approach) or extra ifs?

I've just spotted a Javascript digital clock, one of millions similar on one of billions pages. And I noticed that all three parts (hours, minutes and seconds) are updated every second, though first changes its value only once per 3600 seconds and second once per 60 seconds.

I'm not to experienced developer, so I might me wrong. But everything, what I've learnt up until now, tells me, that if are far better then executing drawing / refreshing sequences only to draw the same content.

Answer 1

1. Consider drift, as Mason Wheeler mentioned. Do not increment each counter, rather update the clock state directly.

   Do not assume that every minute has 60 seconds. Some have 59, others 61. If you do naive datetime math, you will also stumble over timezone and daylight saving time issues, or create new Y2K Y2038 bugs. Most languages have solid datetime libraries, use them instead to determine what time it actually is.

2. Updating three clock hands isn't necessarily significantly more expensive than updating one. If updates are expensive, one would usually draw to an off-screen buffer and update once (often, this technique also makes for smoother animations). Note: updating ≠ drawing.

   Consider also that each update may cause a re-draw of the whole image. If the moved clock hand covered part of another, then the hand below will have to be re-drawn anyway. If multiple layers are composited over another, then your code may not realize this, but a redraw will still take place: the final image is (presumably) just a buffer of bytes.

All in all, I am vehemently opposed against trying to save a few cycles by taking the wrong shortcuts. Yes, a good programmer will try to write efficient code, but this is a wonderful example how premature optimization can be evil.

So if and only if it is valid to take the shortcut of only drawing updates when necessary, then by all means please do so. Otherwise, use the presumably inefficient variant (conjecture: it isn't that bad), or find other ways to optimize.

Answer 2

Efficiency is important, but accuracy is even more important. This is why a good JavaScript clock will do exactly what you're describing.

It works something like this:

function update_clock
  Update current time (completely)
  set a timer to come back 1 second later and call update_clock

This may seem like overkill, but remember that the timers are not 100% accurate. If it comes back 1.01 seconds later instead of 1 second later, your clock can start to drift, which means simply adding 1 to the seconds value isn't good enough. Also, this way it can be done with only one timer, instead of needing two or three.

Also, let's say someone is viewing a webpage, and then they put the system to sleep for a few hours and start it back up. If your clock script resynchronizes correctly every second, this won't cause any glitches; the clock will just resynchronize against the system clock. Fancier attempts might well get screwed up by this.

Remember, correctness is almost always more important than efficiency, especially when it's not actually causing a performance bottleneck in your code.

Answer 3

doTick() {
    second++;
    if ( (second % 60) == 0 ) {
        minute++;
        second = 0;
        if ( (minute % 60) == 0 ) {
            hour++;
            minute = 0;
            if ( (hour % 24) == 0 ) {
                day++;
                hour = 0;
            }
        } // end 60 minute check
    } // end 60 second check
} // end doTick()

No unnecessary checks or increments.

However, if you want accurate time use the JavaScript Date object (assuming you are using JavaScript). As another commenter said, in the real world you generally can't rely on something calling your function exactly every second.