DEV Community

Cover image for DayJS: Awesome lightweight modern Date API and an alternative to MomentJS
Javid Mougamadou
Javid Mougamadou

Posted on

25 8

DayJS: Awesome lightweight modern Date API and an alternative to MomentJS

Concepts

DayJS is a lightweight JavaScript date API (2kB) which describe the same MomentJS API. (If you use Moment.js so could use easily Day.js )

Day.js is a minimalist and simple library that parses, validates, manipulates, and displays dates and times for modern browsers.

Why DayJS replace Momentjs

Image

Image

Tree-shaking: Moment doesn't work well with modern "tree shaking" algorithms, so it tends to increase the size of web application bundles.

Mutable: consider that Moment objects are mutable. Changing Moment to be immutable would be a breaking change for every one of the projects that use it.

Get Started

Installation

npm install dayjs
Enter fullscreen mode Exit fullscreen mode
import dayjs from 'dayjs' // ES 2015
Enter fullscreen mode Exit fullscreen mode

Parse

now = dayjs();
d = dayjs('2013-03-01', 'YYYY-MM-DD');
d = dayjs('2018-04-04T16:00:00.000Z') // ISO
d = dayjs(1318781876406) // Javascript timestamps -- Millis
d = dayjs.unix(1318781876) // Unix timestamps
d = new Date(2018, 8, 18) // Date object
d = dayjs({ years:2010, months:3, date:5, hours:15, minutes:10, seconds:3, milliseconds:123});
Enter fullscreen mode Exit fullscreen mode

Format

d.format()            // "2013-03-01T00:00:00+01:00"
d.format('dddd')      // "Friday"
d.format('MMM Do YY') // "Mar 1st 13"
d.fromNow()           // "7 years ago"
d.calendar()          // "03/01/2013"
Enter fullscreen mode Exit fullscreen mode

Get/Set

dayjs().second() // => new Date().getSeconds()
dayjs().second(30).valueOf() // => new Date().setSeconds(30)

dayjs().hour()
dayjs().hour(12)
Enter fullscreen mode Exit fullscreen mode

Manipulate (Add-Substract)

d.add(1, 'day')
d.subtract(2, 'days')
d.startOf('day')
d.endOf('day')
d.startOf('hour')
Enter fullscreen mode Exit fullscreen mode

Query

d.isBefore(dayjs('2011-01-01'))
d.isSame(dayjs('2011-01-01'))
d.isAfter(dayjs('2011-01-01'))
Enter fullscreen mode Exit fullscreen mode

Bundlephobia

Alt Text

Alt Text

Link

SurveyJS custom survey software

JavaScript UI Libraries for Surveys and Forms

SurveyJS lets you build a JSON-based form management system that integrates with any backend, giving you full control over your data and no user limits. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more.

Learn more

Top comments (6)

Collapse
 
alaindet profile image
Alain D'Ettorre

I've used dayjs in an Angular project to create a custom datepicker. It was not a very good experience honestly. I'll try date-fns or luxon next time

Collapse
 
mrtung profile image
Mr Tùng

Agree. I using date-fns for my big project, it's awesome.

Collapse
 
zynth17 profile image
Christopher Reeve

i use date-fns
dayjs is only good in the size but not the performance

Collapse
 
andrewbaisden profile image
Andrew Baisden

Now this is a good library to use.

Collapse
 
lyrod profile image
Lyrod

I used date-fns but dayjs looks awesome!

Collapse
 
ibrahimcesar profile image
Ibrahim Cesar

This is my go-to date library

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs