What's new in Angular 5? - Quora [PDF]

The Angular team is working hard and continuously bringing new features into Angular in each of the version. There has n

13 downloads 51 Views 332KB Size

Recommend Stories


Whats New in HP Data Protector 7.0
Stop acting so small. You are the universe in ecstatic motion. Rumi

whats new swscc 20171023 final
The beauty of a living thing is not the atoms that go into it, but the way those atoms are put together.

Whats New Microsoft Dynamics AX 2009
Respond to every call that excites your spirit. Rumi

PDF Angular 2 By Example
The beauty of a living thing is not the atoms that go into it, but the way those atoms are put together.

[PDF] Angular 2 By Example
In the end only three things matter: how much you loved, how gently you lived, and how gracefully you

Angular Update Guide - Beta [PDF]
Angular Update Guide. Select your current Angular version, and the desired version of Angular. We'll tell you the steps to update. from. to. How complex is your app? I use ngUpgrade. Package Manager. Show me how to update!

Download Angular in Action
Don't watch the clock, do what it does. Keep Going. Sam Levenson

Korero Mai-Whats on
It always seems impossible until it is done. Nelson Mandela

August 2016 Whats Happening
I cannot do all the good that the world needs, but the world needs all the good that I can do. Jana

Whats on in June 2017.pages
In every community, there is work to be done. In every nation, there are wounds to heal. In every heart,

Idea Transcript


Ask New Question Search for questions, people, and topics

Angular 5

Learning AngularJS

Sign In

Job Interview Questions and Answers

Angular 2/4/5

What's new in Angular 5?

Related Questions When can we expect Angular 5?

http://www.code-sample.com/2017/08/whats-new-in-angular-5-angular-4-vs.html

Why haven't you learned Angular 5 yet? What are the new features in Angular 5.0?

16 Answers

Is it possible to use Angular 5 and Laravel? If yes, can you provide me with any links to get started?

Miloni Shah, former Content Writer Answered Sep 8 2017

Angular, one of the best open-source JavaScript frameworks for web application development, recently upgraded with new version Angular 4. Earlier release of Angular 2 version, was all in one a new Angular Framework, unlike AngularJS. For Angular 4 or Angular v4, the team decided to name it as “just Angular”, without affirming any version number with the name.

What is a good way to combine Angular 5 with an Angular 1.6 project? We want all new pages to be written with Angular 5, but will keep some ol... In the difference between AngularJS and Angular 2, it says that Angular 2 is more mobile oriented. What makes Angular 2 more mobile oriented? Should I learn Angular 1.0, Angular 2.0 or React? Which is easier to learn for a new developer: AngularJS or Angular 2? What is the difference between Angular 2 and Angular 4? Should I learn Angular 2 or 4? Ask New Question

Just as, with every new Angular version framework, Google’s Angular team unboxed amazing updates and enhancements for Angular developers and AngularJS web development enterprise solution, likewise in Angular version 4 Google came up with multiple new features and invisible makeovers for faster performance and easy development. What’s New 1. Revamped *ngIf and *ngFor Template Binding syntax supports else style syntax with if syntax and let developers to assign conditional rendering to local variable. Syntax for is used to store a sliced collection. Similarly as and async are added to template to simplify the syntax. 1

2



24

',

25

})

26

export class App implements OnInit{

27

welcome = FirstTimeBuyerComponent;

28



29

ngOnInit() {

30

if(!this.buyer.isfirstVisit){

31

this.alert = FrequentBuyerComponent;

32

}

33

}

34

}

6. Angular Universal Render Angular applications directly with web server with Angular Universal. For Angular Universal, developers no longer need JavaScript to render content, so the websites are optimized faster on search engines. Also, with Web Worker Threads content can be rendered outside the GUI thread even and can be simply added to the DOM Tree to display content later. Majority of the Angular 4 Universal code is now stored in @ angular/platform-server. 7. Smaller and Quick As Angular 4 web development code consume less space, it runs rapidly compared to AngularJS and Angular 2. The developer is continuously pursuing additional improvements to make it faster and smoother. 8. View Engine – AOT Compilation AOT – Ahead Of Time complication reduces about 60% size of generated code. So, with an increase in complexity of templates, more time is saved. It is heard that in Angular 4 adjustments are made under the hood such that it cuts down production bundles by hundreds of kilobytes. It reduces the loading time of the page and at same time it boosts overall page speed with reduced size of code. It results in the noticeable improvement in performance. 9. Flat ES Modules (Flat ESM / FESM) No multiple small files per module, just one file is shipped per module inclusive of all necessary files for that module. As the files are of ‘flat’ versions, they provide better performance on execution and improve Tree Shaking and build. Flattened version ships rolled up version of code in ECMAScript Module format. 10. Source Maps for Templates Source maps are fundamental for debugging and finding errors. Right from source code to output it is connected, so it helps in cutting off the errors. Now, with Angular 4 source maps are not just with code but also for templates. Source maps for Templates created by new Template Compiler generate contextual information while debugging on browser and even in Crash reports and log messages. Forthcoming Angular 5 Next milestone Angular 5 is expected to release in September, 2018. Angular 5 may come with Google-driven progressive web apps to cache apps in the browser. Furthermore, features may include a build optimizer to make app smaller by excluding irrelevant code and making Material Design components compatible with server-side rendering. 5.1k Views · 18 Upvotes

