And please welcome LIT to you who's going to tell us about the Temporary PI.
All right.
Hello.
Very good morning, everyone.
I am Aditi.
And today I would be talking about Temporary, which is a new jazz script
API for handling data and times.
I'm sure you must have seen it on training on Hagueleus for the last few days.
Yep.
That's the one.
But first, a little bit about myself.
I'm Aditi.
I'm from India.
I work in the compiler team at Egalya.
A compiler team works on a bunch of cool stuff.
It's jazz standards, browser engines, LLVM rigs, risk drive, etc.
I myself have mostly worked on jazz standards.
Implementation of those jazz standards.
Test those implementations and more recently on PDFs, etc.
But enough about me.
Let's talk about Temporary.
So what is Temporary?
Temporary provides easy to use built in API for handling data and times in jazz
script.
It's built in.
So right now, most of you might be doing something like using an external library
like moment to handle later nights.
This removes the need for doing that.
Which also saves you a bunch of payload, which can range from like a couple of dozens
to 200 kilobytes depending upon the local data include.
It supports jazz internationalization.
That means it supports all time zones, including non-regorian calendars.
It is strongly typed, which means that for every use case,
there is a different type.
Instead of one type that fits everything.
It is immutable.
That means you don't have to worry about any external code,
modifying your function without your knowledge.
And it's currently at stage three if you remember from UDRA stock earlier.
It's almost ready and we're mostly waiting for a browser to finish implementing it.
And we're expecting no major changes.
Okay.
So this is the biggest change in jazz script that is been in a very long time.
So we obviously need to think about why do we need it.
Well, that data API is terrible.
So these are the problems that we identified very early in the beginning of the
beginning of temporal.
So these are taken from Maggie's blog.
Who is one of the original architects of temporal.
And also one of the developers on Moments JS.
She has listed them in order of relative discussed.
So let's just come through these.
The first one is there's no support for time zones.
Other than the use of local time and UDC.
The passive behavior is very unreliable.
And the data object is mutable.
That means so if you have one there object and you're using it several times.
But if something like set month or you do something like set month or set date.
It can cause bugs because the original date object would be modified.
The DST behavior is unpredictable.
The computation API is a weird and there's no support for non-regorian calendars.
Okay.
So let's think about it.
Can we fix them?
Well, few things like computation.
API has been weird can be fixed.
But other stuff like mutability cannot be fixed because there's so much code out there that already
relies on this.
So we would break the web.
Okay.
So I mentioned strongly typed earlier.
So let's take a tool through all the types that are present in temporal.
The first one you should know about is temporal instant.
Which represents an exact moment in time.
It is represented as a lapse nanoseconds since the midnight of UDC run for 1970,
which is the epoch time.
It's just nanoseconds.
It has no time zone.
That means it has no daylight savings capabilities.
It has no calendar.
So there's no year month or day.
And it's just a purely ever increasing number.
Then there is a family of plane types.
This is the most commonly used commonly used way of how we talk about time.
We call it the world time.
So there's a bunch of types in this family.
We have plane date time, which has both the date and the times.
And then we have plane date.
So just date without any time.
Then we have plane time.
Which is just time without any date.
So something like the break is at 12.
5.
And then we have air month.
Which has no day or time.
So something like September 25.
And then we have month day.
Which we would casually use to say something like my birthday is on March 14.
So the question is why do we have this family of types with a progressively decreasing information?
So this is so that you can accurately represent the data you have.
For example, if you just had the date and no time,
the way you would do it in the legacy date object is you would you would take a date and use midnight.
But that doesn't work in most cases.
Like that works in most cases.
But that might not work in some cases where midnight escaped due to DST.
For example, November 4, 2018, midnight didn't exist in Brazil.
So that can cause very hard to track down bugs.
Okay.
Next up.
This is this completes the types of temporal which represent the date and time.
This is temporal zone date time.
It is like in it is like temporal instant.
It is an exact time.
But it also has a calendar and time zone.
So it follows the DST rules.
And it also has a day month as a day month in a year.
Okay.
So this is we call family time as something that represents.
And even that has happened.
That has happened at a place on earth or will happen at a place on earth.
And there's also one other type called temporal duration.
And this is mostly used to for arithmetic.
I will talk more about the arithmetic later when we walk through the code examples.
Okay.
So for example, I have selected three problems.
That easy medium and hard one.
And as we saw those problems, I will keep telling more about them.
Okay.
So the first question is, get a unique timestamp in milliseconds.
So it this is a very popular question about.
It's the number one top four requests on stack overflow about the legacy date.
And when you think about it, so timestamp.
That is an exact time.
So we know we would use instant.
But how do we get the current time?
Don't think too much about it.
I haven't told you that yet.
And that's where the temporal noun namespace comes in.
It is a namespace with functions that give you temporal objects representing the current date time or time zone.
So for ISO, it's zero one calendar.
That is the machine calendar.
I will tell more about calendar later.
You can get the temporal object.
So you can get an instant or time zone ID,
only time, et cetera.
And then use it.
So okay.
So we got the current time.
But how do we get the milliseconds?
So each temporal object has a few read-only properties.
And this is the set of all the properties.
Not all the temporal objects have all these properties.
Only the only time has every other object has a subset of these.
For example, here doesn't exist in the temporal types without a calendar.
Okay.
So combining all of that information.
This is how we would get the hyper milliseconds.
The unique time stamp using temporal.
Moving on to the second example, which is a pretty simple question.
What is the date one month from today?
Okay.
In the legacy date object, you would do something like this,
where you take today's date, which is where the date here is yesterday's.
But you can take today's date or whatever date.
And then you can easily print it using the local string method.
But that's not good enough.
I'll tell you why.
Because you take the date and you set the month to the next month.
And then output that string.
That gives the wrong output.
Because first February and first March are not exactly one month apart in the Hebrew calendar.
So they are, but that's because not every calendar has the same number of days in every month.
Hebrew calendar usually has 29 or 30 days.
And February just has 28.
So that makes the calculations go wrong.
So let's talk about how we would do this in temporal.
But before that, let's talk more about calendars first.
So this standard calendar in machines is ISO.
It's a given calendar, which is standardized.
And the way books is standardized throughout the world.
And it is pretty similar to the most commonly used calendar, which is the Gregorian calendar.
You can almost always convert between the two without worrying about.
Without worrying about.
We're very worrying about too much, but there are few exceptions.
A few cases where they still don't align.
For example, the first week of the month, they have different rules for calculating that.
But other than that, you can pretty much mentally convert between the two.
But there are also other calendars, like Hebrew calendar, all the Hindu calendar.
Which I have that different number of which are different from the ISO 801 calendar.
So you can print the non ISO dates.
But for adding, you need to do something more specific.
So we'll talk about that.
But first, we now have got the calendar sorted.
Next up, let's talk about how we would add a month.
So I mentioned duration earlier.
So add or subtract.
We have got two methods called add or subtract.
So for every temporal type, we can get a temporal duration.
And return a new temporal object to the same type by adding the duration.
And we also have since an until on duration, which represents the time elapsed between two similar temporal types.
Okay, so we have the date.
I'll talk about how we get the date.
And then we add a month.
We pass a property back, which automatically gets converted to duration.
So this is the right way of calculating, calculating a month, calculating the adding a month in users calendar.
So we pick the calendar.
The right calendar would every want.
We get the current date using temporal now, plain date ISO.
And use the width calendar method to insert that calendar into the date and then add the month to it.
And then format it using locustring.
Any users local calendar.
Okay, so I hope things have been clear until now.
Let's talk about a hard problem.
So these are three compensations.
I took this screenshot from our website of our conference.
And we have to calculate what time are these compensations for me in my time zone.
Okay, so we have three sessions in three different time zones on two dates.
So we have July 23rd and 30th, two dates, and they are four other sessions on every date.
For three time zones.
So this is the information that we have.
We have the two calendar dates that the sessions occur on July 23rd and 30th.
And the start time of the sessions and the time zones that is 11 am AST, which is Australian Eastern Standard Time.
And one PM E degree, which is Eastern Day like time, we have my time zone.
And the arts in my local time at which I'm willing to be at my computer.
So normally for something like this for calculating the time of conference in my time zone,
I would just do simply something like I would take the time.
I better remember I was there and hope that it tells me the right answer.
But let's see how we do it in using temperature.
So this is some work of a pseudo code.
What we need to do for each session date.
And for each session, we need to calculate the exact time when the session starts and ends on that day.
I said exact time and we also have calendar and a time zone attached to it.
So we would use this only time.
And if the local time of my session in my time zone falls within the arts,
then I'm willing to be at my computer.
We just print the local time of the session in my time zone.
So setting up, this is a small piece of code that we used to set up.
We take, we have the dates that is 23rd and 30th.
And then we have sessions array with the information about the time zone and the art at which the conference starts.
We have the session length which is a duration object.
And we have my time zone which we get using the temporal now times zone id option.
So the two things that I haven't talked about yet,
one of them is the from method that I haven't mentioned yet,
which I'm using to construct the plane date and the duration.
So let me, let me talk about the from method first.
So there are two ways you can construct temporal objects using constructors and using the from method.
So constructors are low level and they mostly require exact numerical information.
So they're not recommended.
So using constructors would be something like this.
But you can also use from for high level cases.
They're friendly, they accept property bags, ISO strings, instances, et cetera.
And they're recommended in most cases.
And this is how you would use the from method.
And okay.
So the thing, so we have got that we have set up.
We have got the times.
Now we need to compare the times to identify if I am online at those sessions or not.
So we have two ways of comparing.
Equals tells you we have got equals for every temporal type.
And it tells you whether temporal objects or the same type are exactly equal.
We also have a compare static method for every temporal object.
And it's used for sorting, et cetera.
You can pass it to a resort method to sort of the times.
And for this case, we would use compare.
So this is a small comparison method.
We have got my coffee time where I wake up and my bed time.
At which time I go to sleep.
Because since we only have the time, we use the plane time.
And we have a small function called if I can't be online at all.
I have those times and we use the compare method to compare those times.
And if I am online at those times, it returns true.
Okay.
So this is where the main calculation happens.
We have got.
So for each, we are looping through each date.
That is the two ways that we had between each third and third year.
And for each session on each date, we agree.
We create a zone daytime object with the time zone.
That was provided the time zone that was given.
And use the plane time, which is the session start time.
And that is how we get the session start in the time zone.
But to get it in my time zone, we get the my session start in my time zone using with time zone.
And then we get the session end time using by adding the session length,
which was a duration object using the add method.
And then we call the comparison method.
And check if I can be online at the start time and the end time.
And then if I can't be when we just format it up, which I'm trying to.
Okay.
So going through this code, there's a bunch of things that I haven't talked about yet.
Let's do the zone daytime and also with the time zone.
So first we'll talk about conversion.
It is possible to convert between two temporal types.
Using the two plane daytime or two plane day month, day etcetera methods.
And for using these conversion types, what we need to do is we need to provide the additional information.
That's missing from a current object to get a new object of a different type.
So for example, for in this example, we have a plane date and we convert it,
we want to convert it to plane date time.
So we pass the time and that gives us an output which is a plane date time.
And if there's any if you want to convert it to plane month day,
then plane date already has the month day information in that case we read arguments empty.
Okay. And so that's the conversion.
Now moving on to modification.
So we have with methods every temporal type which can be used to modify temporal objects.
And the temporal objects are immutable, yes.
I talked about that a bit earlier, but you can get a new temporal type with the modified new temporal object of same type.
With the modified information.
So with method takes on argument which is a property bag with some components of the same type,
whatever you would like to modify.
And it returns a new temporal objects, new temporal objects with the provided fields replaced.
And so for example, if I had a date then and I wanted to replace the date.
So we could use the we could use the with method,
but there are separate with calendar and with time zone methods,
the one that I used, I used with calendar earlier.
And also in the previous light, I used with time zone.
They are different because if both of them are provided together,
we wouldn't know which one to use first.
And with combining all of that code, we get the following output,
which is the conference, which is the conference times in time zones.
And it might seem like that's a lot of code for a very simple problem.
But seriously, I wouldn't even want to try this with the legacy date API.
And I hope that was helpful.
This is the temporal documentation, now they're available at MDN,
so you can go look at it.
And yeah, if you want to read more, that's the temporal repository.
There you can find the link to the playground,
where you can play around with the polyfill.
And these are the link for the MDN docs.
And thank you so much.