語音合成API塊主線程

Question

我正在使用語音合成API來發音不同單詞的列表。當我們的應用程序通過畫布進行講話時，我的應用程序可以將內容進行動畫處理。我意識到，當我執行一個新的話語：

var msg = new SpeechSynthesisUtterance(word); 
window.speechSynthesis.speak(msg); 

口語詞似乎阻止主線程，暫時停止動畫。每當我撥打window.speechSynthesis.speak();時都會發生這種情況。

有沒有辦法來對在Javascript中一個單獨的線程的語音合成運行，所以它不與我在主線程動畫干擾？

（我主要是在Chrome測試這個）

Answer 1

我會使用一個setTimeout的僞造的asynchronious電話：

var msg = new SpeechSynthesisUtterance(word); 
setTimeout(function() { window.speechSynthesis.speak(msg); }, 1); 

我必須承認，我不知道這件事。

Answer 2

的一種方法在這裏跟着是使用一個工作線程播放與該短信的聲音。

一個網絡工作者，但不列入訪問window對象。所以我們不能直接在工人內部調用window.speechSythesis.speak方法。

一個不錯的工作，圍繞text-to-speech library from Francois Laberge工具是

1. 將文本發送到說給工作線程。然後
2. 工作者線程將這段文字轉換成聲音（WAV）文件，並返回主線程的WAV文件。
3. 來自工作者線程接收消息將運行使用音頻元件WAV文件的主線程。

在我看來甚至更好的性能可以創建工作池。

請看看演示here

Answer 3

我真的建議你看看菲利普·羅伯茨的關於什麼是事件循環和這個可愛的總結爲什麼setTimeout 0是有道理的：https://www.youtube.com/watch?v=8aGhZQkoFbQ

總之一個快速的解決方案可能是Booster2ooo說什麼，你一個setTimeout調用內包裹呼叫：

setTimeout(function() { window.speechSynthesis.speak(msg); }, 0);