ms: Tiny Millisecond Module by Guillermo Rauch

By  on  

This code snippet is now available with a GitHub repository: https://github.com/guille/ms.js

I wanted to pass along a simple but useful module that was posted as a Gist to GitHub by Guillermo Rauch.  This simple module, available via NPM as ms, provides a simple function for turning a human-readable string into milliseconds.

// Created by milliseconds

/**

# ms.js

No more painful `setTimeout(fn, 60 * 4 * 3 * 2 * 1 * Infinity * NaN * '☃')`.

    ms('2d')      // 172800000
    ms('1.5h')    // 5400000
    ms('1h')      // 3600000
    ms('1m')      // 60000
    ms('5s')      // 5000
    ms('500ms')   // 500
    ms('100')     // 100
    ms(100)       // 100

**/

(function (g) {
  var r = /(\d*.?\d+)([mshd]+)/
    , _ = {}

  _.ms = 1;
  _.s = 1000;
  _.m = _.s * 60;
  _.h = _.m * 60;
  _.d = _.h * 24;

  function ms (s) {
    if (s == Number(s)) return Number(s);
    r.exec(s.toLowerCase());
    return RegExp.$1 * _[RegExp.$2];
  }

  g.top ? g.ms = ms : module.exports = ms;
})(this);

A very nice little gem by Guiller.  Keep this function handy to save yourself from math expressions for time calculations!

Recent Features

  • By
    Create a CSS Cube

    CSS cubes really showcase what CSS has become over the years, evolving from simple color and dimension directives to a language capable of creating deep, creative visuals.  Add animation and you've got something really neat.  Unfortunately each CSS cube tutorial I've read is a bit...

  • By
    CSS vs. JS Animation: Which is Faster?

    How is it possible that JavaScript-based animation has secretly always been as fast — or faster — than CSS transitions? And, how is it possible that Adobe and Google consistently release media-rich mobile sites that rival the performance of native apps? This article serves as a point-by-point...

Incredible Demos

  • By
    The Simple Intro to SVG Animation

    This article serves as a first step toward mastering SVG element animation. Included within are links to key resources for diving deeper, so bookmark this page and refer back to it throughout your journey toward SVG mastery. An SVG element is a special type of DOM element...

  • By
    Create a Spinning, Zooming Effect with CSS3

    In case you weren't aware, CSS animations are awesome.  They're smooth, less taxing than JavaScript, and are the future of node animation within browsers.  Dojo's mobile solution, dojox.mobile, uses CSS animations instead of JavaScript to lighten the application's JavaScript footprint.  One of my favorite effects...

Discussion

  1. Olmo

    Also note this has been accepted in MooTools More: https://github.com/mootools/mootools-more/pull/1098/files

  2. Ssss

    Whats with th ‘☃’ char?

    Have I missd something? xD

  3. Great one! Will definitely use this in my projects. Thanks a lot David!

  4. Hi David,

    First of all, nice site, I’ve been following you for the past 2 years or so.

    Yesterday Guille created a repo so that I could fork the code and make a pull request.
    Guille merged today my pull request because it’s a better rewrite overall:
    – Smaller footprint
    – 2.8x faster
    – Passes all unit tests

    The repo is here: https://github.com/guille/ms.js

    Could you update the article? It’d be great for everyone!

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!