JSFiddle - React, Tailwind, and code Playground

by also

HTML

<p><input type="text" id="f" value="(t&lt;&lt;3)*[8/9,1,9/8,6/5,4/3,3/2,0][[0xd2d2c8,0xce4088,0xca32c8,0x8e4009][t&gt;&gt;14&amp;3]&gt;&gt;(0x3dbe4688&gt;&gt;((t&gt;&gt;10&amp;15)&gt;9?18:t&gt;&gt;10&amp;15)*3&amp;7)*3&amp;7]&amp;255" style="font-size: 2em; width: 600px; font-family: monospace;"></p>
<input type="range" id="scale" min="0.1" max="2" step="0.01" value="0.2" onchange="play();">
<p><button onclick="play()">Play</button>
   <button onclick="pause()">Pause</button></p>

<script>if (!window.webkitAudioContext) { document.write("<p>Your browser doesn't support the Web Audio API.</p>"); }</script>

JavaScript

var context = new webkitAudioContext();
var node = context.createJavaScriptNode(1024, 1, 1);
var p = 0;

node.onaudioprocess = function (e) {
    var l = e.outputBuffer.getChannelData(0);
    var r = e.outputBuffer.getChannelData(1);
    for (var i = 0; i < l.length; i++) {
        l[i] = r[i] = (f(p++ * scale) & 0xff) * 512 / 65535 - 1;
    }
};

var f;
var scale;

function play() {
    f = eval("(function (t) {return " + document.getElementById('f').value + "})");
    scale = document.getElementById('scale').value;
    node.connect(context.destination);
}

function pause() {
    node.disconnect();
}