Monday Monday Monday open wide dev fans get ready to stuff your face with JavaScript CSS node module barbecue To get workflows break the a soft skill web development the hasty s the craziest the tasty As web development treats coming in hot here is West Barracuda boss and Scott El Toro local Tolinski Welcome to syntax on this Monday hasty treat We're gonna be talking about time. Where does time come from when you say new date in your browser? What the heck's that doing? And what are some of the pitfalls of working with time?
Where are some formats? What are some things about temporal time zones? That's sort of stuff This is gonna be a little bit of a conversation about time, but before we get into that This is episode number 720. Let me just take a quick moment to give a really really sincere Thank you to Chris ends for doing such an amazing job editing our podcast for so long We have brought editing in house in fact We have a new producer Randy rector who will bring on to the show at some point here So that he can say hi to you everyone but because of that and then having to say goodbye to our longtime editor Chris and You know, you may have heard us a Chris cut that out or anything like that And he's just been an incredible force on this team delivering this podcast day after day for everybody and doing just such an amazing job You know this podcast wouldn't be the same without Chris and wouldn't have gotten here without Chris So I want to give it just a sincere Thank you to Chris and all of his hard work And give him an opportunity here to insert something if he would like a chris ends here Thanks Scott and West for the opportunity to work on syntax I think I took over editing somewhere around episode 400 and I'll pass the editing scissors as it were onto the very capable hands Brandy it's been a lot of fun to be welcomed by this index community and by all you great developer nerds even though most of my Web dev knowledge died alongside front page 98 like Scott said if you've got questions about starting or editing a podcast hit me up at Lem productions dot CA on the web I Chris on Twitter or at lemon podcasting on YouTube as usual I'll be sure to put all the links in the show.
I'm sure the rest of the show definitely check out Chris is lemon productions Dot CA of course, I was actually really happy Chris is Canadian new editor Randy also Canadian It's Canadian podcast. So I'm very happy about that I'm just gonna start referring to this as a Canadian podcast. That okay, Scott. I have Canadian blood.
It's fine. Yeah My grandparents came from Montreal though Hey, honestly, if you're looking to start a podcast check out Chris lemon productions dot CA appreciate all your work Thank you Chris. Yeah, yeah again Or I want to say this if you know anybody who's starting a podcast you know, you know, you hear the word podcast Just throw Chris's website around lemon productions dot CA. He's just a fantastic guy and has done a great job for us So thank you Chris and we are going to miss you here on syntax.
So with that said time time passes We getting a New editor for the podcast and we talk about we had new JavaScript APIs to deal with time time passes and that's that's where we're at today What is time and how do we deal with time? We're not gonna be talking about space time here or anything like that But more or less time in the browser this kind of trip me out when you're you posted about like you had something in the browser where You were getting a date from 2022 like a two-year-old timestamp and then what happened you rebooted your computer or restarted This is actually very funny and a small aside. It says in the show knows Scott tell your story. There's a podcast I listen to That's like a an Australian couple.
It's just two comedians and The one they just got married the one she does this thing to her husband where she'll say Tom Can you tell your story whenever they're in a group setting like and just like a prank because he doesn't have a story prepared like what What are you gonna story? Do you want me to tell so we just that Scott? Can you tell your story? I got that same vibe, but my story was I was doing some date stuff and I was loading up a date server side and client side It was an SSI component.
So that code is the same code. It's running client side. It's running server side So that very clearly eliminates the situation where in might I have the timestamp in my code incorrectly I'm just running a new date And for some some stupid reason the one on the server side not the client side was the server side was returning in the server It's my own internal process the server side was returning a date that was one day off and one year off and my client The browser was returning the correct date and I said a whole year. Okay, I'm going to lose my mind What this is the same functioning run on the client and the server and the data is off by a day in a year What in the world could be going on?
I restarted my computer and it fixed I I cannot explain it if you know, this was unsolved mysteries. You could queue up some spooky music It's the spookiest thing that's ever happened to me on my computer and like working with daytime is spooky enough already So honestly, who knows I have no no answer to what happened there, but it was a no bizarre So you told me that story and I just started like almost dripping out being like where does time come from? You know Yeah, you're always a time but like where's your browser get a browser because your computer where's your computer get the time? I mean, there's like a chip on the motherboard.
Okay. Well, or maybe it gets it from we'll talk about where time comes from in a second But I was just like whoa, like time is just this thing we made up and Who keeps track of time? You know, you learn that it's connected to space itself. That's even more.
Yeah, so let's talk about that At the very very lowest level there are things called atomic clocks and many Servers people that have server infrastructure many trading places will have atomic clocks right in their data center And if you look it up, they're pretty crazy and Jeff Bezos just made a like a 40 million dollar 10,000 year atomic clock and wow if you look at it's a bunch of like gears that spin and apparently that's the most accurate way So keep track of time like if you were to say like hey, how could you keep track of time as accurate as possible? I would not tell you let's get 80 gears and just put them together and that will but like I guess that's how clocks work But that would not be my first guess And how that gets how that gets converted to actual like digital time I'm not sure how that works. It's the same thing with Randomness, you know, Cloudflare needs randomness for their as cell certificates and randomness built into computer chips is Somewhat random, but it can be figured out how random something will be so they have these like lava lamps This whole wall of lava lamps and they have a camera on them and based on the where the blobs are in these lava lamps They they correspond to how random things are so like that's more random than a computer chip Yeah, and I'm gonna link up to they have a blog post explaining that and it's one of the coolest things It's one of it when I learned that they did that. I was just like hell yeah, that's awesome So atomic clock now we have network time so for most devices that are connected to the internet if you need to get the current time There's these things called or there's a protocol NTP network time protocol and it's a protocol that we're basically there are a number of servers out there There's different levels of them There's like one level which is an atomic clock and then the time gets dispersed to 10 other different servers out there And then that gets dispersed to a different number of them And basically you can ping any of these NTP protocols and it will always return to you the correct time that is based off of one of those atomic clocks So that's how most of your computers.
That's why like we have a head unit in our car and every now and then There's a battery in it But if you don't drive it for a while the battery goes dead and it boots up again and the time is wrong And then after a second it connects to the Wi-Fi it's the network time updates, right? And it's it's pinging one of those there might be something with the Wi-Fi router where it gets it from that I'm not totally sure but that's in my mind That's where it gets most of it. What else your device time if you're not connected to the internet That's the thing I was tricking is like where does that come from the little battery on your computer? You know back in the day I guess they still have this but if you open up a motherboard of a computer There's a little CR 2032 battery and that keeps time on your motherboard Well, your computer is disconnected or not so so every now and then that battery will die or you have to replace it So you have to reset the actual time on your motherboard, which is wild.
Yeah, that is wild man little batteries like that They don't start so weird stuff. Did you you know like back in old school Nintendo games? Did you know that games that were able to like persist save files? Have storage on them that was done via a little battery within the game cartridge that yeah, cuz if you crack open I don't know if it's still the case But the Game Boy games back in the day or was it the NES games?
Yeah, you crack it open is any S game is a little battery and often if you buy something But only the ones that saved if you buy like a old computer or like I follow this tiktok account with this guy bought a video Vending machine that wouldn't boot up and it was just a little coin cell battery on the on the motherboard That was the case that's that a lot a lot of electronics going awry is either a a 10 set fuse That is you don't know that there's a fuse in it or be a little coin cell battery that has died that you don't know Just either less is the kind of guy you want to get that info from he's always who knows what But why why is time important sky? Well, you know so many of the things that we use on a day-to-day basis operate on the fact that We're all working from the same understanding of what time it is currently SSL certificates they require the correct time Mm-hmm logging and saving data if you have a log or errors and exceptions right you sentry.io that tells you when something happened When something happened is very important if you're trying to fix it if it happened last week or last year It might not be relevant you may have already fixed this problem not relevant right? So time is extremely important in programming in general to be able to fix the things that have broken or to understand what's going on When and where you know it's the difference between something happening at one second versus the very next second And and you know even then you need to know like where your users are time zones one of the things that are really important in development is understanding time zones and how they work how it relates to you know The epoch time of which we'll talk about but also like you know What exactly the time zone differences is and how we can calculate that difference and how that matters based on where we are essentially Think about it this way your server lives in a location you live in a location West lives in a location if I do new dot date from where I am in my server does new dot date and West does new dot date Chances are those are all going to be different answers despite the fact that we're all talking about the exact same time here And it's even worse with serverless or edge compute where it's rendering somewhere close to you But you may be expecting it to run on a specific time And I even had a weird issue a couple years ago back when I used to just have a digital ocean box Mm-hmm something with the time got goofed up and All of my stats were like three hours off and I'm pretty sure it was because the actual box I was running on was moved from one location to another one interesting thing to to note here about time I don't know if you've ever pirated Adobe software. Nope in your days.
I haven't either Okay, I've heard of people who've done it though I've heard and I also heard that when that had been done sometimes you needed to change the date on your computer So that Adobe's checks would you know? They wouldn't check to see so that was the strategy that I heard you could do was to change the year And what your computer was set out to install the software this you know This is something I think I think people did you know like ten years ago or so, but it was an interesting strategy That was before before as a cell certificates Yes became very commonplace you do that now you change the the date on your computer or like I booted up a old Mac book yesterday and I hadn't booted on for probably two years and It was dead dead dead the time sometimes the time is off I didn't check this one, but it's happening in the past. It's got a at the time servers to keep going Yeah, well, let's talk about epoch time really quick Epoch time is the number of seconds that have elapsed since January 1st 1970 now epoch time is a really useful way to store time because it's just a number It's an integer and that can be really nice because when you're dealing with JavaScript dates a new date in JavaScript is not a value right It's a whole lot of stuff and you know if you're wanting to save a date to a database and have it be accessed somewhere else later It makes a whole lot of sense to convert it to the epoch time Which again the number of seconds elapsed since January 1st 1970 now It's interesting here as I didn't know about this being an issue in computer science We got a bit of a Y2K situation going on here They call it the 2038 problem and it's not something that you have to worry about within JavaScript So this this is just an interesting little tidbit and some points the epoch time was represented as a 32-bit integer And if your epoch time storing was a 32-bit integer it will overflow on January 19th 2038 Causing your epoch times to all break and since the mini systems have become 64-bit integers to define epoch time That is a little bit of a Y2K problem that I've never heard about before until recently It's crazy. So JavaScript has been updated for that.
Let's say JavaScript numbers including those representing epoch time are stored as 16-bit Floating point numbers. This allows yes, so JavaScript is fine. I'm gonna try it right now So const date is equal to new date January 22nd 2038 get time. Yeah, it works fine So the browsers have been updated for this Y2K bug But if you're saving time in databases, this might be a bit of an issue for you in what 14 years from now So get ready something to put in your calendar for 14 years from now.
Hey, you do although like the older I get the faster time Go, so I think it's gonna come up on us real quick the older I get the faster time goes for sure absolutely That's the thing what do you know about ISO 8601 does that mean anything? Oh ISO 861 is my favorite standard of all time? No, I'm not sure like that's a that's a standard for specifying what time is right? Yes, and it's issued by the international organization For standardization okay the ISO that's what the ISO is and it's basically the way in which it's like a standardized way to format a date It's year year year year hyphen month month hyphen day day Colin our hour colon mm colon SS, and then you can do some times on stuff in there too So yeah, you can you can add like by default Z is UTC and then you can instead of just putting Z on the end You can do plus or minus like plus five would be Eastern That sounds like no fun But like if you ever see like let's say You're choosing to output a date somehow on for whatever reason and you're trying to decide hey I want to store this date as a string but what should I store it as next a lot of sense to store it as ISO 8601 Because that's easy to work with and just about everything understands it right?
You can pass it into a new date function However, be aware if you pass it into a new date function does take time zones into account for instance I ran new date 2024 0301 into my console this morning and it output February 29th 2024 So so that is part of the joy of working in this stuff if you want to just say hey Give me a date and then now turn it into a JavaScript date You've got to understand what exactly you're asking for because when you do new dates on anything the very first thing It does well, maybe not the very first thing but what it does to your date is it it always goes to the time zone in which the system is running on So that is a concern anytime you're passing in these numbers right because the ISO 8601 and if you just pass in a date without a Time zone it assumes UTC here, which is attached to no time zone So we also have a new standard, which is the I don't know the name is the RFC 33339 It's another proposal for these timestamps, but it adds two things it adds time zone names. So right now we just have plus The offset of UTC really offset I'm not sure five is Eastern, but our editor Chris will tell ya he lives in Saskatchewan and they don't have daylight savings time And it's so bizarre because my my wife's family lives in Saskatchewan And you have to like do the mental math of oh, they're one hour off of us for half the year and they're two hours off The other half year. So now you'll be able to do just square bracket Asia forward slash Tokyo or I'm not sure what the Toronto time zone stamp is but there's a whole list of Standards in there and then you can also specify which calendar is being used as well, which is kind of wild Yeah, and daylight savings time is you know something that is changing. You know, Arizona had no daylight savings time Let's see Colorado is moving to no daylight savings time.
I don't know if everybody is or what but yeah It's about to get funky. Do you know how many time zones there are in the world Scott? Mmm 24 no actually so when I launch a course I message my entire slack room and it does a little hey heads up You're messaging 50,000 people in and it says 27 time zones and that's because there's there's some somewhere in Canada I think it's like St. John's or something where they're half an hour off Randy our producer is nodding away another Canadian podcast good Apparently there's 38 time zones in the world because some of them are off 35 30 to 45 minutes huh crazy I did not I did not know that that existed that is great That's a lot of fun because all this stuff is so much fun when you're working It's not the most painful thing to work with in programming, you know what when I say give me a date I just want to date.
I don't necessarily want a time all the time. I don't always want a time zone I just want the same date. We're all talking about we're all talking about the same day here Yeah, March 1st 1986. That's my birthday.
We're all talking about that same date. I don't care what the time zone is in Denver for that date But yeah, you know what is interesting here is something we've talked about quite a bit on the show is the temporal API And we often say that the temporal API fixes the JavaScript date API How exactly does it fix the JavaScript date API? And one of the big things that it does is it does make working with time zones more sane But also mixed working with just dates more sane We you don't necessarily have to worry about a date time all the way So there's a a plane year month a plane month day a plane date Okay, and then a plane time plane date not included a time zone But a instant does include a time zone right or a zoned date time does include a time zone as well And so that's one of the ways that least makes working with this stuff a little bit more sane because one of the things that I've struggled With is hey when I save a date to the database I don't necessarily always want it to be attached to a particular time zone Yeah, so what do you do you think I'd take the step to turn everything to UTC? And then every time you access it you got to make sure you access it with the UTC methods Which that is a bug waiting to happen, right?
Yeah, so like if you if you want to avoid any of that hassle the temporal API will luckily be there to help us It'll give us better parsing another thing that everybody hates about the JavaScript date API is the fact that anytime you do anything It mutates the date which is a giant pain mutating the date So it's gonna give us immutable methods on the date API The plane date one is going to be super handy So for an example if I tell you my birthday is February 18 And you want to put that on your calendar I might give you a UTC date stamp of yes The first second of February 18, but then you try to display that in a different time zone It will tell you my birthday is on February 17 or February 19 Yeah, right and you might not those are the kind of bugs that you don't necessarily catch because it works on my machine, you know Especially once you're in browser land, that's very very tricky You want to you want to hear a further and this is where a conceptual problem with date But also a problem nonetheless I was working on at one point a booking app It was a startup I worked at it was a booking app and it was kind of like what if Instagram had booking right? You could look at tattoos and then oh here I want to book with this person because I've seen their portfolio right and What are the questions we had that we never got a good answer for because the company folded before we got the answer to this problem Was if if if I am traveling to Michigan and I want to book an appointment in Denver for noon Denver time What's the default? What do you show them by default? Yeah, you show them the Denver time by default or do you show them the Eastern time?
Do you show them both times and you know? Cron the calendar has done a really nice job kind of solving this where they'll put the columns since I work with a bunch of Eastern time folks I have It has two columns on my calendar where it shows the date typically kind of like code row numbers in your code text editor And so it will show me 2 p.m. 4 p.m. 3 p.m.
5 p.m So I can always see which one is which and I can tell which one is my default one That's nice, but in a looking situation where you're just trying to list here's the available appointments It's eight o'clock or whatever you're gonna have to confuse the heck out of the user trying to make them select the time zone and stuff like that I do not envy people that work on those types of things If those booking or the once when we flew to San Francisco my like Google calendar changed to San Francisco But like it never changed back so people kept looking me at like like 6 to 30 at night for talks And I was like hey like I'm not here and like oh sorry your your calendar said you were in San Francisco So you gotta watch those. Yeah, well, you know that's really all we have to say about time This has just been a little bit of time pontification hour or 27 minutes here And that's okay I want to know what kind of crazy bugs you've hit with time You know specifically I would love to get some of these for our spooky stories But we're long ways off from October so honestly I just want to hear what kind of situations people have hit with time or the just the date API in general and JavaScript What kind of major hiccups have you hit and what kind of solutions did you find or are you still looking for correct solutions? What types of things are you looking forward to in the temporal API hit us up at syntax FM on any of the socials Or even just reach out to us in our potluck form on the syntax FM website And we would love to read out some time stuff might be cool to do a follow up in a potluck later on Alright, thanks for tuning in catch later. Peace Head on over to syntax.fm for you full archive of all of our shows and don't forget to subscribe in your podcast player Or drop a review if you like this show