The New Version of Angular 10 is the major release that spans the entire platform adding the framework, CLI, and Angular Material. The angular 10 release is smaller than typical. The latest version of angular 10 majorly focuses on the ecosystem and quality tool that introduce new features. The release witnesses a lot of deprecation and upgrades.
Angular 10 become available as a production release on June 24. Angular 10.1.0 follow up on September 2nd after the release of Angular 10. It comes with a major upgrade to the Google-developed TypeScript-based framework. It puts more emphasis on the tool, quality and ecosystem improvement than other features. Angular 10 comes with new capabilities and is smaller versions of Angular. It includes new date range picker in the angular material UI component library for CommonJS imports.
What is new in the latest version of angular 10?
New data range picker
Angular user interfaces come with a significant upgrade. The date picker comes with great addition and makes an essential difference in the new update. Every UI library comes with a date picker and uses an Angular material library that has a date range picker. Similar to the date range component that added on booking or Expedia comes with added angular material.
Now, start with using the new date range picker. Use the mat-date-range-input and mat-date-range-picker components using angular material.
Warning about CommonJS imports
To have speed and efficiency, ECMScript bundling advised using over CommonJS. The developers shouldn’t much depend on CommonJS modules. It uses ECMAScript module syntax in the entire application. The team of Angular uses a dependency that packaged with CommonJS where the app loads slower and the size is often larger.
Optional Stricter Settings
Angular version 10 offers a strict project setup that creates a new workspace with ng new.
ng new –strict
Now, you can enable the flag by initializing your new project using the unique setting shown below. When you create a new Angular project setup with a few new settings, then make your project easier to maintain. Improve maintainability to catch bugs ahead of time and give Angular CLI using some superpowers like perform advanced optimization on an angular app.
A few of the settings involves:
- Enabling strict mode for TypeScript file
- Configuring linting rules to prevent declaration type
- Turning your template type checking too strict
- Configuring your app as side-effect free to enable more advanced tree-shaking
New default browser configuration
The browser configuration for new projects updates to less used browsers. It adds the side effect of disabling ES5 that builds default for new projects. Users can add it to required browsers in the .browserslist RC file. It enables ES5 that differential loads for browsers.
The ecosystem is ever-evolving and comes with a single release of Angular. With New Version of Angular 10, it comes with the following dependencies that synchronized like:
- The TSLib version updated to TSLib version 2.0
- The TypeScript version updated to TypeScript version 3.9
- TSLint has updated to version 6.0
The layout of the project updates with a new version where there is a new tsconfig.base.json file. It supports IDEs and build tooling resolve type and package configs better than the last one.
Angular Team Update
The Angular team is working hard. The open issues on the Angular project have reduced by over a whopping 700 issues across tooling, components, and the framework. There are over 2000 issues touched and show a commitment to the project. The team keeps the stride and commit to doing more of this shortly.
In the new angular version 10, the angular package is no longer ESM5 or FESM5 bundles. The developers are almost 120 MB of downloads that install while running their favorite package manager. Consult with the Angular community, support internet 9 and 10. IE Mobile is now deprecated. Now read all the deprecations and removals here.
How to update to version 10?
One can visit update.angular.io for detailed information and guidance. Get the best update experience, and we highly recommend upgrading one major release.
To update use the below code:
Ng update @angular/cli @angular /core
Additionally, check the Why Angular is The Best Framework For Web App Development.
Ideally, the team of Angular release two versions this year. The angular 9 is the old version, and hence the team is also looking for a new Angular 11 release. The people or organizations who are looking to hire angular developers for their projects, look at our portfolio. We are reliable and trusted for our work. Our team ensures to help you have a smoother path ahead.