Promoted by Triplebyte

Engineers don't program whiteboards. They program computers. Get a job at a top tech company without a whiteboard interview or a resume screen. Show us you can code. Learn more at triplebyte.com

Related Questions

More Answers Below

When can we expect Angular 5? Why haven't you learned Angular 5 yet? What are the new features in Angular 5.0? Is it possible to use Angular 5 and Laravel? If yes, can you provide me with any links to get started? What is a good way to combine Angular 5 with an Angular 1.6 project? We want all new pages to be written with Angular 5, but will keep some ol... Ask New Question Pedro Eugénio, Tech Lead at 7 Peaks Software (2016-present) Answered Oct 30 2017

Source: What's new in Angular 5: Performance & Progressive Web Apps - iGenius Just published a post on this, because I also wanted to know ;) The Angular team is being active in deploying new versions of the framework in a Semantic Versioning way so far since September 2016. Version 5 is coming, and although a few days delayed mostly for syncing with the different teams and projects; it will bring some new features and great improvements, particularly in performance. So, What’s new in Angular 5? Performance Reduced bundle sizes Compiler and build improvements AOT compilation as default 3x performance gain by bypassing Zone’s addEventListener to native handler Ahead of Time Compilation (AOT) Until now, while compiling or building an Angular application, one always had to add the AOT flag if desired to have an AOT build . With this new version, AOT compilation is active by default on the Angular CLI. This will force developers to have better performant applications by default; at the same time it can increase build times; because of that, it is recommended that during development JIT compilation is used instead. Mobile Progressive Web Apps have been around for some time now. Along with other mechanisms , it allows an application to be delivered optimized for a better and faster mobile experience. Until now this could be done with the help of external libraries but now with the new version, the @angular/service-worker package will take care of all the internal mechanisms and ways to add support for Progressive Web Apps to any Angular application. Updating With this new version, there will be a few breaking changes, my recommendation, is that you follow up with the official Changelog and read through these changes before you start updating your Angular application. Release

As you can see, by today on the 27 of October, we should have already a new release. These target dates act mostly as references so that all the teams for all the different Angular projects can synchronize and prepare to have a release on these dates. Still, keep an eye on these dates, it will give you preparation time and awareness for your next updates. 4.4k Views · 12 Upvotes

Promoted by Fullstack Academy

Top ranked 13 week coding bootcamp in chicago. Learn to code like a professional at Fullstack Academy. Our grads have exceptional career outcomes. Learn more at fullstackacademy.com

Ashish Bakshi, Angular Enthusiast | Cogito Ergo Sum Answered Aug 24 2017

The Angular team is working hard and continuously bringing new features into Angular in each of the version. There has not been any ground breaking changes in subsequent Angular 4.x.x as we witnessed in Angular 4, when it got upgraded from Angular 2. Let me shed some light on some of the significant changes in Angular 4 to prove a point that I am gonna make later: The angular 4 is way too smaller and faster than the previous ones. Angular Universal and Angular-CLI became an integral part of the official Angular project. The new view engine introduced in Angular 4 reduced the size of the generated code for components by around 60%. Another big change was the new Animation package. They moved the code of the animations from the @angular/core package to @angular/platformbrowser/animations to optimize the application bundle size. And who would forget, the introduction of the ngIf else syntax and the improved ngFor directive. Full support for TypeScript 2.1 and 2.2. Upon consideration of the above statements, it would not be an exaggeration to have the same kind of expectation from Angular 5. As of now, in angular 5 beta4 they have added some new feature and performance improvements, but mostly a lot of bugfixes. Features compiler: add representation of placeholders to xliff & xmb forms: add options arg to abstract controls router: add events tracking activation of individual routes Performance Improvements Improved Tree Shaking core: use native addEventListener for faster rendering. Overall, Version 5 will for sure have bunch of new features, performance improvement, bug fixes and it is obvious to expect some surprises as well. AOT has been made the default, watch mode, type checking in templates, more flexible metadata, removing *.ngfactory.ts files, better error messages, smooth upgrades, tree-shakeable components and the hybrid upgrade application improvements are only parts of the amazing stuff that are going to assemble the next major version. For more precise details, I would refer you to go through this official Angular 5 Beta4 Change Log . Moving ahead, you can checkout this amazing tutorial on Angular 4 that covers all the key concepts along with practical demonstration:

