Once upon a code…

In the bustling digital city of Browserville, lived a tiny but mighty character named Tocky the Timekeeper. 🧙‍♂️⌛

Tocky had a superpower: he could track time so precisely that he became the official time wizard for every JavaScript program in the land! Whether it was a new game starting, an animation dancing across the screen, or a race between two buttons, Tocky was there — stopwatch in hand — ready to count every tick.

🕰️ The Two Magical Clocks

Tocky used two magical time-tracking tools:

1. The Old Clock – Low-Resolution Timestamp

Tocky’s first clock was a bit like your grandpa’s wristwatch — simple, steady, and always counting milliseconds since a very special birthday: January 1st, 1970. 🎂 (That’s when time began for computers — no kidding!)

To check the time on this clock, Tocky would say:

Date.now()

And boom! A number like 1461069314000 would pop up — telling him exactly how many milliseconds had passed since that 1970 birthday.

“That’s a LOT of milliseconds!” chuckled Tocky.

But what if you don’t want milliseconds? What if you want the time in seconds? No problem! Tocky had a math trick up his sleeve:

Math.floor(Date.now() / 1000)

“Divide by 1000,” he explained to the young coders of Browserville, “and you’ll turn those tiny milliseconds into full-grown seconds!”

🧮 Remember: 1000 milliseconds = 1 second!

2. The Stopwatch of Precision – High-Resolution Timestamp

Now Tocky’s second tool was for serious speed tracking. Imagine you’ve just opened a game, and you want to know exactly how long it’s been running — down to microseconds (that’s millionths of a second 😲).

For that, Tocky used his shiny Stopwatch of Precision, known as:

performance.now()

“This stopwatch doesn’t care about 1970,” Tocky said. “It starts counting from the moment your game or website opens!”

So if your game started 6,288 milliseconds and 319 microseconds ago, performance.now() would give you:

6288.319

“Perfect for smooth animations and race timers!” Tocky grinned.

🖥️ What If You Have an Old Browser?

One day, Tocky met a computer from the ancient village of Internet Explorer. It didn’t understand Date.now(). Oh no!

But Tocky wasn’t worried. He had a backup spell:

(new Date()).getTime()

“It works just the same,” said Tocky, patting the old machine. “A bit slower, maybe — but still strong!”

💡 Tocky’s Top Tips:

  • Use Date.now() for regular, everyday time tracking.
  • Use performance.now() when you need super precise timing (like for animations or measuring performance).
  • Use (new Date()).getTime() if you’re coding for older browsers.

🧠 Review Time with Tocky!

Let’s see how much you remember from this time-traveling tale!

🧩 Practice Questions:

  1. What magical date does Date.now() start counting from?
  2. How many milliseconds make up one second?
  3. Which method gives you more precise timing: Date.now() or performance.now()?
  4. How can you get the current time in seconds using Date.now()?
  5. What can you use instead of Date.now() on old browsers?
<
Previous Post
🔍 Python Debugging: The Day Zobo the Robot Froze!
>
Blog Archive
Archive of all previous blog posts