{"id":15314669,"url":"https://github.com/unframework/zone.js","last_synced_at":"2025-10-09T00:32:33.757Z","repository":{"id":30067721,"uuid":"33617184","full_name":"unframework/zone.js","owner":"unframework","description":"Implements Zones for JavaScript","archived":false,"fork":true,"pushed_at":"2015-04-08T17:43:56.000Z","size":371,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-04-14T18:22:18.378Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://github.com/angular/zone.js","language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"angular/zone.js","license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/unframework.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":"2015-04-08T16:00:28.000Z","updated_at":"2024-04-14T18:22:18.379Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/unframework/zone.js","commit_stats":null,"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fzone.js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fzone.js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fzone.js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unframework%2Fzone.js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/unframework","download_url":"https://codeload.github.com/unframework/zone.js/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":219877247,"owners_count":16554912,"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-01T08:46:37.232Z","updated_at":"2025-10-09T00:32:28.472Z","avatar_url":"https://github.com/unframework.png","language":"JavaScript","readme":"# Zone.js\n\n[![Build Status](https://travis-ci.org/angular/zone.js.png)](https://travis-ci.org/angular/zone.js)\n\nImplements _Zones_ for JavaScript, inspired by [Dart](https://www.dartlang.org/articles/zones/).\n\n\n## What's a Zone?\n\nA Zone is an execution context that persists across async tasks.\nYou can think of it as [thread-local storage](http://en.wikipedia.org/wiki/Thread-local_storage) for JavaScript VMs.\n\nSee this video from ng-conf 2014 for a detailed explanation:\n\n[![screenshot of the zone.js presentation and ng-conf 2014](/presentation.png)](//www.youtube.com/watch?v=3IqtmUscE_U)\n\n### Running Within a Zone\n\nYou can run code within a zone with `zone.run`.\nTasks scheduled (with `setTimeout`, `setInterval`, or event listeners) stay within that zone.\n\n```javascript\nzone.run(function () {\n  zone.inTheZone = true;\n\n  setTimeout(function () {\n    console.log('in the zone: ' + !!zone.inTheZone);\n  }, 0);\n});\n\nconsole.log('in the zone: ' + !!zone.inTheZone);\n```\n\nThe above will log:\n\n```\n'in the zone: false'\n'in the zone: true'\n```\n\nNote that the function delayed by `setTimeout` stays inside the zone.\n\n### Forking a Zone\n\nZones have a set of hooks that allow you to change the behavior of code running within that zone.\nTo change a zone, you _fork_ it to get a new one.\n\n```javascript\nzone.fork({\n  beforeTask: function () {\n    console.log('hi');\n  }\n}).run(function () {\n  // do stuff\n});\n```\n\nHooks that you don't override when forking a zone are inherited from the existing one.\n\nSee the [API docs](#api) below for more.\n\n\n## Usage\n\nTo start using Zones, you need to include the `zone.js` script in this package onto\nyour page. This script should appear in the `\u003chead\u003e` of your HTML file before any other\nscripts, including shims/polyfills.\n\n\n## Examples\n\nThere are two kinds of examples:\n\n  1. The kind you have to run\n  2. Illustrative code snippets in this README\n\n### Running the ones that you have to run\n\nFor fully working examples:\n\n  1. Spawn a webserver in the root of the directory in which this repo lives.\n  (I like to use `python -m SimpleHTTPServer 3000`).\n  2. Open `http://localhost:3000/example` in your browser\n\nBelow are the aforementioned snippets.\n\n### Overriding A Zone's Hook\n\n```javascript\nvar someZone = zone.fork({\n  afterTask: function () {\n    console.log('goodbye');\n  }\n});\n\nsomeZone.fork({\n  afterTask: function () {\n    console.log('cya l8r');\n  }\n}).run(function () {\n  // do stuff\n});\n\n// logs: cya l8r\n```\n\n### Augmenting A Zone's Hook\n\nWhen you fork a zone, you'll often want to control how the parent zone's\nhook gets called.\n\nPrefixing a hook with `$` means that the hook will be passed the\nparent zone's hook, and the hook will be expected to return the function to\nbe invoked rather than be the function itself.\n\n```javascript\nvar someZone = zone.fork({\n  afterTask: function () {\n    console.log('goodbye');\n  }\n});\n\nsomeZone.fork({\n  $afterTask: function (parentOnLeave) {\n    // return the hook\n    return function afterTask() {\n      parentOnLeave();\n      console.log('cya l8r');\n    };\n  }\n}).run(function () {\n  // do stuff\n});\n\n// logs: goodbye\n//       cya l8r\n```\n\n#### `+` and `-` Sugar\nMost of the time, you'll want to run a hook before or after the parent's implementation.\nYou can prefix a hook with `-` for running before, and `+` for running after.\n\nThe above can be written like this:\n\n```javascript\nvar someZone = zone.fork({\n  afterTask: function () {\n    console.log('goodbye');\n  }\n});\n\nsomeZone.fork({\n  '+afterTask': function () {\n    console.log('cya l8r');\n  }\n}).run(function () {\n  // do stuff\n});\n\n// logs: goodbye\n//       cya l8r\n```\n\nThis frees you from writing boilerplate to compose a new hook.\n\n## API\n\nZone.js exports a single object: `window.zone`.\n\n### `zone.run`\n\nRuns a given function within the zone.\nExplained above.\n\n### `zone.bind`\n\nTransforms a function to run within the given zone.\n\n### `zone.fork`\n\n```javascript\nzone.fork({\n  onZoneCreated: function () {},\n  beforeTask: function () {},\n  afterTask: function () {},\n  onError: function () {},\n  enqueueTask: function() {},\n  dequeueTask: function() {},\n  setTimeout: function () {},\n  setInterval: function () {},\n  alert: function () {},\n  prompt: function () {},\n  addEventListener: function () {}\n});\nmyZone.run(function () {\n  // woo!\n});\n```\n\nBelow describes the behavior of each of these hooks.\n\n### `zone.onZoneCreated`\n\nRuns when a zone is forked.\n\n### `zone.beforeTask`\n\nBefore a function invoked with `zone.run`, this hook runs.\nIf `zone.beforeTask` throws, the function  passed to `run` will not be invoked.\n\n### `zone.afterTask`\n\nAfter a function in a zone runs, the `afterTask` hook runs.\nThis hook will run even if the function passed to `run` throws.\n\n### `zone.onError`\n\nThis hook is called when the function passed to `run` or the `beforeTask` hook throws.\n\n### `zone.enqueueTask`\n\nThis hook is called when a function is registered with the VM.\nFor instance `setTimeout` and `addEventListener`.\n\n### `zone.dequeueTask`\n\nThis hook is called when a function is unregistered with the VM.\nFor instance `clearTimeout` and `removeEventListener`.\n\n### `zone.setTimeout`, `zone.setInterval`, `zone.alert`, `zone.prompt`\n\nThese hooks allow you to change the behavior of `window.setTimeout`, `window.setInterval`, etc.\nWhile in this zone, calls to `window.setTimeout` will redirect to `zone.setTimeout`.\n\n### `zone.addEventListener`\n\nThis hook allows you to intercept calls to `EventTarget.addEventListener`.\n\n\n## Status\n\n* `setTimeout`, `setInterval`, and `addEventListener` work in FF23, IE10, and Chrome.\n* stack trace rewrite is kinda ugly and may contain extraneous calls.\n* `elt.onevent` works in FF23, IE10, but not Chrome. There's [a fix in the works though](https://code.google.com/p/chromium/issues/detail?id=43394)!\n\n\n## See also\n* [async-listener](https://github.com/othiym23/async-listener) - a similar library for node\n* [Async stack traces in Chrome](http://www.html5rocks.com/en/tutorials/developertools/async-call-stack/)\n* [strongloop/zone](https://github.com/strongloop/zone)\n* [vizone](https://github.com/gilbox/vizone) – control flow visualizer that uses zone.js\n\n\n## License\nApache 2.0\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funframework%2Fzone.js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Funframework%2Fzone.js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funframework%2Fzone.js/lists"}