(No) One Moment, Please

If you've ever used moment.js in one of your frontend-projects, you've probably noticed two things:

  • moment is a very easy-to-use JS-library for date-manipulations
  • all of a sudden, your app's size was dramatically larger

The main problem with moment.js is that it doesn't support efficient code-splitting via tree-shaking in ES6+. That leads to an increase of about 70 kB in size of your production app, as the lib is this large in its gzipped, smallest version - even if you're only using a handful of the features provided.

At this point, you may have asked yourself if the native JS-Date could do the job, but sadly the native implementation lacks everything beyond basic date manipulations, such as simple parsings to ISO-strings or numbers and vice versa.

Smaller, lighter, faster

The best alternative I've used so far in various projects is date-fns, which offers modern exports of manipulation-functions, therefore only adding to your size-budget what is really needed.

Furthermore, date-fns handles all operations in an immutable style. You don't have to initialize an instance like in moment.js to use the library, every date-fns-function takes an input and returns an output. Using currying, you can very simply and efficiently build up your date-mutations and never worry about the state of your instance such as in moment.js.

To further highlight the functional programming aspect of date-fns, the library offers all its function as a FP-submodule. If you're using functional JS-code, you'll feel right at home there.

A little thing called timezone

What date-fns doesn't support out-of-the-box is handling the correct translations to and from timezoned-dates. moment.js provides moment-timezone as a seperate library. date-fns also has a seperate module for this task, called date-fns-tz.

I hope I could show you why switching from moment.js to another library handling dates and times may be the right choice for your project. Taking our npm-depdencies' sizes into account may get lost during intense development cycles, yet a good amount of loading delays can simply be cut away when making mindful choices about what to really add to your project.

- Tom