Относительное время в разных локалях

Библиотека Day.js не включает поддержку относительного времени по умолчанию. Для работы с выражениями вроде «5 минут назад», «через 2 дня» или «несколько секунд назад» требуется подключение плагина relativeTime.

import dayjs from 'dayjs'
import relativeTime from 'dayjs/plugin/relativeTime'

dayjs.extend(relativeTime)

После подключения становятся доступны методы:

  • from()
  • to()
  • fromNow()
  • toNow()

Метод fromNow()

Метод fromNow() вычисляет относительное время относительно текущего момента.

const result = dayjs('2026-05-20').fromNow()

console.log(result)

Пример результата:

'3 дня назад'

Для будущих дат:

const result = dayjs().add(2, 'hour').fromNow()

console.log(result)

Результат:

'через 2 часа'

Метод toNow()

Метод toNow() работает в противоположном направлении.

const result = dayjs('2026-05-20').toNow()

Результат:

'через 3 дня'

Метод from()

Метод from() сравнивает две даты.

const start = dayjs('2026-01-01')
const end = dayjs('2026-01-10')

console.log(end.from(start))

Результат:

'через 9 дней'

Обратное сравнение:

console.log(start.from(end))

Результат:

'9 дней назад'

Метод to()

Метод to() аналогичен from(), но направление вычисления инвертировано.

console.log(start.to(end))

Результат:

'через 9 дней'

Удаление суффиксов времени

По умолчанию Day.js добавляет слова:

  • «назад»
  • «через»

Для отключения суффиксов используется второй аргумент true.

const result = dayjs().subtract(3, 'hour').fromNow(true)

console.log(result)

Результат:

'3 часа'

Пример с будущим временем:

const result = dayjs().add(5, 'day').fromNow(true)

console.log(result)

Результат:

'5 дней'

Подключение локалей

Для работы относительного времени на разных языках необходимо импортировать нужную локаль.

Пример для русского языка:

import 'dayjs/locale/ru'

Установка локали:

dayjs.locale('ru')

Полный пример:

import dayjs from 'dayjs'
import relativeTime from 'dayjs/plugin/relativeTime'
import 'dayjs/locale/ru'

dayjs.extend(relativeTime)

dayjs.locale('ru')

console.log(dayjs().subtract(1, 'day').fromNow())

Результат:

'день назад'

Английская локаль

import 'dayjs/locale/en'

dayjs.locale('en')

console.log(dayjs().subtract(3, 'minute').fromNow())

Результат:

'3 minutes ago'

Будущее время:

console.log(dayjs().add(2, 'week').fromNow())

Результат:

'in 2 weeks'

Русская локаль

Русская локаль учитывает склонение слов.

dayjs.locale('ru')

console.log(dayjs().subtract(1, 'minute').fromNow())
console.log(dayjs().subtract(2, 'minute').fromNow())
console.log(dayjs().subtract(5, 'minute').fromNow())

Результаты:

'минуту назад'
'2 минуты назад'
'5 минут назад'

Day.js автоматически выбирает правильную форму слова.

Немецкая локаль

import 'dayjs/locale/de'

dayjs.locale('de')

console.log(dayjs().subtract(1, 'hour').fromNow())

Результат:

'vor einer Stunde'

Будущее время:

console.log(dayjs().add(3, 'day').fromNow())

Результат:

'in 3 Tagen'

Французская локаль

import 'dayjs/locale/fr'

dayjs.locale('fr')

console.log(dayjs().subtract(10, 'second').fromNow())

Результат:

'il y a quelques secondes'

Испанская локаль

import 'dayjs/locale/es'

dayjs.locale('es')

console.log(dayjs().subtract(4, 'month').fromNow())

Результат:

'hace 4 meses'

Локаль только для одного объекта

Глобальная локаль изменяет поведение всей библиотеки. Иногда требуется локализовать только отдельный экземпляр даты.

import 'dayjs/locale/ru'
import 'dayjs/locale/en'

const date = dayjs().subtract(1, 'day')

console.log(date.locale('ru').fromNow())
console.log(date.locale('en').fromNow())

Результат:

'день назад'
'a day ago'

Переключение локалей во время выполнения

Day.js позволяет динамически менять язык интерфейса.

function setLanguage(lang) {
  dayjs.locale(lang)
}

setLanguage('en')

console.log(dayjs().subtract(2, 'hour').fromNow())

setLanguage('ru')

console.log(dayjs().subtract(2, 'hour').fromNow())

Результат:

'2 hours ago'
'2 часа назад'

