React useEffect does not work as expected

  useEffect(() => {
    const method = methodsToRun[0];
    let results = [];
    if (method) {
      let paramsTypes = method[1].map(param => param[0][2]);
      let runAlgo = window.wasm.cwrap(method[0], 'string', paramsTypes); //this is emscripten stuff
      let params = method[1].map(param => document.getElementById(param[0][0]).value);
      let result = runAlgo(...params); //this runs the emscripten stuff
      results.push(...(JSON.parse(result)));
      setGlobalState('dataOutput', results);
    }
    let newMethodsToRun = methodsToRun.slice(1);
    if (methodsToRun.length>0) {
      setGlobalState('methodsToRun', newMethodsToRun);
    }
  } , [dataOutput, methodsToRun]);

Hello, I am working on a ReactJS app that uses Webassembly with Emscripten. I need to run a series of algorithms from Emscripten in my Js and I need to show the results as they come, not altogether at the end. Something like this:

• Run first algo
• Show results on screen form first algo
• Run second algo AFTER the results from the first algo are rendedred on the screen (so that user can keep checking them)
• Show results on screen form second algo.....
• and so on

I already tried a loop that updates a global state on each iteration with timeouts etc, but no luck, so I tried this approach using useEffect, I tried various things but the results keep coming altogether and not one by one. Any clue?

from React useEffect does not work as expected