Hope it helps! 6.5k Views · 11 Upvotes

Rahul Singh, Full Stack Developer at C1X Inc (2017-present) Answered Aug 24 2017

Please denote is as Angular version 5 not Angular 5 Angular v5 is going to be a much better Angular and you will be able to take advantage of it much easier and Version 5 will be fully released on September/October 2017. The Angular v5 Contains bunch of new features, performance improvements and lot of bug fixes and also some surprises to Angular lovers. 1. Make AOT the default 2. Watch mode 3. Type checking in templates 4. More flexible metadata 5. Remove *.ngfactory.ts files 6. Better error messages 7. Smooth upgrades 8. Tree-Shakeable components 9. Hybrid Upgrade Application 10. And so on... Angular 5 Performance Improvements - Angular v5 1. Use of addEventListener for the faster rendering and it is the core functionality. 2. Update to new version of build-optimizer. 3. Added some Improvements on the abstract class methods and interfaces 4. Remove decorator DSL which depends on Reflect for Improve the Performance of Apps and This is the core functionality. 5. Added an option to remove blank text nodes from compiled templates 6. Switch Angular to use Static-Injector instead of Reflective-Injector. 7. Improve the applications testing. 8. Improve the performance of hybrid applications 9. Improvements on Lazy loading for Angular 10. And so on... Some Improvement on HttpClient – This is used for Applications communicate with backend services over the HTTP protocol! 1. Improvement on Type-checking the response 2. Improvement on Reading the full response 3. Improvement on Error handling and fetching error details 4. Improvement on Intercepting all requests or responses 5. Improvement on Logging 6. Improvement on Caching 7. Improvement on XSRF Protection Added Features - Angular v5 1. Added Representation of Placeholders to xliff and xmb in the compiler 2. Added an Options Arg to Abstract Controls in the forms controls 3. Added add default updateOn values for groups and arrays to form controls 4. Added updateOn blur option to form controls 5. Added updateOn submit option to form controls 6. Added an Events Tracking Activation of Individual Routes 7. Added NgTemplateOutlet API as stable in the common controls 8. Create StaticInjector which does not depend on Reflect polyfill 9. Added [@.disabled] attribute to disable animation children in the animations 10. And so on.. Router Life Cycle Events – Angular v5 Added new router life cycle events for Guards and Resolvers 1. GuardsCheckStart, 2. GuardsCheckEnd, 3. ResolveStart and 4. ResolveEnd Angular 5 Bug Fixes - Angular v5 1. Fixed compilation error by using the correct type for providers 2. Skip PWA test when redeploying non-public commit 3. Don't strip CSS source maps. This is the compiler related fix 4. Remove tsickle (language-service) dependency 5. Support persisting dynamic styles within animation states 6. Ignore @import in multi-line css 7. Fix platform-browser-dynamic 8. Forbid destroyed views to be inserted or moved in VC 9. Support persisting dynamic styles within animation states 10. And so on... References https://angular.io/guide/security https://github.com/angular/angul... 1.5k Views · 6 Upvotes · Answer requested by Anil Singh

Paul Haris, works at Android Application Development Answered Nov 4 2017

The long wait for Google new and updated JavaScript framework, Angular is over. Finally Google came with the good news yesterday and after much speculation Angular 5 was brought to the center stage. Therefore, Google maintained its decorum of launching at least a couple of updates in a single year. So, at last the mobile app developers and web builders have something to smile and cheer for. Let’s Get Down to its Major Features of Angular 5 Material Design Elements More User Friendly The Material Design Element has been made more user friendlier with rendering on the server side. Nevertheless. There are some issues related to bug errors that Google needs to sort out before it releases its functionality. Progressive Web Apps Google has focused more on making it easier to build progressive web apps . This will allow the applications to get concealed within the browser. However, both Google as well as Mozilla have jointly worked together to add this useful feature in Angular 5. At present Google is also working on to offer support to make CLI (Command in Line) capable. Eliminating Unnecessary Codes and Small Applications Adding next improvement in the new framework, the size of the application has been decreased by the removal of unnecessary codes. The CIL tool built optimizer has helped in this regard. Improving the Complier Complier, an essential aspect of the framework for the transformation of TypeScript has been improved. It will support the incremental assembling better than before. Some Cons Related to Angular 5 There are some concerns related to Angular 5 which needs to be addressed. The first problem is related with design of the production and creation of source maps. There are a few unidentified sources having an issue and also a number of APIs including Token or Opaque are now eliminated. For more detail read this one article: Google Launches Angular 5 JavaScript Framework: Let’s Get into the Details 849 Views · 6 Upvotes

