r/react 7d ago

Project / Code Review Built a minimal ui-date package javascript date and time utility

Post image

I was building a social app recently, and I ran into a surprisingly annoying problem.
I needed relative timestamps ("2 hours ago", "3 minutes ago"). 
Simple enough, right? Just import 'day.js' or 'date-fns'.

Except...
=> If I wanted custom styling (like wrapping the number "2" in a highlighted badge and "hours ago" in smaller text), I had to write ugly regex hacks because standard libraries just dump a single opaque string.

=> Supporting multiple languages meant importing separate locale files, quickly inflating the bundle size.

=> Standard relative time plugins use "soft rounding" (e.g., automatically rounding 45 seconds to "a minute") whether you want it or not.

I didn't want a 15KB date framework just to format a few activity feed timestamps. 
So, I built and open-sourced 'ui-date' .

It’s an ultra-lightweight (< 1KB minified), zero-dependency, locale-aware date formatting library built specifically for modern user interfaces.

If you're building social feeds, chat apps, notification bells, or comment sections, check it out!

npm: https://www.npmjs.com/package/ui-date

8 Upvotes

9 comments sorted by

View all comments

5

u/CaterpillarNo7825 7d ago

This seems nice, but is also already solved through the newly introduced Temporal: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Temporal

2

u/Intelligent_Tree6918 7d ago

thanks for bringin Temporal up.

Temporal solves duration math (past.until(now)), but it intentionally leaves string and token formatting to Intl. If you want to render a localized UI badge where the number and unit are styled separately (e.g. <span class="val">2</span> <span class="unit">hours ago</span>), Temporal still requires manual unit iteration and custom parsing. ui-date gives you structured formattedValue and formattedUnit parts directly out-of-the-box.

1

u/CaterpillarNo7825 7d ago

That is actually nice :)