How to execute a long running process in the background without it blocking the rest of the React app?

I have a React app that must execute a long running process when a certain page is loaded. This process is currently blocking the page from being rendered while it is running.

What I have tried:

  useEffect(() => {
    async function async_wrapper() {

        new Promise((resolve, reject) => {
          execut_long_running_process();
        });

    }

    async_wrapper();

  }, []);

This also does not work:

  useEffect(() => {
    async function async_wrapper() {

        await new Promise((resolve, reject) => {
          execut_long_running_process();
        });

    }

    async_wrapper();

  }, []);

Inside execut_long_running_process, an AJV object compiles a validator function for some given schema. I cannot control how the ajv.compile method works.

Upvotes: 0

Views: 54

Answers (0)

Related Questions