{"id":18965196,"url":"https://github.com/parameter1/deferred-script-loader","last_synced_at":"2026-04-03T15:30:14.772Z","repository":{"id":43464176,"uuid":"349781677","full_name":"parameter1/deferred-script-loader","owner":"parameter1","description":"Defers loading of remote scripts until DOM events have fired","archived":false,"fork":false,"pushed_at":"2023-02-17T16:26:24.000Z","size":278,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-01-01T05:44:28.784Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/parameter1.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-03-20T16:43:50.000Z","updated_at":"2023-01-11T23:09:19.000Z","dependencies_parsed_at":"2023-02-09T16:30:31.344Z","dependency_job_id":"58ded47f-a8dd-4f89-bc8d-eb9ca3780c1a","html_url":"https://github.com/parameter1/deferred-script-loader","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/parameter1%2Fdeferred-script-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/parameter1%2Fdeferred-script-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/parameter1%2Fdeferred-script-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/parameter1%2Fdeferred-script-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/parameter1","download_url":"https://codeload.github.com/parameter1/deferred-script-loader/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239964468,"owners_count":19725946,"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-08T14:28:14.886Z","updated_at":"2026-04-03T15:30:14.722Z","avatar_url":"https://github.com/parameter1.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Deferred Script Loader\nDefers remote scripts until specific events are fired, such as `DOMContentLoaded`, `window.onload` or immediately. Scripts can also be completely deferred until they are manually triggered which allows for custom loading triggers, such as `IntersectionObserver` event or other interactions such as `scroll`, `touchstart` etc.\n\n## Usage\nInclude the command queue and script on your website. _Note: this library uses native ES modules_\n\n```html\n\u003c!-- create the command queue --\u003e\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n  \u003chead\u003e\n    \u003cscript\u003e\n      (function (i,r) {\n        window.__p1defer = r; i[r] = i[r] || function () {\n          var args = arguments; (i[r].q = i[r].q || []).push(args);\n          if (args[0] === 'register' \u0026\u0026 args[1] \u0026\u0026 args[1].init) args[1].init();\n        }\n      })(window, 'deferScript');\n    \u003c/script\u003e\n    \u003c!-- load the module --\u003e\n    \u003cscript type=\"module\" src=\"./src/index.js\" async defer\u003e\u003c/script\u003e\n  \u003c/head\u003e\n\u003c/html\u003e\n```\n\nThen register a script. See the `index.html` file for more examples.\n```html\n\u003cscript\u003e\n/**\n * Registers a new defered script.\n */\ndeferScript('register', {\n  /**\n   * The queue name to use when invoking `deferScript('call')` commands.\n   */\n  name: 'googletag',\n\n  /**\n   * The remote script src to defer.\n   */\n  src: 'https://securepubads.g.doubleclick.net/tag/js/gpt.js',\n\n  /**\n   * When `true` will load the script as an ES module (\u003cscript type=\"module\"\u003e).\n   * Defaults to `false`\n   */\n  esm: false,\n\n  /**\n   * Determines when to load the remote script `src`.\n   * Valid options include: `immediate`, `ready`, `load`, or `never`.\n   * This can also be a function that returns the `on` string value.\n   */\n  on: 'ready',\n\n  /**\n   * If set, delays load of the external script until a set time after the `on`\n   * event fires.\n   *\n   * When using `initOnly=true`, this delay is still applied when manually\n   * calling `load`.\n   *\n   * In this example, the script would not be loaded until 3 seconds _after_ the\n   * `ready` event fires (or whatever the `on` value is).\n   */\n  delayMs: 3000,\n\n  /**\n   * Determines whether to execute the script within an animation frame in the\n   * browser.\n   */\n  requestFrame: true,\n\n  /**\n   * Queue setup hook. Logic within this hook is immediately executed, and is\n   * useful for running setup functions (such as queues) required by the library\n   * being loaded.\n   *\n   * Note: the init function must assign a value to the `window` object directly,\n   * not declare a local var.\n   */\n  init: function() {\n    window.googletag = window.googletag || {}; window.googletag.cmd = window.googletag.cmd || [];\n    googletag.cmd.push(function() { googletag.pubads().setTargeting('uri', '/'); });\n    googletag.cmd.push(function() { googletag.enableServices(); });\n  },\n\n  /**\n   * When true, will only call the init function above but will _not_ load the\n   * remote script.\n   *\n   * Instad, to call the remote script, the `deferScript('load', { name: '' })`\n   * call must be invoked on your own.\n   *\n   * This is useful when you want to manually control when the script should\n   * execute (e.g. on scroll or intersection)\n   */\n  initOnly: false,\n\n  /**\n   * Script attributes to pass.\n   * By default both async and defer are set.\n   */\n  attrs: { async: 1, defer: 1 },\n});\n// manually calling the googletag script when using `initOnly=true`.\n// deferScript('load', { name: 'googletag' });\n\u003c/script\u003e\n```\n\n\n## Build\nBuilds to native ESM using Vite (`\u003cscript type=\"module\"\u003e`).\n\n### Requirements\n- Node.JS v14\n\n### Sizes (non-gzipped)\n- legacy webpack build: 54k\n- legacy webpack build less `querystring`: 60k (likely polyfilling `URLSearchParams`)\n- vite build with specific browser targets\n  - using standard `esbuild` (`dist/lib.js`): ~10k\n  - post build with `terser` (`dist/lib.min.js`): ~7k\n\n### Browser Targets\n#### Modern\nLocated in `vite.config.js`\n```js\n['chrome64', 'edge79', 'safari11.1', 'firefox67', 'opera51', 'ios12']\n```\nTo provide _minimum_ support for\n- [Native ES Modules](https://caniuse.com/es6-module)\n- [Native ESM Dynamic Import](https://caniuse.com/es6-module-dynamic-import)\n- [Support for `import.meta`](https://caniuse.com/mdn-javascript_operators_import_meta)\n\n#### Legacy\nOriginally in `package.json`\n```json\n{\n  \"browserslist\": [\n    \"Chrome \u003e= 49\",\n    \"Firefox \u003e= 45\",\n    \"Safari \u003e= 9\",\n    \"Edge \u003e= 12\",\n    \"IE \u003e= 11\",\n    \"iOS \u003e= 10\"\n  ]\n}\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fparameter1%2Fdeferred-script-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fparameter1%2Fdeferred-script-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fparameter1%2Fdeferred-script-loader/lists"}