{"id":19904394,"url":"https://github.com/alloc/rafz","last_synced_at":"2025-05-03T00:31:38.465Z","repository":{"id":60775138,"uuid":"354184641","full_name":"alloc/rafz","owner":"alloc","description":"Coordinate rAF calls across your app and/or libraries","archived":false,"fork":false,"pushed_at":"2022-08-20T16:35:39.000Z","size":175,"stargazers_count":5,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-26T00:04:12.571Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alloc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-04-03T02:53:31.000Z","updated_at":"2021-12-02T01:56:18.000Z","dependencies_parsed_at":"2022-10-04T16:35:40.608Z","dependency_job_id":null,"html_url":"https://github.com/alloc/rafz","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Frafz","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Frafz/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Frafz/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Frafz/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alloc","download_url":"https://codeload.github.com/alloc/rafz/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252126559,"owners_count":21698964,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-12T20:28:14.526Z","updated_at":"2025-05-03T00:31:37.313Z","avatar_url":"https://github.com/alloc.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# rafz\n\nCoordinate `requestAnimationFrame` calls across your app and/or libraries.\n\n* \u003c 700 bytes min+gzip\n* Timeout support\n* Batching support (eg: `ReactDOM.unstable_batchedUpdates`)\n* Uncaught errors are isolated\n* Runs continuously (to reduce frame skips)\n\n\u0026nbsp;\n\n## API\n\n```ts\nimport { raf } from 'rafz'\n\n// Schedule an update\nraf(dt =\u003e {})\n\n// Start an update loop\nraf(dt =\u003e true)\n\n// Cancel an update\nraf.cancel(fn)\n\n// Schedule a mutation\nraf.write(() =\u003e {})\n\n// Before any updates\nraf.onStart(() =\u003e {})\n\n// Before any mutations\nraf.onFrame(() =\u003e {})\n\n// After any mutations\nraf.onFinish(() =\u003e {})\n\n// Set a timeout that runs on nearest frame\nraf.setTimeout(() =\u003e {}, 1000)\n\n// Use a polyfill\nraf.use(require('@essentials/raf').raf)\n\n// Get the current time\nraf.now() // =\u003e number\n```\n\n\u0026nbsp;\n\n## Notes\n\n* Functions can only be scheduled once per queue per frame.\n* Thus, trying to schedule a function twice is a no-op.\n* The `update` phase is for updating JS state (eg: advancing an animation).\n* The `write` phase is for updating native state (eg: mutating the DOM).\n* [Reading] is allowed any time before the `write` phase.\n* Writing is allowed any time after the `onFrame` phase.\n* Timeout handlers run first on each frame.\n* Any handler (except timeouts) can return `true` to run again next frame.\n* The `raf.cancel` function only works with `raf` handlers.\n* Use `raf.sync` to disable scheduling in its callback.\n* Override `raf.batchedUpdates` to avoid excessive re-rendering in React.\n\n[Reading]: https://gist.github.com/paulirish/5d52fb081b3570c81e3a\n\n\u0026nbsp;\n\n## `raf.throttle`\n\nWrap a function to limit its execution to once per frame. If called more than once\nin a single frame, the last arguments are used.\n\n```ts\nlet log = raf.throttle(console.log)\n\nlog(1)\nlog(2) // nothing logged yet\n\nraf.onStart(() =\u003e {\n  // \"2\" is logged by now\n})\n\n// Cancel a pending call.\nlog.cancel()\n\n// Access the wrapped function.\nlog.handler\n```\n\n\u0026nbsp;\n\n## Used by\n\n- [react-spring](https://github.com/pmndrs/react-spring)\n- [react-three-fiber](https://github.com/pmndrs/react-three-fiber)\n- [use-element-size](https://github.com/alloc/use-element-size)\n\n\u0026nbsp;\n\n## Prior art\n\n- [fastdom](https://github.com/wilsonpage/fastdom)\n- [framesync](https://github.com/Popmotion/popmotion/tree/master/packages/framesync)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falloc%2Frafz","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falloc%2Frafz","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falloc%2Frafz/lists"}