Menu Close
In fact, it has the 39mm Oystersteel monobloc middle-case of the OP essentially, which appears a little more curvaceous than the flat, trapezoid profile of the 40mm Oystersteel Submariner. The bezel of the replica rolex watches Explorer I is different on each: The OP has a domed, high-polish bezel, while the Explorer I has what Rolex calls a "Smooth" bezel. It has a flat surface instead of the convex bezel of the OP, with nicely polished.



A straightforward date and time formatter in <800b.




tinytime exports a single function that returns a template object. This object has a single method, render, which
takes a Date and returns a string with the rendered data.

import tinytime from 'tinytime';
const template = tinytime('The time is {h}:{mm}:{ss}{a}.');
template.render(new Date());
// The time is 11:10:20PM.


  • MMMM – Full Month (September)
  • MM – Partial Month (Sep)
  • Mo – Numeric Month (9) 1
  • YYYY – Full Year (1992)
  • YY – Partial Year (92)
  • dddd – Day of the Week (Monday)
  • DD – Day of the Month (24)
  • Do – Day (24th)
  • h – Hours – 12h format
  • H – Hours – 24h format
  • mm – Minutes (zero padded)
  • ss – Seconds (zero padded)
  • a – AM/PM

1 – you get padded months (09 instead of 9) by passing in the padMonth option.

const template = tinytime('{Mo}', { padMonth: true })


tinytime takes an approach similar to a compiler and generates an AST representing your template. This AST is generated when
you call the main tinytime function. This lets you efficiently re-render your template without tinytime having to parse the
template string again. That means its important that you aren’t recreating the template object frequently.

Here’s an example showing the right and wrong way to use tinytime with React.

Don’t do this:

function Time({ date }) { return ( <div> {tinytime('{h}:{mm}:{ss}{a}').render(date)} </div> ) }

Instead, only create the template object once, and just re-render it.

const template = tinytime('{h}:{mm}:{ss}{a}'); function Time({ date }) { return ( <div> {template.render(date)} </div> ) }

Babel Plugins

Using one of the plugins below, you can resolve this efficiency concern at compile time.

babel-plugin-transform-tinytime – Hoists tinytime calls out of the JSX render scope.

babel-plugin-tinytime – Hoists tinytime calls out of the current scope, regardless if its inside JSX or a ordinary function scope.

View Source Code