JSFiddle - React, Tailwind, and code Playground

JavaScript

var src, audio = new Audio(),
     audioCtx = new(window.AudioContext || window.webkitAudioContext)(),
     url = 'http://tts-api.com/tts.mp3?q=hello+...+world.',
     analyser = audioCtx.createAnalyser(),
     distortion = audioCtx.createWaveShaper(),
     gainNode = audioCtx.createGain(),
     biquadFilter = audioCtx.createBiquadFilter(),
     convolver = audioCtx.createConvolver()
     oscillator = audioCtx.createOscillator();

 // connect the nodes together
 // Manipulate the Biquad filter
 biquadFilter.detune.value = 90;
 biquadFilter.frequency.value = 200000;
 oscillator.type = 'square';
 oscillator.detune.value = 10000000000;
 oscillator.frequency.value = 3000000; // value in hertz
 oscillator.start();
 distortion.curve = new Float32Array(8);
 distortion.oversample.value = "4x";
 for (var i = 0; i < 8; i++) {
     distortion.curve[i] = Math.random() - 0.5;
 }
 audio.addEventListener('canplaythrough', function () {

     var source = audioCtx.createMediaElementSource(audio);
     source.connect(distortion);
     distortion.connect(biquadFilter);
     biquadFilter.connect(gainNode);
     gainNode.connect(audioCtx.destination);
     audio.play();
 }, false);
 audio.src = url;