JSFiddle - React, Tailwind, and code Playground

HTML

<div id="sheet"></div>

<div class="controls">
  <button id="start">Start</button>
  <button id="stop" disabled="true">Stop</button>
  <button id="reset">Reset</button>
</div>

<div class="controls">
  <label>Progress</label>
  <input id="progress-slider"
         class="slider"
         type="range"
         min="0" max="0" value="0">
  <div class="meta">
    <div id="progress-slider-display">
      <span id="progress-chunk-idx">--</span>
      /
      <span id="progress-chunk-count">--</span>
    </span>
  </div>
</div>

<div class="controls">
  <label>WPM</label>
  <input id="wpm-slider"
         class="slider"
         type="range"
         min="100" max="5000" value="300" step="50">
  <div class="meta">
  <span id="wpm-slider-display">300</span>
  <span id="read-time">
    (<span id="read-time-seconds"></span> secs total)
    </span>
  </div>
</div>

<div class="controls">
  <label>Chunk size</label>
  <input id="chunk-slider"
         class="slider"
         type="range"
         min="1" max="6" value="1">
  <div class="meta">
  <span id="chunk-slider-display">1</span>
  <span id="chunk-time">
    (<span id="chunk-time-ms"></span>ms/chunk)
  </span>
  </div>
</div>

<div class="controls">
  <label>Font size</label>
  <input id="font-size-slider"
         class="slider"
         type="range"
         min="50"
         max="1000"
         value="200"
         step="10">
  <div class="meta">
  <span id="font-size-slider-display">200</span>%
  </div>
</div>

<div class="controls">
  <textarea id="content">Speed reading programs are available through courses, both in person or software based, and manuals. While the average adult reading rate is 250 words per minute with 70% comprehension, speed reading programs typically claim that improvements to 500 words per minute or more while maintaining or improving comprehension are possible.

One point of difference between the various speed reading courses is the assertions concerning subvocalization. Some courses...

CSS

#sheet {
  font-size: 200%;
  text-align: center;
  height: 150px;
  line-height: 150px;
}
.slider {
  width: 25%;
}
.controls {
  font-family: verdana;
  text-align: center;
  margin: 1em;
}
textarea {
  width: 500px;
  height: 200px;
}
.controls label,
.controls input,
.controls .meta{
  display: inline-block;
  width: 300px;
}
.controls label {
  text-align: right;
  margin-right: 10px;
}
.controls .meta {
  text-align: left;
  margin-left: 10px;
}
#about {
  text-align: center;
}

JavaScript

function aa(){return function(a){return a}}function h(a){return function(){return this[a]}}function r(a){return function(){return a}}var s,ba=this;function ca(a,b){var c=a.split("."),d=ba;c[0]in d||!d.execScript||d.execScript("var "+c[0]);for(var e;c.length&&(e=c.shift());)c.length||void 0===b?d=d[e]?d[e]:d[e]={}:d[e]=b}
function t(a){var b=typeof a;if("object"==b)if(a){if(a instanceof Array)return"array";if(a instanceof Object)return b;var c=Object.prototype.toString.call(a);if("[object Window]"==c)return"object";if("[object Array]"==c||"number"==typeof a.length&&"undefined"!=typeof a.splice&&"undefined"!=typeof a.propertyIsEnumerable&&!a.propertyIsEnumerable("splice"))return"array";if("[object Function]"==c||"undefined"!=typeof a.call&&"undefined"!=typeof a.propertyIsEnumerable&&!a.propertyIsEnumerable("call"))return"function"}else return"null";
else if("function"==b&&"undefined"==typeof a.call)return"object";return b}function fa(a){return"string"==typeof a}function ga(a){return a[ha]||(a[ha]=++ia)}var ha="closure_uid_"+(1E9*Math.random()>>>0),ia=0;function ja(a,b){var c=Array.prototype.slice.call(arguments,1);return function(){var b=Array.prototype.slice.call(arguments);b.unshift.apply(b,c);return a.apply(this,b)}};function ka(a){return String(a).replace(/([-()\[\]{}+?*.$\^|,:#<!\\])/g,"\\$1").replace(/\x08/g,"\\x08")}function la(a){for(var b=0,c=0;c<a.length;++c)b=31*b+a.charCodeAt(c),b%=4294967296;return b}function ma(a){return String(a).replace(/\-([a-z])/g,function(a,c){return c.toUpperCase()})}function na(a){var b=fa(void 0)?ka(void 0):"\\s";return a.replace(RegExp("(^"+(b?"|["+b+"]+":"")+")([a-z])","g"),function(a,b,e){return b+e.toUpperCase()})};var oa=Array.prototype,pa=oa.indexOf?function(a,b,c){return oa.indexOf.call(a,b,c)}:function(a,b,c){c=null==c?0:0>c?Math.max(0,a.length+c):c;if(fa(a))return fa(b)&&1==b.length?a.indexOf(b,c):-1;for(;c<a.length;c++)if(c in a&&a[c]===b)return c;return-1};function qa(a,b){for(var c in a)b.call(void...