JavaScript has a built-in Date object that you can use to work with date and time in JavaScript. In fact, we have several tutorials on Envato Tuts+ that cover this topic in great detail.
The Date object in JavaScript has quite a few methods that you can use to implement basic functionality. However, a lot of those methods work with the local time zone. You might also want better parsing capabilities for date strings or need to work with immutable dates.
In this tutorial, we will give you a brief overview of some of the best, most popular, free date and time libraries in JavaScript.
Moment.js
Moment.js is one of the most widely-used libraries for working with date and time in JavaScript. Its huge list of features makes it very attractive to developers. You can use the library to parse, manipulate, and format dates as well as times.
Some of the features of Moment.js are:
- robust and mature codebase that provides a lot of useful features
- easy parsing and formatting of dates
- easy use of relative time (such as 10 hours ago) or time in calendar format (like Sunday at 6:00 PM or yesterday at 3:30 PM)
- built-in support for multiple locales
One disadvantage of the library is its relatively huge size which can impact your page load times. This is especially true if you will be using only some features of the library.
Another point that I should mention is that Moment.js is no longer being actively developed. It has now gone into maintenance mode.
Luxon
Luxon is a modern alternative to the Moment.js library. This library has a few important advantages over Moment.js. It offers native time zone and internationalization support which helps keep the file size down. It is less than a third the size of Moment.js at about 20k gzipped.
Some of the features of Luxon are:
- access to powerful features with a simple and performant API
- immutability and chainability of the methods for writing concise code
- full support for localization and internationalization
- easy parsing and formatting of datetimes, intervals, and durations
- great support for time zones and DST to make things simpler for developers
The library also provides full support for Gregorian and ISO week calendars. It also provides limited support for other calendar systems such as Hebrew, Indian, Islamic, and Japanese.
Day.js
Are you looking for a lightweight library to replace Moment.js? The Day.js library can be a great alternative in this case. One of the biggest advantages of the library is its small size at around 2kb. The library works both in the browser and in Node.js.
Here are some useful features of the library:
- an API almost fully compatible with Moment.js
- support for immutability—any changes to the Day.js object will return a new instance instead of changing the original one
- ability to manipulate time by adding or subtracting specified durations
- display time relatively using either the current time or some other specific time
- parse any date and time string
You can extend the core functionality of the library with the use of plugins. There are a lot of plugins available to add features as simple as calculating the day of the year. Other plugins will help you calculate the minimum and maximum of given date values.
You can also build your own plugins for the library if none of the plugins offer what you need.
date-fns
The date-fns library is another great option for anyone who is looking for a modular and modern JavaScript date library. The library is very comprehensive in its coverage of features while being easy to use at the same time.
What the lodash library does for arrays, the date-fns library does for dates. It has over 200 functions that can help you do all kinds of tasks. Here are some of its interesting features:
- use the library to calculate the distance between two dates in words
- get the latest and earliest dates from an array
- helper functions for different periods of time—such as minute helpers that help you get the minutes, go to start or end of a minute, round to the nearest minute, etc.
- weekday helpers will help you get the date for things like the next Thursday or the previous Tuesday
- additional packages such as date-fns-tz for support for time zones
Common helper functions in the library can help you with the formatting of the dates and check if a date is in the past, present or future in comparison to other dates.
Use of tree shaking will also help optimize the final bundle size so that you are not loading anything unnecessary.
Chrono
The Chrono library is different from others that we have reviewed in this article in the sense that it does not have a huge list of helper functions to help you manipulate dates. However, it serves a unique purpose. The library is a natural language date parser. This means that it can extract date and time related information from any given text and handle most date/time formats.
You can extract all this information from given text by simply making a call to the parse() and parseDate() methods. It is also possible to provide additional context and information for the correct parsing of dates by using two more arguments with the parseDate() method.
Consider the following example:
1 |
const parsedDate = chrono.parseDate("Meet me next Tuesday at 4:00 PM"); |
2 |
// Outputs: Date Tue Jun 13 2023 16:00:00 GMT+0530 (India Standard Time)
|
3 |
console.log(parsedDate); |
4 |
|
5 |
|
6 |
const parsedDate = chrono.parseDate("Meet me next Tuesday at 4:00 PM", new Date(2023, 5, 25)); |
7 |
// Outputs: Date Tue Jul 04 2023 16:00:00 GMT+0530 (India Standard Time)
|
8 |
console.log(parsedDate); |
In the first example, the parseDate() method looks at the sentence and finds the date for me for the next Tuesday from the current time. However, I provide it some context during the second call to find the next Tuesday after June 25, 2023. In that case, it comes up with the date Jul 04, 2023.
The library even allows you to define your own refiners in order to customize the results or add your own logic to Chrono.
Final Thoughts
The Date object in JavaScript has a decent set of methods that you can use to manipulate dates. However, you will have to rely on using libraries if you are working extensively with time zones or need to use a lot of helper functions such as those available with date-fns.
Similarly, libraries like Chrono can help you do something that the native API simply can't, like extract date-time data from textual information.
I hope you found this list of popular, free, and open-source date-time libraries in JavaScript helpful.
No comments:
Post a Comment