{"id":13657935,"url":"https://github.com/alexeyraspopov/react-coroutine","last_synced_at":"2025-04-07T08:16:22.380Z","repository":{"id":65482913,"uuid":"67593470","full_name":"alexeyraspopov/react-coroutine","owner":"alexeyraspopov","description":"Make your async components compact and descriptive by leveraging the power of the language features","archived":false,"fork":false,"pushed_at":"2020-04-22T21:16:34.000Z","size":164,"stargazers_count":264,"open_issues_count":3,"forks_count":11,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-03-31T07:08:48.311Z","etag":null,"topics":["async","coroutines","generators","iterators","react","react-components","stateful"],"latest_commit_sha":null,"homepage":"https://react-coroutine.js.org/","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/alexeyraspopov.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-09-07T09:40:27.000Z","updated_at":"2025-01-13T14:41:28.000Z","dependencies_parsed_at":"2023-01-25T11:15:35.194Z","dependency_job_id":null,"html_url":"https://github.com/alexeyraspopov/react-coroutine","commit_stats":null,"previous_names":[],"tags_count":22,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexeyraspopov%2Freact-coroutine","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexeyraspopov%2Freact-coroutine/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexeyraspopov%2Freact-coroutine/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexeyraspopov%2Freact-coroutine/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alexeyraspopov","download_url":"https://codeload.github.com/alexeyraspopov/react-coroutine/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247615382,"owners_count":20967184,"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":["async","coroutines","generators","iterators","react","react-components","stateful"],"created_at":"2024-08-02T05:00:53.740Z","updated_at":"2025-04-07T08:16:22.309Z","avatar_url":"https://github.com/alexeyraspopov.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# React Coroutine\n\n    npm install react-coroutine\n\n\u003e **Coroutines** are computer program components that generalize subroutines for nonpreemptive multitasking, by allowing multiple entry points for suspending and resuming execution at certain locations. Coroutines are well-suited for implementing more familiar program components such as cooperative tasks, exceptions, event loop, iterators, infinite lists and pipes.  \n\u003e — _[Wikipedia](https://en.wikipedia.org/wiki/Coroutine)_\n\nDescribe complex async state flows in your React components using only language\nfeatures like [generators][1], [async functions][2], and [async generators][3].\n\nNo API or new abstractions to learn, only JavaScript code as it intended to be.\n\n## Motivation\n\nReact Coroutine attempts to use basic and known language features for the sake\nof solving problems that are usually solved with APIs and new abstractions that\nrequire particular knowledge about them or, sometimes, about internal processes.\n\n## Examples\n\n```javascript\nimport React from 'react';\nimport Coroutine from 'react-coroutine';\n```\n\n```javascript\nasync function UserListContainer() {\n  try {\n    // Wait for async data and render it in the same way as plain components\n    let users = await Users.retrieve();\n    return \u003cUserList users={users} /\u003e;\n  } catch (error) {\n    // Handle failures in place with just JavaScript tools\n    return \u003cErrorMessage error={error} /\u003e;\n  }\n}\n\nexport default Coroutine.create(UserListContainer);\n```\n\n```javascript\nasync function* PokemonInfoPage({ pokemonId, pokemonName }) {\n  // Use generators to provide multiple render points of your async component\n  yield \u003cp\u003eLoading {pokemonName} info...\u003c/p\u003e;\n\n  // Easily import components asynchronously and render them on demand\n  let { default: PokemonInfo } = await import('./PokemonInfo.react');\n  let data = await PokemonAPI.retrieve(pokemonId);\n\n  return \u003cPokemonInfo data={data} /\u003e;\n}\n\nexport default Coroutine.create(PokemonInfoPage);\n```\n\n```javascript\nfunction* MovieInfoLoader({ movieId }) {\n  // Assuming cache.read() return a value from cache or Promise\n  let movieData = yield movieCache.read(movieId);\n  return \u003cMovieInfo data={movieData} /\u003e;\n}\n\nexport default Coroutine.create(MovieInfoLoader);\n```\n\n## Documentation\n\nSee [details page](https://react-coroutine.js.org/Details.html) for more.\n\n## Installation\n\nReact Coroutine project is available as the `react-coroutine` package on NPM.\nInstalled package includes precompiled code (ECMAScript 5), ES Modules-friendly\nartifact, [LICENSE](./LICENSE), and [the changelog](./CHANGELOG.md).\n\n## Contributing\n\nCurrent project has adopted a [Code of Conduct](./CODE_OF_CONDUCT.md) which is\nexpected to be adhered by project participants. Please also visit [the document\nwebsite](https://www.contributor-covenant.org/) to learn more.\n\nPlease read [the contributing guide](./CONTRIBUTING.md) to learn how to propose\nbug fixes and improvements, and how to build and test your changes.\n\n [1]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*\n [2]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function\n [3]: https://github.com/tc39/proposal-async-iteration\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falexeyraspopov%2Freact-coroutine","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falexeyraspopov%2Freact-coroutine","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falexeyraspopov%2Freact-coroutine/lists"}