TTS blocking process


I am using TTS to speak a countdown from 5 to 1 while I update the textContent property of a div and drawing a canvas.
The .speak() function is in a requestAnimationFrame and is only called once per second.

My problem is that once compiled, if I call .speak() it blocks the process for 1/2 second. As a result the refresh of the text and the drawing of the canvas are frozen.

Here is a simplified version of the code

refresh: () => {

  this.currentTime = new Date().getTime() - this.msStartTime; // Gives a time in ms

  let msItemStartTime = 10000;
  let countdown = Math.floor( (msItemStartTime - this.currentTime) / 1000 ); // Gives a countdown in seconds
  let divElement = <HTMLElement>...; // Some div element

  if(divElement.textContent != countdown){
    divElement.textContent = countdown;
    if(countdown < 6000)
	  this.tts.speak({text: `${countdown}`, rate: 1.3});