📆 date-fns vs Moment.js — 어떤 날짜 라이브러리를 선택할까?

JavaScript로 날짜와 시간을 다뤄야 할 때 가장 먼저 떠오르는 라이브러리는 아마도 Moment.js일 것입니다. 하지만 최근 몇 년 사이, 더 가볍고 현대적인 대안인 date-fns가 인기를 얻고 있습니다. 이 글에서는 두 라이브러리를 비교하고 어떤 상황에서 어떤 도구를 선택하면 좋을지 안내해드립니다.

🥇 소개: Moment.js vs date-fns

항목	Moment.js	date-fns
초기 릴리즈	2011	2014
유지 상태	비활성 (Legacy)	활발한 유지보수 중
모듈화	불가능 (전체 불러야 함)	가능 (함수별 tree-shaking)
번들 크기	약 300KB 이상	약 16~20KB (사용 함수만)
불변성 지원	❌ (객체가 변함)	✅ (불변 방식)
i18n 지원	내장	내장, but 일부 수동 설정 필요
러닝 커브	낮음	낮음
TypeScript 지원	미흡 (타사 타입)	✅ 공식 제공

⚖️ 주요 비교 포인트

1. 번들 크기

Moment.js는 모든 기능을 하나의 번들에 포함하고 있어 트리 셰이킹이 불가능합니다. 반면, date-fns는 함수 단위로 불러올 수 있어 필요 없는 코드가 포함되지 않습니다.

// moment

import moment from 'moment';

// date-fns

import { format } from 'date-fns';

✅ 트리 셰이킹이 필요한 프론트엔드 앱에서는 date-fns가 더 적합합니다.

2. 불변성(Immutability)

Moment.js는 날짜 객체를 직접 변경하는 방식입니다. 반면, date-fns는 입력 값을 바꾸지 않고 새로운 값을 리턴하는 순수 함수 방식으로, 코드의 안정성과 예측 가능성이 높습니다.

// moment

const m = moment();

m.add(1, 'day'); // m이 변경됨

// date-fns

import { addDays } from 'date-fns';

const today = new Date();

const tomorrow = addDays(today, 1);

3. 국제화 (i18n)

Moment는 다국어 지원이 내장되어 있지만, 모든 언어 데이터를 포함하는 구조라 용량이 커집니다. date-fns는 언어별 locale 모듈을 선택적으로 import할 수 있어 더 효율적입니다.

import { format } from 'date-fns';

import { ko } from 'date-fns/locale';

format(new Date(), 'PPP', { locale: ko }); // "2025년 5월 15일"

4. 지원 현황과 커뮤니티

Moment.js: 2020년 이후 "legacy project"로 전환됨
date-fns: 활발하게 유지보수 중, 현대 JS/TS에 적합

✅ 결론: 언제 어떤 라이브러리를 써야 할까?

상황	추천 라이브러리
신규 프로젝트	date-fns ✅
레거시 코드 유지	Moment.js (필요 시)
불변성 / 트리 셰이킹 중요	date-fns ✅
빠른 프로토타이핑	Moment.js (익숙하다면)
다국어 포맷, 경량화	date-fns ✅

✍️ 마무리

Moment.js는 한때 날짜 처리의 사실상 표준이었지만, 트리 셰이킹, 불변성, 모듈화 측면에서 현대 웹 개발과는 다소 맞지 않는 구조를 가지고 있습니다. date-fns는 이를 보완하는 대체제로서, 더 작고, 더 빠르며, 함수형 방식으로 많은 개발자에게 사랑받고 있습니다.

미래를 생각한다면 date-fns가 더욱 좋은 선택이 될 것입니다.