Working with Dates in TypeScript: Overview of date-fns, Luxon, and Day.js Libraries

Working with Dates in TypeScript: Overview of the Best Libraries

TypeScript, being a strictly typed superset of JavaScript, inherits all the problems of working with dates inherent in the native Date — a non-intuitive API, mutability, issues with time zones and parsing. Fortunately, the TypeScript ecosystem offers several powerful libraries that solve these problems. In this article, we will look at three of the most popular tools: date-fns, Luxon, and Day.js, compare their capabilities, and provide practical code examples.

1. date-fns — Modular and Functional

date-fns is a library built on the principles of functional programming. It consists of many independent functions, allowing you to import only what you need and avoid bloating the bundle. It works with native Date objects, simplifying integration.

Key features:

• Pure functions: each function returns a new object without modifying the original.
• Modularity: import only the necessary functions (e.g., import { format, addDays } from 'date-fns').
• Locale support: built-in support for over 50 languages, including Russian.
• TypeScript: excellent typing out of the box.

Code Examples with date-fns

Installation:

npm install date-fns

Date formatting:

import { format } from 'date-fns';import { ru } from 'date-fns/locale';

const date = new Date(2024, 11, 25); // December 25, 2024const formatted = format(date, 'dd MMMM yyyy', { locale: ru });console.log(formatted); // "25 декабря 2024"

Date manipulation:

import { addDays, subMonths, differenceInDays } from 'date-fns';

const today = new Date();const future = addDays(today, 10);const past = subMonths(today, 3);const diff = differenceInDays(future, past);console.log(`Difference: ${diff} days`);

Date comparison:

import { isBefore, isAfter, isEqual } from 'date-fns';

const date1 = new Date(2024, 0, 1);const date2 = new Date(2024, 6, 1);console.log(isBefore(date1, date2)); // true

2. Luxon — Powerful and Modern

Luxon is a library from one of the authors of Moment.js, created to address its shortcomings. Luxon uses its own immutable objects (DateTime, Duration) rather than the native Date. This makes it especially convenient for working with time zones and intervals.

Key features:

• Immutability: all methods return new instances.
• Built-in time zone support: without additional plugins.
• Internationalization: localization based on the Intl API.
• Working with intervals and durations: convenient methods for calculating time spans.

Code Examples with Luxon

Installation:

npm install luxon

Creating and formatting a date:

import { DateTime } from 'luxon';

const dt = DateTime.fromISO('2024-12-25', { zone: 'Europe/Moscow' });console.log(dt.toFormat('dd.MM.yyyy HH:mm')); // "25.12.2024 00:00"

// Localized outputconsole.log(dt.setLocale('ru').toFormat('d MMMM yyyy')); // "25 декабря 2024"

Working with time zones:

const nyTime = DateTime.now().setZone('America/New_York');const moscowTime = nyTime.setZone('Europe/Moscow');console.log(`In New York: ${nyTime.toFormat('HH:mm')}, in Moscow: ${moscowTime.toFormat('HH:mm')}`);

Durations and intervals:

import { Duration, Interval } from 'luxon';

const dur = Durati