how to stop and restart web speech api correctly?

Question

Does it required to create new instance of SpeechRecognition after each speech?

var recognition = new SpeechRecognition();
recognition.start();

Or just stop() and call the start() func again?

recognition.stop();
recognition.start();

Answer 1

Only 1 instance is necessary to interact with the SpeechRecognition object.

You can start the listener with start(). You can stop the listener with stop() or abort().

The abort() method slightly differs from the stop method:

The abort() method of the Web Speech API stops the speech recognition service from listening to incoming audio, and doesn't attempt to return a SpeechRecognitionResult.

Here is the example straight from the docs:

var recognition = new SpeechRecognition();
var speechRecognitionList = new SpeechGrammarList();
speechRecognitionList.addFromString(grammar, 1);
recognition.grammars = speechRecognitionList;

var diagnostic = document.querySelector('.output');
var bg = document.querySelector('html');

document.body.onclick = function() {
  recognition.start();
  console.log('Ready to receive a color command.');
}

abortBtn.onclick = function() {
  recognition.abort();
  console.log('Speech recognition aborted.');
}

recognition.onspeechend = function() {
  recognition.stop();
  console.log('Speech recognition has stopped.');
}

Find out more from the SpeechRecognition docs.