mgechev / mgechev/angular2-hot-loader
Destroy and reinitialize only changed components
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 113
- Forks
- 8
- PR merge metrics
- No merged PRs in 30d
Description
Right now the hot loading works by (re)loading the app's root component using the `DynamicComponentLoader`, i.e. reinitializing the whole application every time a component/template/style is updated.
This could become a problem as the application grows larger. I know that by using patterns like flux or redux the view of the application can be reinitialized just by persisting the state before the application gets reinitialized. But for people who do not use such patterns the hot-loader could be more helpful if **only** those components (and thus their children) would be reloaded that changed.
I haven't fully understood the inner workings of how Angular instantiates components and their respective views but I think one API one could use for this could be the [`AppViewManager`](https://angular.io/docs/ts/latest/api/core/AppViewManager-class.html). If this was possible then there would also be the possibility to transfer some of the state of the old component to the updated component. I think that this could provide an even smoother developer experience.
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
No file or test is named. Start by reading the DynamicComponentLoader implementation and Angular's AppViewManager API to understand the current root-component reload flow. Done means changed components and their children reload without reinitializing the whole application, with unaffected application state preserved where supported.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- frontend, tooling
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 20/100