Ленивая загрузка локалей

При большом количестве языков выгодно загружать локали динамически.

async function loadLocale(locale) {
  await import(`dayjs/locale/${locale}.js`)
  dayjs.locale(locale)
}

await loadLocale('fr')

console.log(dayjs().subtract(1, 'week').fromNow())

Настройка локализованных строк

Day.js позволяет переопределять стандартные фразы локали.

Для этого используется плагин updateLocale.

import updateLocale from 'dayjs/plugin/updateLocale'

dayjs.extend(updateLocale)

Изменение формулировок:

dayjs.updateLocale('en', {
  relativeTime: {
    future: 'after %s',
    past: '%s before',
    s: 'few seconds',
    m: 'a minute',
    mm: '%d minutes',
    h: 'an hour',
    hh: '%d hours',
    d: 'a day',
    dd: '%d days',
    M: 'a month',
    MM: '%d months',
    y: 'a year',
    yy: '%d years'
  }
})

Проверка:

console.log(dayjs().subtract(2, 'day').fromNow())

Результат:

'2 days before'

Форматы единиц времени

Плагин RelativeTime автоматически выбирает единицу измерения.

Например:

dayjs().subtract(30, 'second').fromNow()

Результат:

'несколько секунд назад'

При увеличении интервала единица меняется:

dayjs().subtract(59, 'minute').fromNow()

Результат:

'час назад'

Пороговые значения

Day.js использует внутренние пороги переключения единиц времени.

Например:

  • секунды → минуты
  • минуты → часы
  • часы → дни

Пример:

console.log(dayjs().subtract(44, 'second').fromNow())
console.log(dayjs().subtract(45, 'second').fromNow())

Результаты могут отличаться:

'несколько секунд назад'
'минуту назад'

Использование в интерфейсах

Относительное время особенно полезно:

  • в чатах;
  • в системах уведомлений;
  • в комментариях;
  • в логах;
  • в социальных сетях;
  • в списках событий.

Пример:

const messages = [
  {
    text: 'Новое сообщение',
    createdAt: dayjs().subtract(5, 'minute')
  },
  {
    text: 'Обновление профиля',
    createdAt: dayjs().subtract(2, 'hour')
  }
]

messages.forEach(message => {
  console.log(
    `${message.text}: ${message.createdAt.fromNow()}`
  )
})

Результат:

Новое сообщение: 5 минут назад
Обновление профиля: 2 часа назад

Использование вместе с UTC

Для корректной работы в международных приложениях относительное время часто комбинируют с UTC.

import utc from 'dayjs/plugin/utc'

dayjs.extend(utc)

Пример:

const created = dayjs.utc('2026-05-20T10:00:00Z')

console.log(created.local().fromNow())

Использование вместе с Timezone

При работе с часовыми поясами используется плагин timezone.

import timezone from 'dayjs/plugin/timezone'

dayjs.extend(timezone)

Пример:

const tokyo = dayjs.tz(
  '2026-05-20 12:00',
  'Asia/Tokyo'
)

console.log(tokyo.fromNow())

Локализация в React

Пример компонента:

import dayjs from 'dayjs'
import relativeTime from 'dayjs/plugin/relativeTime'

import 'dayjs/locale/ru'

dayjs.extend(relativeTime)
dayjs.locale('ru')

function PostDate({ createdAt }) {
  return (
    <span>
      {dayjs(createdAt).fromNow()}
    </span>
  )
}

Автоматическое обновление времени

Относительное время быстро устаревает. В интерфейсах обычно используется периодическое обновление.

Пример:

setInterval(() => {
  const value = dayjs().subtract(1, 'minute').fromNow()

  console.log(value)
}, 1000)

Частые ошибки

Плагин не подключён

Ошибка:

dayjs(...).fromNow is not a function

Причина:

dayjs.extend(relativeTime)

не был вызван.

Локаль не импортирована

dayjs.locale('ru')

не сработает без:

import 'dayjs/locale/ru'

Локаль меняется глобально

dayjs.locale('de')

изменяет язык для всех последующих объектов Day.js.

Для изолированного использования:

date.locale('de').fromNow()

Сравнение с Moment.js

Day.js во многом повторяет API библиотеки Moment.js.

Пример Moment.js:

moment().subtract(1, 'day').fromNow()

Аналог в Day.js:

dayjs().subtract(1, 'day').fromNow()

Главные преимущества Day.js:

  • меньший размер;
  • модульная архитектура;
  • поддержка tree-shaking;
  • современный API;
  • высокая совместимость с Moment.js.
Оглавление