Question

我有一个网页，当某些事件发生时会播放“铃声”。问题是，音频播放是间歇性的，在我将代码更改为此之前，我似乎无法弄清楚导致它的原因：

var audioElement = document.createElement('audio');
audioElement.setAttribute('src', '/public/sounds/chime.ogg');
audioElement.load();
audioElement.play();

现在音频（只有11kb）每次播放但是我想知道性能评估，是每次从服务器中提取文件还是缓存并重复使用？

我以前的旧代码是这样的：

HTML：

<audio id="chime" preload="auto" autobuffer>
    <source src="@{'/public/sounds/chime.ogg'}" />
</audio>

JavaScript：

$('#chime').get(0).play();

Answer 1

编辑：如果您只想查看浏览器是在请求文件还是尊重缓存信息，请弹出开发工具网络面板（或firebug网络面板）并重新加载页面。

您将看到正在加载的文件资源的GET以及状态（请查看Chrome工具中的标题标签 - 您将会看到其中一个＆＃39; 200 OK＆＃39;，＆＃39; 200（来自缓存）＆＃39;或＆＃39; 304未修改＆＃39;。

查看时间标签，您将看到它是否花时间下载整个文件，或者只是将本地文件与服务器上的文件进行比较。 / p>

此行为将完全取决于浏览器，因此如果您在firefox，webkit和IE中进行测试，您可能会看到略有不同的结果。

firefox尊重音频文件http标头中的缓存信息，webkit浏览器执行快速检查。

http://mindtrove.info/archive/2010/02/1/

Answer 2

愚蠢的我...总n00b错误。

以前的代码现在完全正常，我所要做的只是在调用play（）之前添加一行

$('#chime').get(0).currentTime=0;

所以现在play（）方法运行得很好。

感谢。

javascript load（）方法在第一次加载后缓存资源吗？

2 个答案: