Escriu per cercar…

Web Worker

S'ensenya a
Eines computacionals en bioinformàticaAnàlisi de seqüènciesDAW-BIO

Introduction

Worker

Usage

To solve the UI freezing problem, we can move the heavy calculation to a Web Worker. A Web Worker runs JavaScript code in a separate thread, allowing the main thread to remain free to handle user interactions and UI updates.

In our React component, we create an instance of the worker and communicate with it:

tsx
App.tsx
useEffect(() => {
  workerRef.current = new Worker(
	new URL("./workers/fibWorker.ts", import.meta.url),
	{ type: "module" },
  );

  workerRef.current.onmessage = (e: MessageEvent<Result>) => {
	setResults((prev) => [...prev, e.data]);
  };
}, []);

const handleClick = () => {
  if (workerRef.current) {
	workerRef.current.postMessage({ id: idRef.current++, n: 42 });
  }
};

Now, when we click the button, the Fibonacci calculation runs in the background, and the UI remains responsive.

Pending

Estàs llegint una vista prèvia.

Inicia sessió amb Google per llegir la pàgina completa.

Inicia sessió amb Google

Amb qualsevol compte de Google. Només et demanarem que acceptis les condicions del servei.