I am using the network tab on Google Chrome to see how a script is being fetched. I noticed that even after the status is set, the time continues loading. Why is that? Is this expected?

For example, when the status change to 200 the timer is 6.06s:

First status load

After some seconds, the time continues running also if the status is 200:

After waiting more seconds

This is my code:

const controller = new AbortController();
const timeoutId = setTimeout(() => controller.abort(), 10000);
fetch(`${host}/asset-manifest.json`, { signal: controller.signal })
      .then((res) => res.json())
      .then((manifest) => {
        const script = document.createElement("script");
        script.id = scriptId;
        script.crossOrigin = "";
        script.async = true;
        script.src =
          (process.env.REACT_APP_ENV === "dev" ? host : "") +
          manifest.files["main.js"];
        script.onload = renderMicroFrontend;
        document.head.appendChild(script); // THIS IS THE LINE THAT LOAD THE SCRIPT
        if (manifest.files["main.css"]) {
          const link = document.createElement("link");
          link.href =
            (process.env.REACT_APP_ENV === "dev" ? host : "") +
            manifest.files["main.css"];
          link.rel = "stylesheet";
          document.head.appendChild(link);
        }
        clearTimeout(timeoutId);
      })
      .catch((exc) => {
        setLoading(false);
        exc instanceof DOMException
          ? history.push("/timeout")
          : history.push("/notfound");
      });