{"id":16363162,"url":"https://github.com/e0ipso/js_defer","last_synced_at":"2025-10-15T19:07:12.198Z","repository":{"id":18284139,"uuid":"21452469","full_name":"e0ipso/js_defer","owner":"e0ipso","description":"Drupal module to defer JS loading after a signal.","archived":false,"fork":false,"pushed_at":"2016-10-28T08:09:52.000Z","size":21,"stargazers_count":5,"open_issues_count":2,"forks_count":3,"subscribers_count":4,"default_branch":"7.x-1.x","last_synced_at":"2025-01-31T15:53:47.090Z","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/e0ipso.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}},"created_at":"2014-07-03T06:44:20.000Z","updated_at":"2016-10-28T08:08:08.000Z","dependencies_parsed_at":"2022-08-25T11:01:46.454Z","dependency_job_id":null,"html_url":"https://github.com/e0ipso/js_defer","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e0ipso%2Fjs_defer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e0ipso%2Fjs_defer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e0ipso%2Fjs_defer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/e0ipso%2Fjs_defer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/e0ipso","download_url":"https://codeload.github.com/e0ipso/js_defer/tar.gz/refs/heads/7.x-1.x","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238264770,"owners_count":19443407,"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-10-11T02:26:41.336Z","updated_at":"2025-10-15T19:07:07.158Z","avatar_url":"https://github.com/e0ipso.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"JS Defer\n========\n\nDrupal module to defer JS loading after a signal, it is a JavaScript Quality of\nService oriented module. This is useful to give some scripts priority in front\nof others. This is not done to make the scripts load faster, but to make give\ntheir XHRs priority against the deferred ones.\n\n## Scenario\n\nImagine a drupal page where the most important thing is a video that gets auto\nplayed. You also have several ajax carousels, ads all over the page, social\nplugins and maybe also a commenting system with a big media rich comments\nthread.\n\nNote how we are not talking about the download time of the script, but the\npotential XHR requests it can make.\n\nModern browsers are smart enough to make your page to be ready **as a whole** as\nsoon as possible. That may delay the video playback a lot since you don't have a\nway to tell the browser: _Start making all those requests, but save most of the\nbandwidth for the ones related to the video play since that is the thing I want\nto be ready as soon as possible_. You don't care if the YouTube embeds in the\ncomments take longer to display, or if the images in the Facebook page embeds\nare not optimally loaded in time. You want your flash player, the analytics\nsystem that comes with it, the custom styles to apply to it and the first buffer\nready. And you want it **fast**.\n\n## Dependencies\n\nThis module depends on the following javascript libraries:\n\n  - The [LazyLoad](https://github.com/rgrove/lazyload) library to do the actual\n  lazy load of the specified scripts.\n\n## Usage\n\nThis module will not do anything on its own, it will need an implementer module.\nThe implementer module will be responsible for:\n\n  - Listing the scripts to defer in PHP by implementing `hook_js_defer_info`.\n  - Triggering the javascript queue that will signal the lazy load start.\n\n```php\n/**\n * Implements hook_js_defer_info().\n */\nfunction implementer_js_defer_info() {\n  if (user_visiting_video_page()) {\n    // Deferred styles for video pages.\n    $deferred['js-queue'] = array(\n      'fallback' =\u003e 'timeout',\n      'timeout' =\u003e 10,\n      'scripts' =\u003e array(\n        'sites/all/modules/module-name/js/javascript-file1.js',\n        'sites/all/modules/module-name/js/javascript-file2.js',\n      ),\n    );\n  }\n  else {\n    // Deferred styles for the rest of pages.\n    $deferred['js-queue-2'] = array(\n      'fallback' =\u003e FALSE,\n      'scripts' =\u003e array(\n        'sites/all/modules/module-name/js/javascript-file3.js',\n        'sites/all/modules/module-name/js/javascript-file4.js',\n      ),\n    );\n  }\n  return $deferred;\n}\n```\n\nAnd then trigger the queue whenever you need:\n\n```js\n// Player informs that the first buffer is ready to be played. It's time to\n// allow all other scripts to load their stuff.\nDrupal.js_defer_load('js-queue');\n// The deferred scripts start to load now.\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fe0ipso%2Fjs_defer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fe0ipso%2Fjs_defer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fe0ipso%2Fjs_defer/lists"}