What’s New in Angular 8.0: Ivy Renderer & Other Functionalities

Page 1

What’s New in Angular 8.0 Ivy Renderer & Other Functionalities


Introduction Angular is one of the most popular open-source web app frameworks used by developers around the globe. When Google released Angular in 2016, developers flocked to migrate the framework. Today, a large number of users use Angular.

www.techtic.com | info@techtic.com


www.techtic.com | info@techtic.com


Ivy: Next-gen Renderer for Angular Framework A sneak-peak into the future of Angular and introduction of Ivy rendering pipeline was offered at Google I/O 2018. The Angular team provided heads up about how they are planning to revamp the Angular renderer into something that would make apps smaller, faster and simpler. All this, without needing developers to update anything at their end- Ivy is backward compatible. The Ivy initiative is bringing new-age advancement to the process that translates Angular templates into browser renders. Ivy is supposed to reduce the size of bundles needing developers to pay for the code that they are actually using. On top of it, Ivy will enhance the performance by making it possible for apps to load quickly on slow connections. www.techtic.com | info@techtic.com


Ivy: Next-gen Renderer for Angular Framework Also, the apps would transform into something that is simpler to understand and debug even as they scale and grow over time. Fundamentally, three aspects are focused under the Ivy rollout:

• Reduction in bundle sizes • Fast app loading on slow connections • Quick debugging and simpler interface Tree shaking is a build-optimization technique that ensures that the unusable code isn’t packaged into the final bundle.

www.techtic.com | info@techtic.com


Ivy also supports the locality principle that enables: • Shipment of pre-compiled code • Compilation without the need of Metadata.json

• Metaprogramming

www.techtic.com | info@techtic.com


Promising Initial Outcomes of Ivy Package Size

For a standard Hello World app, Ivy was able to compress the bundle size to just 2.7 KBs. When compared to present Angular version, which makes a 36 KB-bundle, Ivy promises 93% reduction in bundle size.

www.techtic.com | info@techtic.com


Promising Initial Outcomes of Ivy Speed Along with small bundle size, Ivy also scored well on speed aspects. For the purpose of demo, a Hello World app was tested through webpagetest.org to simulate a mobile device with a slow 3G connection. The baseline was set to 1.5 seconds and code rendered on Ivy turned up in 2.2 seconds. The current version of Angular came up with the output in 4 seconds- this is a straight improvement of 45%. www.techtic.com | info@techtic.com


Promising Initial Outcomes of Ivy Simplicity in Coding Ivy is designed to make the coding experience simpler. Code rendered with Ivy is easier to read making the debug process faster, simpler and better. To illustrate, give a look on the same code snippet, one on current Angular version and another on Ivy.

www.techtic.com | info@techtic.com


What’s More in Version 8.0? While the excitement related to Ivy is hitting the ceiling, there is a lot more to Angular 8.0 apart from the Ivy initiative. Here are some of the anticipated functionalities and features in Angular 8.0:

> Differential Modern JavaScript Loading A huge innovation will be seen rolling out that would differentially load legacy (ES5) & modern (ES2015+) JavaScript bundles on client-side. This would enhance loading speed and TTI (Time to Interactive) for modern browsers.

> Angular Router Backward Compatibility It would be easier for teams to upgrade large projects to the new version by lazy loading parts of the AngularJS apps using $route APIs.

www.techtic.com | info@techtic.com


> Enhanced Web Worker Bundling Web workers improve the speed of the app while enhancing parallelizability. Angular 8.0 will see support for web workers, a general request from developers that the platform is finally addressing in 8.0.

> Opt-in Usage Sharing The Angular Command Line Interface (CLI) will come with opt-in telemetry that would ask developers to share anonymous information about commands used, build speed, etc. with the Angular Team. This would be helpful for future development and improvements.

> Dependency Updates All the dependencies on third-party tools like Node, RxJS, TypeScript, etc. will be updated for streamlined and seamless development experience.

Read More www.techtic.com | info@techtic.com


Why Choose AngularJS Web Application Development If you are looking to build an enterprise website or hybrid mobile application that is superbly functional and robust, yet easy to use, you can bet on Angular JS services. Techtic Solutions as one of the most reliable web development companies strongly recommend Angular web development as it is affable with the growing trends of interactive web designs and application. Besides that, it gives you more control over your website, but with utmost flexibility. Our team of expert Angular developers can help you build the most interactive, scalable, data-driven and well-structured web and mobile apps for your business.

www.techtic.com | info@techtic.com


Contact Us Visit us: https://www.techtic.com Email: info@techtic.com Phone: +1 201.793.8324


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.