Relative time — render `3 hours ago` / `in 2 weeks` in ja and en

What datetime pairs reveal when generating relative-time strings

‘3 days ago,’ ‘2 weeks from now,’ ‘yesterday’ — to generate a relative-time string, you input a target datetime and a base datetime. Those two values form a pair that can represent an event timestamp relative to a reference point. When the target is an incident time, a contract signing date, or a customer inquiry timestamp, it is business information.

Developers commonly test Intl API output using real production datetimes for convenience. ‘How long ago did that incident occur?’ is a natural test input that also happens to be a sensitive timestamp. Running that check in a browser-local tool keeps the production data out of any request log.

The case against an external Intl formatter

Intl.RelativeTimeFormat is a built-in browser API. An online tool that processes it on a server is routing a calculation through external infrastructure that could be avoided entirely. Every request logs the IP, the datetime pair, and the formatting options chosen.

Browser Intl implementations also vary subtly between engines (Chrome V8, Safari JavaScriptCore, Firefox SpiderMonkey). An external service that runs on one engine may return a result that differs from what your users see in their browsers. Testing the API directly in your own browser gives you the result your users will actually see.

Direct Intl.RelativeTimeFormat calls, nothing else

This tool computes the difference between the two datetime inputs in seconds, then calls new Intl.RelativeTimeFormat(locale, \{ style, numeric }).format(value, unit) for both ja and en locales. The per-scale table repeats the same call for all seven units (year / month / week / day / hour / minute / second). No external library, no external API.

Open DevTools Network while changing the datetime inputs: zero requests are fired. You are seeing your browser’s own Intl engine respond directly — which is exactly the output your users will see when you deploy code using the same API call.

Things to verify before using the output in code

The numeric: auto option returns natural-language forms like yesterday and tomorrow, but the threshold at which it switches from numeric to natural language varies by locale and browser implementation. Use the per-scale table here to spot any surprises before writing test cases.

The week unit is under-supported in auto mode — many browsers skip it entirely and return a day-count instead. The table surfaces this so you know whether your deployment target will produce last week or 7 days ago. Copy any result directly into your code comments or test spec as a verified expected value.

How Intl.RelativeTimeFormat works internally and where its data comes from

Intl.RelativeTimeFormat is part of the ECMAScript Internationalization API (ECMA-402). V8, JavaScriptCore, and SpiderMonkey each consult the Unicode CLDR (Common Locale Data Repository) for the underlying string templates. new Intl.RelativeTimeFormat('en').format(-3, 'day') returning 3 days ago maps to a CLDR entry like <unitPattern count="other">{0} days ago</unitPattern>. The count attribute follows CLDR plural rules: zero / one / two / few / many / other. Different locales use different subsets (Japanese uses only other, English uses one and other, Russian uses one, few, many, and other).

The numeric: 'auto' option produces natural-language forms when CLDR provides them, but the cutoff depends on locale and CLDR version. format(-1, 'day') in English returns yesterday; format(-2, 'day') already falls back to 2 days ago. Japanese format(-1, 'day') is 昨日, but the week unit lacks a natural-language form in most implementations and falls back to 1 週間前 / 1 week ago. This tool’s parallel display surfaces those boundaries. The style option controls verbosity: 'narrow' gives 3d ago, 'short' and 'long' both give 3 days ago in most languages.

Practical patterns and known cross-browser differences

When implementing an agoString(date) helper, the threshold design matters. GitHub uses < 1 min → just now, < 60 min → N minutes ago, < 24 h → N hours ago, < 30 day → N days ago, otherwise an absolute date like May 18, 2026. Slack’s 3h style sticks with style: 'narrow' and switches units finely. Twitter (X)‘s 5m uses narrow style with minutes up to 60, hours up to 24, then switches to absolute dates. The seven-scale table in this tool helps you pick a threshold pattern that fits your UI.

A notable cross-browser difference is the handling of week in auto mode. V8 (Chrome) typically does not return last week for most locales; SpiderMonkey (Firefox) does for some. The quarter unit is defined in CLDR but not exposed through Intl (format(-1, 'quarter') throws or falls back to numeric in many implementations). fortnight and decade are similarly absent from the spec. If you need them, format the number with Intl.NumberFormat and append the unit by hand. The Temporal API at Stage 3 does not introduce a replacement for Intl.RelativeTimeFormat, so this API will remain the standard tool for relative-time formatting for the foreseeable future. When you need the absolute day-count instead of a natural-language string, date-diff returns that directly; for an ISO 8601 duration like PT3H derived from the same gap, duration-format re-renders it; and to shift the base datetime forward or back by N units before formatting, time-arithmetic handles that step in the same browser-local pipeline.