🎧 Increase the playback speed of audio elements around the web

increase-audio-playback.user.js

// ==UserScript==
// @name         Increase audio playback
// @namespace    https://seanmcp.com
// @version      0.1
// @description  Increase the playback speed of audio elements around the web
// @author       Sean McPherson
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    const audioEl = document.querySelector('audio')
    function formateRate(rate) {
            const [number, decimal = '0'] = String(rate).split('.')
            return number + '.' + decimal.padEnd(2, '0')
        }
    if (audioEl) {
        const defaultRate = '2.00'
        audioEl.defaultPlaybackRate = defaultRate
        const controls = document.createElement('aside')
        controls.id = '__playback-rate'

        const span = document.createElement('span')
        span.textContent = defaultRate

        const input = document.createElement('input')
        input.setAttribute('aria-label', 'audio playback rate')
        input.type = "range"
        input.defaultValue = Number(defaultRate)
        input.min = 0.5
        input.max = 4.0
        input.step = 0.25
        input.addEventListener('change', ({ target: { valueAsNumber } }) => {
            audioEl.playbackRate = valueAsNumber
            const [number, decimal = '0'] = String(valueAsNumber).split('.')
            span.textContent = number + '.' + decimal.padEnd(2, '0')
        })
        controls.appendChild(input)
        controls.appendChild(span)

        const style = document.createElement('style')
        style.innerHTML = `
#__playback-rate {
position: fixed;
bottom: 0;
left: 0;
background: white;
border: 2px solid dodgerblue;
border-bottom: 0;
border-left: 0;
display: flex;
}

#__playback-rate input {
margin: 0.5rem;
width: 10rem;
}

#__playback-rate span {
background: dodgerblue;
color: white;
font-weight: bold;
padding: 0.5rem;
}
`
        controls.appendChild(style)

        document.body.appendChild(controls)
    }
})();