Benchmark: moment.js vs day.js vs date-fns set

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/npm/dayjs/dayjs.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dayjs/plugin/utc.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dayjs/plugin/timezone.js"></script>
<script src="https://cdn.jsdelivr.net/npm/moment/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/moment-timezone@0.5.48/builds/moment-timezone-with-data.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/date-fns/cdn.min.js"></script>

Script Preparation code:

var unix = 1724409214;

Tests:

momentjs
return moment(unix).set("hours", 0).set("minutes", 0).set("seconds", 0).set("milliseconds", 0);
dayjs
// dayjs.extend(window.dayjs_plugin_utc) // dayjs.extend(window.dayjs_plugin_timezone) return dayjs(unix).set("hours", 0).set("minutes", 0).set("seconds", 0).set("milliseconds", 0);
date-fns
return dateFns.set(new Date(unix), { hours: 0, minutes: 0, seconds: 0, milliseconds: 0 })

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
momentjs
dayjs
date-fns

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 5 days ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/135.0.0.0 Safari/537.36 Edg/135.0.0.0

Browser/OS: Chrome 135 on Windows

View result in a separate tab

Test name	Executions per second
momentjs	895703.6 Ops/sec
dayjs	405636.9 Ops/sec
date-fns	1920744.9 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 5 days ago):

LLMs can make mistakes. Check important info.

The benchmark defined tests the performance of three popular JavaScript libraries for date and time manipulation: **Moment.js**, **Day.js**, and **date-fns**. Each of these libraries has its unique approach to handling date objects and functions in JavaScript, and this benchmark specifically evaluates how efficiently they can set time components (hours, minutes, seconds, and milliseconds) to zero for a given Unix timestamp.

### Libraries and Their Purpose

1. **Moment.js**:
   - **Purpose**: Moment.js is a widely used library for parsing, validating, manipulating, and displaying dates and times in JavaScript. It provides a rich set of features to handle time zones, durations, and relative time displays.
   - **Usage in Benchmark**: The benchmark utilizes the `moment` function to create a moment object from a Unix timestamp and then sets its time components to zero. Moment.js is known for its comprehensive feature set, but it can be relatively large in size and has performance overheads.

2. **Day.js**:
   - **Purpose**: Day.js is a lightweight alternative to Moment.js. It offers a similar API but is designed to be much smaller and faster. It is built to provide almost the same features with reduced bundle size, which is especially beneficial in front-end applications.
   - **Usage in Benchmark**: In the benchmark, Day.js is combined with plugins for UTC and timezone handling before setting the time components to zero. This allows it to manage time zones similarly to Moment.js but with a smaller footprint.

3. **date-fns**:
   - **Purpose**: date-fns is a modern alternative that provides the same functionalities as Moment.js and Day.js but focuses on a modular approach. Developers can import only the functions they need, resulting in smaller builds.
   - **Usage in Benchmark**: The benchmark uses the `set` function from date-fns to create a new date object with specified components set to zero. This functional approach can improve performance since date-fns avoids the overhead of creating an instance of a class.

### Benchmark Test Cases

Each test case measures the speed at which the libraries can execute the same operation:

1. **Moment.js**:
   - **Code**: `return moment(unix).set("hours", 0).set("minutes", 0).set("seconds", 0).set("milliseconds", 0);`
   - **Test Results**: It performed with approximately **895,703 executions per second**.

2. **Day.js**:
   - **Code**: `return dayjs(unix).set("hours", 0).set("minutes", 0).set("seconds", 0).set("milliseconds", 0);`
   - **Test Results**: This performed the slowest among the three, with about **405,637 executions per second**. The reduced performance might be attributed to the overhead of applying multiple plugins.

3. **date-fns**:
   - **Code**: `return dateFns.set(new Date(unix), { hours: 0, minutes: 0, seconds: 0, milliseconds: 0 });`
   - **Test Results**: It excelled, achieving **1,920,745 executions per second**, highlighting its efficiency due to the direct functional approach without the instantiation overhead that comes with object-oriented models.

### Pros and Cons of the Different Approaches

- **Moment.js**:
  - **Pros**: Comprehensive features, extensive community support, and a familiar API for developers used to handling dates in JavaScript.
  - **Cons**: Large file size and slower performance compared to alternatives, which can be a bottleneck in performance-sensitive applications.

- **Day.js**:
  - **Pros**: Very lightweight, small size, and a compatible API with Moment.js, allowing for easy migration.
  - **Cons**: Some advanced features may be limited, and it slightly underperformed in this benchmark.

- **date-fns**:
  - **Pros**: Modular design allows for tree-shaking and inclusion of only needed functionalities, leading to improved performance and bundle size. It is generally faster for specific operations like the one tested.
  - **Cons**: The functional programming paradigm might not be as intuitive for developers accustomed to object-oriented approaches.

### Conclusion and Alternatives

While Moment.js, Day.js, and date-fns are the primary libraries being assessed, it's worth noting alternatives such as **Luxon**, which offers modern date handling with support for time zones and internationalization. However, Luxon comes with similar performance concerns as Moment.js in terms of size.

For applications that only require very basic date manipulation, native JavaScript Date methods (like `new Date()`, `setHours()`, etc.) can be explored, but they lack the convenience and functionality provided by these libraries. Overall, the choice of library should be based on the specific project requirements, performance needs, and desired API ergonomics.

Related benchmarks:

moment.js vs day.js vs date-fns set (version: 1)

Comparing performance of: momentjs vs dayjs vs date-fns

Created: 5 days ago by: Guest

Jump to the latest result

momentjs

dayjs

date-fns

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 5 days ago):