我有一个带有几个<audio>
标记的页面。每当我在Chrome(Desktop,macOS(中播放音频时,它都会立即启动,而在Safari(13.1,macOS。
我认为问题出在";预加载";属性未设置,所以我已将其设置为";自动;根据docs]1的说法,但这并没有改变任何事情。
我不想使用第三方库来保持尽可能简单。
如何消除此延迟?为什么页面上的音频标签越多,时间就越长?
我无法完全消除延迟,但我通过将preload
设置为="元数据";。出于某种原因,它可以更快地加载文件进行播放。
Chrome在这方面其实很聪明。当预加载设置为自动时,它会在页面加载时缓存大约1mb的每个音频文件,因此当你按下"键时,它可以更快地播放;播放";按钮
我还开始收听audio
元素的onwaiting
事件,这样我就可以显示预加载程序,使体验更好一些。
由于Safari在文件真正准备好播放时会更早地启动oncanplay
和onplaying
,所以我不仅在这个事件中隐藏预加载程序,而且在1.5秒的超时后会将其平滑。
这对我来说已经足够好了,因为延迟从30秒(页面上有10个音频元素(减少到了1.5秒。