JSFiddle - React, Tailwind, and code Playground

CSS

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,700,400);

JavaScript

function initCanvas(font) {
    var canvas = initCanvas.canvas || (initCanvas.canvas = document.createElement("canvas"));
    var context = canvas.getContext("2d");
    context.font = font;
    return context;
}

function getTextWidth(context, text) {
    return context.measureText(text).width;
};

var context = initCanvas("18px Open Sans");

console.log('1: ' + getTextWidth(context, "111111111111111111111111111111"));
console.log('a: ' + getTextWidth(context, "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"));
console.log('b: ' + getTextWidth(context, "bbbbbbbbbbbbbbbbbbbbbbbbbbbbbb"));
console.log('i: ' + getTextWidth(context, "iiiiiiiiiiiiiiiiiiiiiiiiiiiiii"));