Прерывистое воспроизведение звука с использованием Flask + JS

Question

Я создаю простую веб-страницу типа деки, которая в основном просто воспроизводит mp3-файлы из моей папки stati c в Flask. Страница загружается со списком файлов в виде кнопок. Я использовал простую функцию onclick, чтобы заставить их играть. Единственная проблема в том, что звук прерывистый. Похоже, он загружается недостаточно быстро. Это все очень короткие клипы, всего несколько секунд. Размер файла mp3 составляет менее 200 КБ. Похоже, загрузка не должна быть проблемой. Существует ли простой способ буферизации клипа перед его воспроизведением? Любой вклад приветствуется.

import glob

def get_file_list():
    clips = []
    for file in glob.glob("static/*.mp3"):
        clips.append(str(file))
    return clips

@app.route('/main')
def main():
    clips = get_file_list()
        return render_template("main.html", clips=clips)

        function play(id) {
            document.getElementById(id).play();
        }

{% for i in range(0, 20) %}
    <button onclick="play({{i}})">{{  clips[i]  }}
        <audio id="{{i}}"
               src='{{ url_for("static", filename=clips[i]) }}'>
         </audio>

     </button>
     <br>

{% endfor %}