我想做视频流而不缓冲超过1GB

Question

我在没有缓冲的情况下编写视频流代码。它在20分钟的视频中运行良好。我尝试了超过1GB的视频，但不幸的是它没有用。我把它放在我的代码下面。

var ctx = canvas.getContext('2d');

canvas.onclick = function (e) {
    var vl = vid.duration,
        w = canvas.width,
        x = e.clientX - 5;

    vid.currentTime = x / w * vl;
}

loop();

function loop() {

    var b = vid.buffered,
        i = b.length,
        w = canvas.width,
        h = canvas.height,
        vl = vid.duration,
        x1, x2;

    ctx.fillStyle = '#000';
    ctx.fillRect(0, 0, w, h);
    ctx.fillStyle = '#d00';

    while (i--) {
        x1 = b.start(i) / vl * w;
        x2 = b.end(i) / vl * w;
        ctx.fillRect(x1, 0, x2 - x1, h);
    }
    ctx.fillStyle = '#fff';

    x1 = vid.currentTime / vl * w;
    ctx.textBaseline = 'top';
    ctx.textAlign = 'left';

    ctx.fillText(vid.currentTime.toFixed(1), 4, 4);

    ctx.textAlign = 'right';
    ctx.fillText(vl.toFixed(1), w - 4, 4);

    ctx.beginPath();
    ctx.arc(x1, h * 0.5, 7, 0, 2 * Math.PI);
    ctx.fill();

    setTimeout(loop, 29);
}
play.addEventListener('click', function () {
    vid.play()
}, false);
pause.addEventListener('click', function () {
    vid.pause()
}, false);

此代码仅在20分钟内播放。我想知道如何为1GB以上的视频做代码。请帮我提供代码和示例。