Can i use Angular UI Router in my project? - angularjs

we are starting new project which uses angularjs as UI script.
I've gone through angular ui-router for https://github.com/angular-ui/ui-router.
UI-router module really great when compare to ngroute.
But I am afraid about the warning mentioned the ui-router's website homepage.
(Note: UI-Router is under active development. As such, while this library is well-tested, the API may change. Consider using it in production applications only if you're comfortable following a changelog and updating your usage accordingly.)
But i want to use this framework with angular.
Can anyone please suggest, will this cause any performance issue in future, much api will change, etc.

if the current version of angular-ui/ui-router works fine for you that is all you need.
will this cause any performance issue in future
why should it? since you are going to save your copy of the current version of angular-ui and it runs on client side you will never have problems (if you update angular-ui in 5 years of course you are going to have problems, if you never update it will ALWAYS work)
the note you quoted means that the current support of that library might change, so all you have to do(if they don't provide support for older versions) is to save a copy of those docs.

Related

How to upgrade from angular 1.4 to angular 5?

To upgrade from angular 1.4 to Angular 5 is it possible to use ngupgrade and follow incremental approach or it is strictly applicable to use ngupgrade from version 1.5. According to the image the prerequisites mentioned 1.5 is used for ngUpgrade.
There is official upgrade guide:
https://angular.io/guide/upgrade or https://angular.io/guide/upgrade-performance
But as a person who have written a big AngularJS application and now is working on a big Angular project, I recommend to start a new fresh project and step-by-step write a complete new application in the newest Angular. By my experience, switching between both frameworks is really hard and time-consuming.
In Angular things work totally different (better) and the framework itself offers much more than AngularJS.
If you still want to go the upgrade way, do it in 2 steps:
Upgrade to 1.5 (because there must be a reason why it is required)
Upgrade to Angular
Take a look at this article: https://angular.io/guide/upgrade
And you can upgrade or downgrade services and components between two frameworks.
You should know that there are two ways to bootstrap a Hybrid App:
Using UpgradeModule - Bootstraps both the AngularJS (v1) and Angular (v6) frameworks in the Angular zone
Using DowngradeModule - Bootstraps AngularJS outside of the Angular zone and keeps the two change detection systems separate.
I have tried both ways. And I recommend using DowngradeModule - it's better for performance and memory leaks.
If you google angular hybrid you will find a lot of articles and examples on github
Certainly look at https://angular.io/guide/upgrade to start. It's been a while since I've looked at it and it appears to have significant updates, which is nice. The "Preparation" section still reminds me of the joke: "How to be a millionaire and not pay taxes? Step 1: Get a million dollars." One section of preparation is "Using a Module Loader" which tells you why, but you're still on your own to figure out how to go from, say, grunt to webpack. It's beyond the scope of that page, sure, but that feels like big amorphous step to sort out.
I did find a developer, Sam Julien, that put together a guided video "course" which takes an app and walks through converting it. It is at https://www.upgradingangularjs.com and is certainly more comprehensive than any blog post I've seen. I'm not affiliated but it has gotten me started on laying out some of what we need to change.
It's not a trivial undertaking but being able to see the stages laid out ahead of time has made it seem incrementally possible. (Luckily, we are pretty close to the angularjs style guide already, which is another preparation step.) Good luck!

Upgrading Angular 2.0.0 to 2.x.x

Currently our application is on the Angular 2.0 version.
How important is it to keep updating it as and when Angular releases a new update?
In the changelog i dont see any breaking changes that need to be addressed immediately going from 2.0.0 to 2.4.2.
So is it necessary to upgrade our application from 2.0.0 to 2.4.2? Or should we just wait till there is another big release?
I would suggest upgrading to newer version of major release when:
You came across the issue/bug which was fixed in newer version.
There's a new feature which will come in handy.
Changes positively affecting performance - e.g. AOT compiler which can be a deal breaker to some people, but it might require some code to be rewritten to make it AOT-friendly.
Angular uses semantic versioning. Going from 2.0.x to 2.0.y means that a bug has been fixed. It's usually a good idea to avoid having bugs. Going from 2.0.y to 2.1.0 means that a new feature is available. You might want or need to benefit from this new feature.
You won't have any breaking change until the next major version, which will be 4.0.0 (there won't be a 3.x version, in order to align angular and its router versions)
As mentioned on this link under Best Practices Section
Best practices
Keep current with the latest Angular library releases. We regularly update our Angular libraries, and these updates may fix security
defects discovered in previous versions. Check the Angular change log
for security-related updates.
Don't modify your copy of Angular. Private, customized versions of Angular tend to fall behind the current version and may not include
important security fixes and enhancements. Instead, share your
Angular improvements with the community and make a pull request.
Avoid Angular APIs marked in the documentation as “Security Risk.”

What are the new features in Angular2 which are not in previous versions?

I have seen many articles regarding the changes in Angular2 . But I can't find much advantage in using Angular2. Can some one point out some new things that can be done using Angular2 which can't be done using the previous versions.
I know there are changes like $scope changed to this. I'm not asking for changes. I'm asking for new features that is in Angular2.
The TL;DR Version
Because ES6 is important to pick up, so no need for a custom dependency management system anymore. ES6 and Angular 1 together get ugly fast, as they together introduce a bajillion coding styles :(
Although the library is overall heavier, the architecture it uses (all component based) is a lot faster, lighter, and modular for a scalable application. See http://info.meteor.com/blog/comparing-performance-of-blaze-react-angular-meteor-and-angular-2-with-meteor
You receive (upcoming) Server Side Rendering, which enables fast initial load time and Search Engine Optimization (Yay!) See: https://github.com/angular/universal
You receive WebWorker friendliness, which makes your application able to "multi-task". See: https://github.com/angular/angular/blob/master/modules/angular2/docs/web_workers/web_workers.md
Shadow DOM is not fully inherited by Angular 2 yet, but I'm sure it will be. It has some support right now.
The whole concept of $scope is gone. You receive two way data binding with anything you put in your ES6/TypeScript class, but anything more you need to create a Observable or promise. Unfortunately, you can't just shove anything into the scope, digest, and WALAH! anymore.
And of course, all the cool stuff they mention on their website: https://angular.io/features.html
Hope that helps!
Support for different languages TypeScript, Dart, ES5, ES6.
Change detection is much more effective
Support for isomorphic applications where the same code can run on the server, the browser and a WebWorker in the browser
Moves more work to build time to reduce the time for the initial page load.
Simplified binding syntax
Improved DI
There are also lots of mostly smaller and tiny features that Angular2 doesn't (yet?) support which Angular 1.x does.

AngularJS with Durandal?

Is it possible to run AngularJS in a Durandal project? We are using Durandal now but want to move to AngularJS while still keep the site operational. Is it even a good idea to attempt this?
Any suggestion would be greatly appreciated.
You could run them side-by-side, but then you would just have two separate SPAs hosted on the same site. The doesn't seem like a good upgrade strategy to me. I think you would be better off to fully develop the new version and then replace the site altogether.
I would also advise that you wait for the release of AngularJS 2.0 (if possible). Rob Eisenberg has announced that he is currently working with the AngularJS team to provide core changes and plugins that will make Angular 2.0 more familiar to developers with Durandal experience, as well as to provide a migration path from Durandal to Angular 2.0.
The other answer isn't exactly correct. I have an example that proves it wrong.
Durandal is a module loader that can load any view / view model pair. If you choose to load an angular application and leave out the router portion it works just fine. It really isn't that difficult to get it set up.
Wrap your Angular.js application initialization code in an AMD module (view model) with a matching view and it just works.

Given the convergence of DurandalJS & AngularJS which should be chosen for a new project?

The owner of the DurandalJS project is now working at Google on AngularJS Next (v2?) in addition to keeping the current version of DurandalJS maintained. The two frameworks are converging.
http://blog.angularjs.org/2014/04/angular-and-durandal-converge.html
For a new mini-SPA project, which framework would be the best choice specifically with regard to the upgrade path?
I note that Rob Eisenberg has listed a number of tips to help existing DurandalJS users get ready for the next version, so it appears there will be an upgrade path available, but I'm wondering if the upgrade from AngularJS to the next generation framework would be simpler.
http://eisenbergeffect.bluespire.com/preparing-for-durandal-nextgen/
To be clear - I'm more concerned in making the right choice for the future (large SPA, split into multiple mini-SPAs) than for my current needs.
I'm not sure which one would be the best choice for now ... actually I'd say none of them is future save enough. Angular 2.0 is going to be definitely different from 1.0 and of course also from Durandal.
Nevertheless the framework itself maybe not that important. I think you should focus on separating code in reusable components. Whether it is a Angular Service/Factory/Provider or a clean Require Module in Durandal it actually doesn't matter. Getting it into the "NEW" Framework should be just a matter of adding the proper wrappers. As for 2-way-binding use the oberserver plugin to maintain clean POJOs.
The most important change from my perspective in NG2 will be the support of Lifecycle events, so even using those in Durandal now will be somehow supported in NG2. As for composition there for sure will be a way to simulate that easily in NG2 as well.
For current work the only two things important for the decision of the currently used Framework in my opinion are the use of RequireJS and Framework simplicity. Sure you can add it to Angular as well, there are several guides on that, but Durandal was built from ground up with RequireJS in mind. Especially in bigger projects this can save you a lot of headache from missing or wrong dependencies. As of the second argument -> porting Durandal to Angular is not that of a big deal because it's written in an easy and understandable way. Vice-versa may be a totally different story. Getting your custom Directives implemented as a combination of templating and ko-bindings can get pretty hard :)
So as a closing statement, if it's going to be a small project, but with the need for continuous support as well as update to NG2 in future, I'd go with Durandal. Besides RequireJS everything is exchangeable and adaptable. In the case of Angular I'm not sure how drastically the new DI system will change the way of development so that would be a show-stopper for me.
Btw. here is the design-document for NG2. So as you see there kinda everything that is important is gonna change:
Router
Persistance
Directives
Modularization (maybe we finally see RequireJS :) )

Resources