DreamToIPO, Ruby on Rails Development Specialist Updated 7d ago Originally Answered: What’s new in Angular 5?

Our favorite open-source Javascript based framework is back again. With more exciting features and promises. What are they and how they will help or affect the developers? Let’s dive deepHttpClient The Angular 5 has deprecated the previous @angular/http library. From now they are recommending HttpClient for all applications. Question is why they have done that? In earlier Angular version (4.3), they shipped HttpClient in @angular/common as a smaller, easier, and more powerful way to make web requests in Angular. Developers praised the effort which has certainly boosted them to take this new stand. Now to update to HttpClient, one will need to replace HttpModule with HttpClientModule from @angular/common/http in each of your modules, inject the HttpClient service, and remove any map(res => res.json()) calls, which are no longer needed. With the new feature, one now will be able to directly use object literals as headers or parameters, whereas we had to use the classes HttpHeaders and HttpParams. So the below code: const headers = new HttpHeaders().set(‘Authorization’, ‘secret’); const params = new HttpParams().set(‘page’, ‘1’); return this.http.get(‘/api/users’, { headers, params }); can now be simplified into: const headers = { ‘Authorization’: ‘secret’ }; const params = { ‘page’: ‘1’ }; return this.http.get(‘/api/users’, { headers, params }); Build Optimizer With this new release, Angular keeps working on making the framework smaller, faster and easier to use. Take the “Build Optimizer” as an example. From the Angular 5.0.0, production builds created with Common Line Interface (CLI) will now apply the build optimizer by default. TypeScript Transforms Under the hood, the Angular compiler now operates as a TypeScript transform. It will stimulate the incremental rebuilds dramatically. The programmers can take advantage of it by running ng serve with the AOT flag turned on. This is a major development. As per their official blog, this will become the default in a future release of the CLI. Preserve Whitespace With the new Angular 5, one can now choose whether or not to preserve whitespace coming from your components and your application. Earlier tabs, newlines and spaces in your templates have been faithfully recreated and included in your build by the compiler. One can specify this as part of each component’s decorator, where it currently defaults to true.

Or one can specify it application wide in tsconfig.json, where it also currently defaults to true.

Improved decorator support Now Angular 5 supports expression lowering in decorators for lambdas and the value of useValue, useFactory and data in object literals. It will allow the programmers to use values that can only be calculated at runtime in decorators for expressions that are lowered. New Router Lifecycle Events In Angular 5, they have added new lifecycle events to the router. It will help the developers to track the cycle of the router from the start of running guards through to completion of activation. Furthermore, these events could be used for things such as showing a spinner on a specific router outlet when a child is updating or to measure performance of guards and/or resolvers. Updates on number, date and currency pipes In Angular 5, there are new number, date, and currency pipes that increase standardization across browsers and eliminate the need for i18n polyfills. This is another major improvement. Previously in Angular, the programmers have to reply on the browser to provide number, date and currency formatting using browser i18 APIs. In this scenario, there was a need for a polyfill for most developers where the users were seeing inconsistent results across browsers. Plus, the developers don’t have a satisfied expectation there. In Angular 5, there is an update on the pipes. It will help to use their implementation, relying on the CLDR to provide extensive locale support and configurations for any locales you want to support. How to update? Please go to Angular Update Guide to undergo the process and learn about the changes. This guide will help the programmers immensely and guide you across the changes one will need to make to their application. Want to build your next application in Angular 5.0? Contact us now . Source of Image and information 165 Views · 1 Upvote

Related Questions In the difference between AngularJS and Angular 2, it says that Angular 2 is more mobile oriented. What makes Angular 2 more mobile oriented? Should I learn Angular 1.0, Angular 2.0 or React? Which is easier to learn for a new developer: AngularJS or Angular 2? What is the difference between Angular 2 and Angular 4? Should I learn Angular 2 or 4? Is Angular 5 stable? What's new in Angular 4? What is Angular JS 5? What is the difference between Angular 1, Angular 2, Angular 4 & Angular 5? What are the benefits in Angular 5? Ask New Question

Sitemap: # A B C D E F G H I J K L M N O P Q R S T U V W X Y Z

About · Careers · Privacy · Terms · Contact

Smile Life

When life gives you a hundred reasons to cry, show life that you have a thousand reasons to smile

Get in touch

© Copyright 2015 - 2024 PDFFOX.COM - All rights reserved.