Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
We all know AngularJS builds a digest loop when it comes to change detection , which proves to be less productive than Angular.
I want to know
How Angular works to get around this performance issue?
Does Angular also have a digest loop similar mechanism? if not , how does it know when a change could happen and need to perform change detection?
I know Angular boasts some features such as zone.js monkeypatch , unidirectional component tree, change detection strategy, RXJS ,immutableJS,etc.. either of which partly or directly drive Angular renders UI faster at the time a change happens. I'm not able to understand how Angular eventually gets faster by using these techniques together and properly?
Table that summarizes the major differences between Angular and AngularJS Change Detection.
To Explore more on this
Change Detection Differences between Angular and AngularJS
Change Detection Reinvented Victor Savkin
Angular’s $digest is reborn in the newer version of Angular
The Angular 2 Compiler Tobias Bosch
The Angular Compiler 4.0 - TOBIAS BOSCH.
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I am looking into ways of migration a current Angular 1 project to Angular 4.
Options are ng-forward, ngUpgrade or rewrite.
I am thinking on rewriting it but with a twist.
I keep the current application
Start writing the new one parallel to it
All new NG4 rewrites, I want to use ... so bit by bit in other words.
Has anyone attempted this or know a better way?
Incrementally upgrade an AngularJS application to Angular.
One of the keys to a successful upgrade is to do it incrementally, by running the two frameworks side by side in the same application, and porting AngularJS components to Angular one by one. This makes it possible to upgrade even large and complex applications without disrupting other business, because the work can be done collaboratively and spread over a period of time. The upgrade module in Angular has been designed to make incremental upgrading seamless.
For more information, see Angular Developer Guide - Upgrading from AngularJS
The DEMO on PLNKR
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I am new to angular 2 and SO as well. I would like to know the major architecture changes in Angular2 compared to Angular. There used to be $apply, $digest, $evalAsync and so much more, why was so many changes made in Angular.
From what I understood, the performance was the major issue which has been achieved in Angular2. It's more lightweight and all.
Can someone please shed some light on this. A brief answer would be of great help, just for a jump start.
Thanks in advance
There is a nice article in the docs of Angular 2 that may help you to get a good understanding of its building blocks: https://angular.io/docs/ts/latest/guide/architecture.html
$apply, $digest, $evalAsync does not exist anymore since Angular 2 has no digest cycle anymore.
An Angular 2 application can be pictured as a directed graph of components.
If you come from AngularJS you also can make your components run with Angular 2: https://angular.io/docs/ts/latest/guide/upgrade.html
There you can read really good explanation, how angular2 change detector works:
http://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html
And what in general are zones:
http://blog.thoughtram.io/angular/2016/01/22/understanding-zones.html
http://blog.thoughtram.io/angular/2016/02/01/zones-in-angular-2.html
Here in brief about change detection:
How does optimised data binding mechanism work in Angular2
This is really essential knowledge if you want to create fast apps.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
Angular 1 excels in data binding and provided a structued MVC MVW framework.
It fails in providing built-in modularity.
What are the core selling points of Angular 2? Im not looking for opinion, just plain simple bullet point facts and Im only interested in core selling points.
Also what other libraries such as bootstrap / polymer gel well with angular 2?
For me? Just off the top of my head:
Support for Functional Reactive Programming using RxJS Observables.
Built from the ground up with Typescript, meaning Types are a first class construct.
Unidirectional data flow.
Native ES6 Modules, no more endless script tags.
Fully component based.
Better template syntax.
An even better Router.
Much better Dependency Injection.
Support for sped up initial loads thanks to server-side prerendering.
ZoneJS Support, no more digest loop!
Of those my favorite feature is definitely the FRP support. We can drastically enhance performance by using Immutable Objects or Observables for our change detection.
The Formbuilder API as well as the HTTP API is fully compatible with RxJS making it very very powerful.
As for libraries, Angular-Material is obviously a big one. Another favorite of mine is NativeScript, which aims to create fully native mobile applications from your Angular 2 App. I'm sure there'll be tons more once it actually releases.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
In my angular.js app i'm using this directive:
https://github.com/sparkalow/angular-count-to
Which works great on the web.
When i compile it for phonegap, it's really really slow.
But what other way i have to animate a number from 0 to 200 (for example), in two secods, without hurting the performance of my app?
The directive uses $timeout, as is the suggested way to get setTimeout functionality in Angular. It's likely doing this for one of the following reasons, though there are others too:
Easy to inject a mock for testing
Assumes that each step should allow other components to update
It's the "Angular Way"
I don't believe #2 is actually a big concern since it doesn't expose the value or update anything on the scope anyway, and does standard HTML textContent manipulation.
Regardless, the point is that $timeout does a setTimeout as well as a $digest (allowing Angular to update other components). The extra digest cycles are likely the slow part, and every Angular developer should read up on them as they're central to Angular's design (hint: go read up on these now). As such, taking the original library, replacing the $timeout with a setTimeout call (and, optionally, a manual digest trigger when it finishes, in the if (step >= steps) block) should speed it up.
Be careful about these sorts of changes, though - $timeout is typically the correct way to go.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I was playing with ReactJS for a bit, and given a bit of prior exposure to AngularJS, and the way things are done in the latter, I had a hard time to get used to the syntax and the 'flow' of React.
So I had the above-mentioned question, plus: are there scenarios when ReactJS should be preferred to AngularJS?
Could anyone point out what can be done [easier/better/more efficiently] in React rather than in Angular, and other way around.
It's actually the opposite. Angular has a lot of features, apis, configuration options, etc. React tries to be much simpler and let you choose how your application is structured. Controllers, directives, and templates are reduced to just components. Services are just plain JavaScript, there's nothing React specific about it. Things like $q and $timeout don't exist because there's no digress (use anything you like for those).
You use React in your application, vs making your application in angular.
ReactJS uses the concept of virtual DOM which speeds up the rendering of the app.
Watch Pete Hunt's excellent video on Virtual Dom here:
https://www.youtube.com/watch?v=-DX3vJiqxm4
The syntax might be very unconventional but the same thing can be said about Angular's concept of Directives, services, controllers, etc. It just takes time to get used to, but once you feel comfortable, you'll find that thinking in ReactJS really makes sense.