Training Tenserflow Model for Speech Recognition in React

Question

I'm using Electron + ReactJS and Tenserflow.

I want to have like a collection of 500-1000 words like 'dog', 'newline', 'cat' be recognized when i talk.

1. How much time can it take for the model to be trained with 500 words? I used 5 words and it took a bit of time. I don't want to have a loader and to take too much time to train on client. Can i train the model on server and fetch it to the user, or do i need to train it everytime he enters the app?
2. I tried using model training but it doesn't work. Also i'm not even talking and it shows random words. I didn't find much information about model training in tenserflow javascript. If collectExample just transfers the words, how can i train the model with custom words?

Also i'm quite new to Tenserflow. Here is the code:

const loadModel = async () => {
    setLoading(true);

    // start loading model
    const recognizer = await speech.create('BROWSER_FFT');
    // check if model is loaded
    await recognizer.ensureModelLoaded();
    
    const transferRecognizer = recognizer.createTransfer('programming');
    await transferRecognizer.collectExample('cat');
    await transferRecognizer.collectExample('dog');
    await transferRecognizer.collectExample('newline');

    await transferRecognizer.collectExample('_background_noise_');
    await transferRecognizer.collectExample('newline');
    await transferRecognizer.collectExample('dog');
    await transferRecognizer.collectExample('cat');
    await transferRecognizer.collectExample('_background_noise_');

    await transferRecognizer.train({
      epochs: 25,
      callback: {
        onEpochEnd: async (epoch, logs) => {
          console.log(`Epoch ${epoch}: loss=${logs.loss}, accuracy=${logs.acc}`);
        }
      }
    });

    setModel(transferRecognizer);
    // store command word list to state
    console.log('transferRecognizer.wordLabels():', transferRecognizer.wordLabels());
    setLabels(transferRecognizer.wordLabels());

    setLoading(false);
  };

  const recognizeCommands = async () => {
    model?.listen(
      result => {
        // add argMax function
        setAction(labels[argMax(Object.values(result.scores))]);
      },
      { includeSpectrogram: true, probabilityThreshold: 0.9 }
    );
  };