Относительное время от текущего момента

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

Подключение плагина выполняется через расширение экземпляра Day.js:

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

dayjs.extend(relativeTime)

После подключения становятся доступны методы, связанные с вычислением относительных временных интервалов между датами.

Относительное время в Day.js строится на сравнении двух моментов:

  • текущего времени (или заданной точки отсчёта)
  • целевой даты

Результат выражается в человекочитаемой форме:

  • «несколько секунд назад»
  • «3 дня назад»
  • «через 4 месяца»

Основные методы:

  • fromNow() — вычисление относительно текущего момента
  • toNow() — обратное направление относительно текущего момента
  • from() — вычисление относительно указанной даты
  • to() — вычисление до указанной даты

Метод fromNow()

Метод fromNow() возвращает строку, описывающую разницу между текущим временем и датой объекта Day.js.

dayjs().subtract(5, 'minute').fromNow()
// "5 minutes ago"

Примеры поведения:

dayjs().subtract(1, 'hour').fromNow()
// "an hour ago"

dayjs().add(2, 'day').fromNow()
// "in 2 days"

Логика метода:

  • отрицательная разница → «назад»
  • положительная разница → «через»

Метод toNow()

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

dayjs().subtract(10, 'minute').toNow()
// "in 10 minutes"

Примеры:

dayjs().add(3, 'hour').toNow()
// "in 3 hours"

dayjs().subtract(1, 'year').toNow()
// "a year ago"

Фактически toNow() эквивалентен вызову fromNow() с изменённой точкой зрения.

Методы from() и to()

В отличие от fromNow() и toNow(), эти методы позволяют задать произвольную точку отсчёта.

const a = dayjs('2024-01-01')
const b = dayjs('2024-01-10')

b.from(a)
// "9 days after"

Пример использования to():

a.to(b)
// "in 9 days"

Семантика:

  • from() — «относительно другой даты»
  • to() — обратное направление

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

Day.js автоматически выбирает наиболее подходящую единицу измерения:

  • секунды
  • минуты
  • часы
  • дни
  • месяцы
  • годы

Алгоритм основан на пороговых значениях, встроенных в локализацию. Например:

dayjs().subtract(45, 'second').fromNow()
// "a minute ago"
dayjs().subtract(21, 'day').fromNow()
// "21 days ago"

Переход между единицами происходит автоматически без ручной настройки.

Локализация относительного времени

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

import 'dayjs/locale/ru'

dayjs.locale('ru')

После этого строки становятся локализованными:

dayjs().subtract(5, 'minute').fromNow()
// "5 минут назад"

Локали определяют:

  • словоформы единиц времени
  • правила склонения
  • пороги перехода между единицами

Настройка собственных формулировок

Плагин позволяет переопределять форматирование через локаль. Это делается через объект relativeTime внутри конфигурации языка.

Пример пользовательской локали:

dayjs.locale({
  name: 'custom',
  relativeTime: {
    future: 'через %s',
    past: '%s назад',
    s: 'несколько секунд',
    m: 'минута',
    mm: '%d минут',
    h: 'час',
    hh: '%d часов',
    d: 'день',
    dd: '%d дней',
    M: 'месяц',
    MM: '%d месяцев',
    y: 'год',
    yy: '%d лет'
  }
})

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

Управление порогами отображения

Day.js использует внутренние правила перехода между единицами, но поведение можно косвенно контролировать через локаль.

Например:

  • «59 секунд» → секунды
  • «60 секунд» → минуты
  • «60 минут» → часы

Эти границы фиксированы и зависят от реализации плагина, а не от пользовательской настройки.

Работа с округлением времени

Относительное время всегда округляется до ближайшей логичной единицы:

dayjs().subtract(1.7, 'hour').fromNow()
// "2 hours ago"

Правила округления:

  • меньше половины единицы → вниз
  • больше или равно половине → вверх

Сравнение with and without плагина

Без подключения relativeTime методы отсутствуют:

dayjs().fromNow()
// TypeError: dayjs(...).fromNow is not a function

После подключения:

dayjs.extend(relativeTime)
dayjs().fromNow()
// корректный результат

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

При частом обновлении интерфейсов (например, ленты сообщений) относительное время требует периодического пересчёта:

setInterval(() => {
  console.log(dayjs(message.date).fromNow())
}, 60000)

Типичный интервал обновления:

  • 10–30 секунд для чатов
  • 1–5 минут для новостных лент
  • 10–60 минут для редко обновляемых данных

Особенности работы с будущими датами

Относительное время одинаково корректно обрабатывает прошлое и будущее:

dayjs().add(7, 'day').fromNow()
// "in 7 days"

dayjs().add(7, 'day').toNow()
// "in 7 days"

Разница проявляется только в направлении сравнения.

Внутренняя модель вычислений

Day.js преобразует даты в временные метки Unix и вычисляет разницу в миллисекундах:

  • 1000 ms = 1 секунда
  • 60 000 ms = 1 минута
  • 3 600 000 ms = 1 час

Далее выполняется:

  1. вычисление абсолютной разницы
  2. определение подходящей единицы
  3. применение локализованного шаблона
  4. формирование строки результата

Комбинация с другими плагинами

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

  • utc — для унифицированного времени
  • timezone — для локальных временных зон
  • calendar — для календарных выражений («вчера в 14:00»)

Пример связки:

import utc from 'dayjs/plugin/utc'
import timezone from 'dayjs/plugin/timezone'

dayjs.extend(utc)
dayjs.extend(timezone)
dayjs.extend(relativeTime)

Это позволяет получать корректные значения в распределённых системах.

Типичные ошибки при использовании

Некорректные сценарии:

  • забытое подключение relativeTime
  • отсутствие локализации при необходимости русского языка
  • попытка использовать метод на не-Day.js объекте
  • повторное переопределение локали без сохранения настроек

Каждая из этих ситуаций приводит к некорректному отображению или ошибкам выполнения.

Производственные особенности

При массовом использовании относительного времени важно учитывать:

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

В системах с большим количеством элементов предпочтительно:

  • минимизировать частоту обновлений
  • группировать перерасчёты
  • избегать пересчёта неизменяемых дат
Оглавление