diff --git a/doc/reference/utils.md b/doc/reference/utils.md index 650769f9b..dba403786 100644 --- a/doc/reference/utils.md +++ b/doc/reference/utils.md @@ -9,6 +9,7 @@ functions are all available in the `owl.utils` namespace. - [`loadFile`](#loadfile): loading a file (useful for templates) - [`EventBus`](#eventbus): a simple EventBus - [`validate`](#validate): a validation function +- [`batched`](#batched): batch function calls ## `whenReady` @@ -78,3 +79,22 @@ validate( // - 'id' is missing (should be a number), // - 'url' is missing (should be a boolean or list of numbers), ``` + +## `batched` + +The `batched` function creates a batched version of a callback so that multiple calls to it within the same microtick will only result in a single invocation of the original callback. + +```js +function hello() { + console.log("hello"); +} + +const batchedHello = batched(hello); +batchedHello(); +// Nothing is logged +batchedHello(); +// Still not logged + +await Promise.resolve(); // Await the next microtick +// "hello" is logged only once +``` diff --git a/src/runtime/index.ts b/src/runtime/index.ts index 651263a9c..10ff0afb4 100644 --- a/src/runtime/index.ts +++ b/src/runtime/index.ts @@ -41,7 +41,7 @@ export { useComponent, useState } from "./component_node"; export { status } from "./status"; export { reactive, markRaw, toRaw } from "./reactivity"; export { useEffect, useEnv, useExternalListener, useRef, useChildSubEnv, useSubEnv } from "./hooks"; -export { EventBus, whenReady, loadFile, markup } from "./utils"; +export { batched, EventBus, whenReady, loadFile, markup } from "./utils"; export { onWillStart, onMounted,