InteractionManager

Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

InteractionManager permite programar tareas de larga duración después de que se completen las interacciones o animaciones. Esto permite que las animaciones de JavaScript se ejecuten sin interrupciones.

Las aplicaciones pueden programar tareas para ejecutarse después de interacciones usando:

tsx

InteractionManager.runAfterInteractions(() => {
  // ...long-running synchronous task...
});

Compare esto con otras alternativas de programación:

• requestAnimationFrame() para código que anima vistas progresivamente.

• setImmediate/setTimeout() ejecutan código después, pero pueden retrasar animaciones.

• runAfterInteractions() ejecuta código después sin retrasar animaciones activas.

El sistema táctil considera uno o más toques activos como una 'interacción' y retrasará los callbacks de runAfterInteractions() hasta que todos los toques finalicen o se cancelen.

InteractionManager también permite registrar animaciones creando un 'handle' de interacción al inicio y eliminándolo al completarse:

tsx

const handle = InteractionManager.createInteractionHandle();
// run animation... (`runAfterInteractions` tasks are queued)
// later, on animation completion:
InteractionManager.clearInteractionHandle(handle);
// queued tasks run if all handles were cleared

runAfterInteractions acepta un callback simple o un objeto PromiseTask con método gen que devuelve una Promise. Si se provee PromiseTask, se resuelve completamente (incluyendo dependencias asíncronas que programen más tareas vía runAfterInteractions) antes de ejecutar la siguiente tarea encolada síncronamente.

Por defecto, las tareas encoladas se ejecutan juntas en un lote setImmediate. Si setDeadline recibe un número positivo, las tareas solo se ejecutarán hasta que se alcance el plazo (en tiempo de ejecución del event loop de js), momento en que la ejecución cederá mediante setTimeout permitiendo que eventos táctiles inicien interacciones y bloqueen tareas encoladas, mejorando la capacidad de respuesta.

---

Ejemplo

Básico

TypeScript

JavaScript

Avanzado

TypeScript

JavaScript

Referencia

Métodos

runAfterInteractions()

tsx

static runAfterInteractions(task?: (() => any) | SimpleTask | PromiseTask);

Programa una función para ejecutarse tras completar todas las interacciones. Devuelve una "promise" cancelable.

---

createInteractionHandle()

tsx

static createInteractionHandle(): Handle;

Notifica al gestor que comenzó una interacción.

---

clearInteractionHandle()

tsx

static clearInteractionHandle(handle: Handle);

Notifica al gestor que finalizó una interacción.

---

setDeadline()

tsx

static setDeadline(deadline: number);

Un número positivo usará setTimeout para programar tareas tras superar eventLoopRunningTime el plazo; de lo contrario todas se ejecutarán en un lote setImmediate (predeterminado).