{"id":23063455,"url":"https://github.com/julienetie/request-frame-modern","last_synced_at":"2025-04-03T08:13:59.672Z","repository":{"id":57354046,"uuid":"87058230","full_name":"julienetie/request-frame-modern","owner":"julienetie","description":"Optimal requestAnimationFrame + cancelAnimationFrame polyfill based on request-frame https://github.com/julienetie/request-frame","archived":false,"fork":false,"pushed_at":"2017-04-04T02:02:22.000Z","size":94,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-14T16:05:45.268Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/julienetie.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":"2017-04-03T09:32:12.000Z","updated_at":"2017-04-03T12:02:49.000Z","dependencies_parsed_at":"2022-09-05T13:10:36.722Z","dependency_job_id":null,"html_url":"https://github.com/julienetie/request-frame-modern","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/julienetie%2Frequest-frame-modern","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/julienetie%2Frequest-frame-modern/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/julienetie%2Frequest-frame-modern/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/julienetie%2Frequest-frame-modern/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/julienetie","download_url":"https://codeload.github.com/julienetie/request-frame-modern/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246961929,"owners_count":20861185,"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-12-16T04:10:29.785Z","updated_at":"2025-04-03T08:13:59.640Z","avatar_url":"https://github.com/julienetie.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# requestFrameModern\n\n## Optimal requestAnimationFrame \u0026 cancelAnimationFrame polyfill for modern development.\n\n### A polyfill based on [request-frame](https://github.com/julienetie/request-frame)\n\n- Supports ES6, CJS \u0026 UMD\n- Provides a clean polyfill for requestAnimationFrame \u0026 cancelAnimationFrame.\n- Tested \u0026 working on: IE 9+, FF 25+, Opera 36+, Safari 6.1+, Chrome 30+, iOS 7+, Android 4.4+, Android Chrome 30+.  \n- Doesn't modify native functions unless specified.\n\nIf you need to support legacy browsers see [requestFrame](https://github.com/julienetie/request-frame) for full support from IE5.5+.\n\n\n#### Install options\n\n`npm i request-frame-modern --save`\n\n`yarn add request-frame-modern`\n\n\n```javascript\nimport requestFrameModern from 'request-frame-modern';  // ES6\n```\n\n```javascript\n\u003cscript src=\"request-frame-modern.js\"\u003e\u003c/script\u003e // AMD, IIFE\n```\n\n```javascript\nconst requestFrameModern = require('request-frame-modern');  // CJS\n```\n\n\n### The API:\n#### Assign the timing functions:\n*requestFrameModern( request | cancel | native )*  request is default. \n```javascript\nvar request = requestFrameModern('request'); // window.requestAnimationFrame | setTimeout\nvar cancel = requestFrameModern('cancel'); // window.cancelAnimationFrame | cancelTimeout\n```\n#### Or re/ assign native functions:\n```javascript\nrequestFrameModern('native'); // re/ declares requestAnimationFrame \u0026 cancelAnimationFrame\n```\nBelow is just an example of the requestAnimationFrame API, see links: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame), [MSDN](https://msdn.microsoft.com/en-us/library/windows/apps/hh453388.aspx) \u0026 [W3](http://www.w3.org/TR/2011/WD-html5-20110525/timers.html). \n\n#### Loop something:\n```javascript\nvar requestId;\n\nfunction something( useTimeStamp ){\n    \n    // Do something here\n    \n    requestId = requestFrameModern(something); \n}\n\nrequestId = requestFrameModern(something); // Assigns Id \u0026 calls \"something\"\n```\n\n#### Cancel something:\n\n```javascript\ncancel(requestId);  // Cancels frame request \n```\n\n### The ideology\nrequest-frame-modern aims to provide an optimal development consistency with the use of animation timing functions across the large number of browsers and devices. This lib is ideal for those who may want to avoid re-assigning native functions, or avoid interfering with other libs that do. requestFrameModern() is purposely not a constructor. The intention is for requestAnimationFrame to be used once or few times during execution since multiple task are expected to be more efficient via a single requestAnimationFrame loop compared to several instances.\n    \n\n### Contribute\nJust do it!\n\n#### Test \n`npm run test` \nTo launch port 9999 \n\n- ./test/\n- ./test/compatibility-assignation-amd.html   \n- ./test/compatibility-assignation.html \n- ./test/compatibility-native-amd.html \n- ./test/compatibility-native.html \n\n_Browser based testing for RAF is imperative_\n\n--- \n\n[MIT License](https://github.com/julienetie/request-frame-modern/blob/master/LICENSE) \n\n\u0026#169; 2016 Julien Etienne \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjulienetie%2Frequest-frame-modern","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjulienetie%2Frequest-frame-modern","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjulienetie%2Frequest-frame-modern/lists"}