Angular (web framework)

Last updated
Angular
Developer(s) Google
Initial release2.0 / 14 September 2016;7 years ago (2016-09-14) [1]
Stable release
17.3.0 [2]   OOjs UI icon edit-ltr-progressive.svg / 13 March 2024;35 days ago (13 March 2024)
Preview release
17.1.0-next.0 / 15 November 2023;5 months ago (2023-11-15) [3]
Repository Angular Repository
Written in TypeScript, JavaScript
Platform Web platform
Type Web framework
License MIT License
Website angular.io
angular.dev

Angular (also referred to as "Angular 2+") [4] is a TypeScript-based, free and open-source single-page web application framework led by the Angular Team at Google and by a community of individuals and corporations. Angular is a complete rewrite from the same team that built AngularJS. Angular ecosystem consists of a diverse group of over 1.7 million developers, library authors, and content creators. [5]

Contents

Differences between Angular and AngularJS

Architecture of an Angular application, services, and dependency injection Architecture of an Angular 2 application.png
Architecture of an Angular application, services, and dependency injection

Google designed Angular as a ground-up rewrite of AngularJS.

History

Angular 2.0 was announced at the ng-Europe conference 22–23 October 2014. [8] [9] The drastic changes in the 2.0 version created considerable controversy among developers. [10] On April 30, 2015, the Angular developers announced that Angular 2 moved from Alpha to Developer Preview. [11] Angular 2 moved to Beta in December 2015, [12] and the first release candidate was published in May 2016. [13] The final version was released on 14 September 2016.

On 13 December 2016 Angular 4 was announced, skipping 3 to avoid confusion due to the misalignment of the router package's version which was already distributed as v3.3.0. [14] The final version was released on 23 March 2017. [15]

Features in version 4.3:[ citation needed ]

Angular 6 was released on 4 May 2018. [16] This is a major release focused less on the underlying framework and more on the toolchain and on making it easier to move quickly with Angular in the future, like ng update, ng add, Angular Elements, Angular Material + CDK Components, Angular Material Starter Components, CLI Workspaces, Library Support, Tree Shakable Providers, Animations Performance Improvements, and RxJS v6.

On 18 October 2018, Angular 7 was released. This version had updates regarding Application Performance, Angular Material & CDK, Virtual Scrolling, Improved Accessibility of Selects, now supports Content Projection using web standard for custom elements, and dependency updates regarding Typescript 3.1, RxJS 6.3, Node 10 (still supporting Node 8). [17]

Angular 8 was released on 28 May 2019. Featuring Differential loading for all application code, Dynamic imports for lazy routes, Web workers, TypeScript 3.4 support, and Angular Ivy as an opt-in preview. Angular Ivy opt-in preview includes: [18]

Angular one color inverse logo.svg
Logo from 2016 to 2023 (v2-v16)
Angular icon.svg
Current logo (v17)

Angular 17 was released on November 8, 2023. Some new features include the new Application builder, a new syntax for control flow, a reworked learning and documentation website, and more. [19]

Naming

The rewrite of AngularJS was called "Angular 2", but this led to confusion among developers. To clarify, the Team announced that separate names should be used for each framework with "AngularJS" referring to the 1.X versions and "Angular" without the "JS" referring to versions 2 and up. [20]

Version History

VersionRelease dateNew featuresNotes
Angular 17November 8, 2023 [19] Application builder, a new syntax for control flow, and a re-worked learning and documentation website. [19]
Angular 163 May 2023Partial hydration for Angular Universal's Server-side rendering, experimental Jest support, and Esbuild-based build system for development servers.
Angular 15November 18, 2022
Angular 142 June 2022Typed forms, standalone components, and new primitives in the Angular CDK (component dev kit).
Angular 134 November 2021 [21]
Angular 1212 May 2021 [22] Deprecated support for Internet Explorer 11.
Angular 1111 November 2020 [23]
Angular 1024 June 2020 [24] New Date Range Picker (Material UI library).
Angular 96 February 2020Improved build times, enabling AOT on by default
Angular 828 May 2019Differential loading for all application code, Dynamic imports for lazy routes, Web workers, TypeScript 3.4 support, and Angular Ivy as an opt-in preview. [18]
Angular 718 October 2018Updates regarding Application Performance, Angular Material & CDK, Virtual Scrolling, Improved Accessibility of Selects. Support for Content Projection using web standard for custom elements, and dependency updates regarding Typescript 3.1, RxJS 6.3 and Node 10. [17]
Angular 64 May 2018 [16]
Angular 51 November 2017 [25] Support for progressive web apps, a build optimizer and improvements related to Material Design. [26]
Angular 4.3New router life cycle events for Guards and Resolvers.Minor release, meaning that it contains no breaking changes and that it is a drop-in replacement for Angular 4.x.x.
Angular 423 March 2017 [15] Backward compatible with Angular 2.
Angular 214 September 2016

Future releases

Since v9, the Angular team has moved all new applications to use the Ivy compiler and runtime. They will be working on Ivy to improve output bundle sizes and development speeds. [27]

Each version is expected to be backward-compatible with the prior release. The Angular development team has pledged to do twice-a-year upgrades.

Support policy and schedule

All the major releases are supported for 18 months. This consists of 6 months of active support, during which regularly-scheduled updates and patches are released. It is then followed by 12 months of long-term support (LTS), during which only critical fixes and security patches are released. [28]

Supported Angular Versions
VersionStatusReleasedActive EndsLTS EndsDuration
^17.0.0ActiveNov 08, 2023May 8, 2024May 15, 20251.5 years
^16.0.0LTSMay 3, 2023Nov 08, 2023Nov 08, 20241.5 years
^15.0.0LTSNov 18, 2022May 3, 2023May 18, 20241.5 years

Angular versions v2 to v14 are no longer under support. [29]

Pros Of Angular

Comprehensive Framework: Offers a full suite of tools for development, from project setup to testing.

Two-Way Data Binding: Simplifies the synchronization between the UI and the data model.

TypeScript Support: Enhances code quality and maintainability with strong typing.

Modularity and Dependency Injection: Facilitates better code organization and reuse.

Robust Ecosystem: Backed by Google, with extensive libraries and community support.

Cons of Angular

Steep Learning Curve: Complexity and TypeScript requirement can be challenging for beginners. Verbose and Complex Syntax: Can lead to longer development time for those unfamiliar.

Performance Issues: For very complex applications, performance might lag behind lighter frameworks. Frequent Updates: Rapid evolution of the framework can make it hard to keep projects updated.

Initial Load Time: The size of Angular applications can lead to slower initial load times. [30]

Libraries

Angular Material

Angular Material is a UI component library that implements Material Design in Angular. [31]

Angular Elements

In 2018, Angular 6 introduced Angular Elements that lets you package your Angular components as custom web elements, which are part of the web components set of web platform APIs. [32]

See also

Related Research Articles

Web development is the work involved in developing a website for the Internet or an intranet. Web development can range from developing a simple single static page of plain text to complex web applications, electronic businesses, and social network services. A more comprehensive list of tasks to which Web development commonly refers, may include Web engineering, Web design, Web content development, client liaison, client-side/server-side scripting, Web server and network security configuration, and e-commerce development.

<span class="mw-page-title-main">Apache Flex</span> Software development kit (SDK) for the development and deployment of rich web applications

Apache Flex, formerly Adobe Flex, is a software development kit (SDK) for the development and deployment of cross-platform rich web applications based on the Adobe Flash platform. Initially developed by Macromedia and then acquired by Adobe Systems, Adobe donated Flex to the Apache Software Foundation in 2011 and it was promoted to a top-level project in December 2012.

In computing, a solution stack or software stack is a set of software subsystems or components needed to create a complete platform such that no additional software is needed to support applications. Applications are said to "run on" or "run on top of" the resulting platform.

<span class="mw-page-title-main">Dojo Toolkit</span> Open-source modular JavaScript library

Dojo Toolkit is an open-source modular JavaScript library designed to ease the rapid development of cross-platform, JavaScript/Ajax-based applications and web sites. It was started by Alex Russell, Dylan Schiemann, David Schontzler, and others in 2004 and is dual-licensed under the modified BSD license or the Academic Free License.

<span class="mw-page-title-main">Google Web Toolkit</span> Free Java library

Google Web Toolkit, or GWT Web Toolkit, is an open-source set of tools that allows web developers to create and maintain JavaScript front-end applications in Java. It is licensed under Apache License 2.0.

TypeScript is a free and open-source high-level programming language developed by Microsoft that adds static typing with optional type annotations to JavaScript. It is designed for the development of large applications and transpiles to JavaScript. Because TypeScript is a superset of JavaScript, all JavaScript programs are syntactically valid TypeScript, but they can fail to type-check for safety reasons.

<span class="mw-page-title-main">Ext JS</span> JavaScript application framework

Ext JS is a JavaScript application framework for building interactive cross-platform web applications using techniques such as Ajax, DHTML and DOM scripting. It can be used as a simple component framework but also as a full framework for building single-page applications (SPAs).

Titanium SDK is an open-source framework that allows the creation of native mobile applications on platforms iOS and Android from a single JavaScript codebase. It is presently developed by non-profit software foundation TiDev, Inc.

<span class="mw-page-title-main">Node.js</span> JavaScript runtime environment

Node.js is a cross-platform, open-source JavaScript runtime environment that can run on Windows, Linux, Unix, macOS, and more. Node.js runs on the V8 JavaScript engine, and executes JavaScript code outside a web browser.

A browser speed test is a computer benchmark that scores the performance of a web browser, by measuring the browser's efficiency in completing a predefined list of tasks. In general the testing software is available online, located on a website, where different algorithms are loaded and performed in the browser client. Typical test tasks are rendering and animation, DOM transformations, string operations, mathematical calculations, sorting algorithms, graphic performance tests and memory instructions. Browser speed tests have been used during browser wars to prove superiority of specific web browsers. The popular Acid3 test is no particular speed test but checks browser conformity to web standards.

Content Security Policy (CSP) is a computer security standard introduced to prevent cross-site scripting (XSS), clickjacking and other code injection attacks resulting from execution of malicious content in the trusted web page context. It is a Candidate Recommendation of the W3C working group on Web Application Security, widely supported by modern web browsers. CSP provides a standard method for website owners to declare approved origins of content that browsers should be allowed to load on that website—covered types are JavaScript, CSS, HTML frames, web workers, fonts, images, embeddable objects such as Java applets, ActiveX, audio and video files, and other HTML5 features.

AngularJS is a discontinued free and open-source JavaScript-based web framework for developing single-page applications. It was maintained mainly by Google and a community of individuals and corporations. It aimed to simplify both the development and the testing of such applications by providing a framework for client-side model–view–controller (MVC) and model–view–viewmodel (MVVM) architectures, along with components commonly used in web applications and progressive web applications.

Yeoman is an open source client-side scaffolding tool for web applications. Yeoman runs as a command-line interface written for Node.js and combines several functions into one place, such as generating a starter template, managing dependencies, running unit tests, providing a local development server, and optimizing production code for deployment.

<span class="mw-page-title-main">Ember.js</span>

Ember.js is an open-source JavaScript web framework that utilizes a component-service pattern. It is designed with the aim of allowing developers to create scalable single-page web applications by incorporating common idioms, best practices, and patterns from other single-page-app ecosystem patterns into the framework.

<span class="mw-page-title-main">MEAN (solution stack)</span> JavaScript software stack

MEAN is a source-available JavaScript software stack for building dynamic web sites and web applications. A variation known as MERN replaces Angular with React.js front-end, and another named MEVN use Vue.js as front-end.

Web Components are a set of features that provide a standard component model for the web allowing for encapsulation and interoperability of individual HTML elements. Web Components are popular approach to build microfrontends.

<span class="mw-page-title-main">React (JavaScript library)</span> JavaScript library for building user interfaces

React is a free and open-source front-end JavaScript library for building user interfaces based on components. It is maintained by Meta and a community of individual developers and companies.

<span class="mw-page-title-main">Ionic (mobile app framework)</span> Open-source framework to develop hybrid mobile apps

Ionic is an open-source UI toolkit for building cross-platform mobile, web, and desktop applications using web technologies such as HTML, CSS, and JavaScript/TypeScript. It provides a set of pre-designed UI components and tools for building high-quality, interactive applications. Ionic was originally built as a complete open-source SDK for hybrid mobile app development created by Max Lynch, Ben Sperry, and Adam Bradley of Drifty Co. in 2013. The original version was released in 2013 and built on top of AngularJS and Apache Cordova. However, the latest release was re-built as a set of Web Components using StencilJS, allowing the user to choose any user interface framework, such as Angular, React or Vue.js. It also allows the use of Ionic components with no user interface framework at all. Ionic provides tools and services for developing hybrid mobile, desktop, and progressive web apps based on modern web development technologies and practices, using Web technologies like CSS, HTML5, and Sass. In particular, mobile apps can be built with these Web technologies and then distributed through native app stores to be installed on devices by utilizing Cordova or Capacitor.

NativeScript is an open-source framework to develop mobile apps on the iOS and Android platforms. It was originally conceived and developed by Progress. At the end of 2019 responsibility for the NativeScript project was taken over by long-time Progress partner, nStudio. In December 2020 nStudio also oversaw the induction of NativeScript into OpenJS Foundation as an Incubating Project. NativeScript apps are built using JavaScript, or by using any programming language that transpiles to JavaScript, such as TypeScript. NativeScript supports the Angular and Vue JavaScript frameworks. Mobile applications built with NativeScript result in fully native apps, which use the same APIs as if they were developed in Xcode or Android Studio. Additionally, software developers can re-purpose third-party libraries from CocoaPods, Maven, and npm.js in their mobile applications without the need for wrappers.

<span class="mw-page-title-main">Vue.js</span> Open-source JavaScript library for building user interfaces

Vue.js is an open-source model–view–viewmodel front end JavaScript library for building user interfaces and single-page applications. It was created by Evan You, and is maintained by him and the rest of the active core team members.

References

  1. ↑ "Angular, version 2: proprioception-reinforcement". blogspot.com. September 14, 2016. Archived from the original on 2017-03-12. Retrieved 2017-03-18.
  2. ↑ "Release 17.3.0". 13 March 2024. Retrieved 19 March 2024.
  3. ↑ "angular/CHANGELOG.md". GitHub . Retrieved 2023-11-15.
  4. ↑ "AngularJS and Angular 2+: a Detailed Comparison". 6 April 2018.
  5. ↑ "Angular". angular.io. Retrieved 2024-03-26.
  6. ↑ "Angular Docs". angular.io.
  7. ↑ "What's the difference between AngularJS and Angular?". gorrion.io. September 19, 2017. Retrieved 2018-01-28.
  8. ↑ Hamilton, Coman (28 October 2014). "A sneak peek at the radically new Angular 2.0" . Retrieved 2015-10-21.
  9. ↑ "Ng-Europe schedule". Archived from the original on 2018-04-30. Retrieved 2018-04-29.
  10. ↑ Hamilton, Coman (29 October 2014). "Angular 2.0 announcement backfires" . Retrieved 2015-10-21.
  11. ↑ @angularjs (April 30, 2015). "Angular 2 moves from Alpha to Developer Preview! Dev guide and API docs now available at ... angular.io/docs/js/latest" (Tweet). Retrieved 2015-10-21– via Twitter.
  12. ↑ "Angular: Angular 2 Beta". angularjs.blogspot.it. Archived from the original on 2015-12-18. Retrieved 2016-07-13.
  13. ↑ "angular/angular". GitHub. Retrieved 2016-05-04.
  14. ↑ "Ok... let me explain: it's going to be Angular 4.0". angularjs.blogspot.kr. Archived from the original on 2017-10-16. Retrieved 2016-12-14.
  15. 1 2 "Angular 4.0.0 Now Available". angularjs.blogspot.ca. Archived from the original on 2018-01-08. Retrieved 2017-03-23.
  16. 1 2 "Version 6.0.0 of Angular Now Available" . Retrieved 4 May 2018.
  17. 1 2 Fluin, Stephen (2018-10-18). "Version 7 of Angular — CLI Prompts, Virtual Scroll, Drag and Drop and more". Angular Blog. Retrieved 2019-06-07.
  18. 1 2 Fluin, Stephen (2019-02-08). "A plan for version 8.0 and Ivy". Angular Blog. Retrieved 2019-06-07.
  19. 1 2 3 Gechev, Minko (8 November 2023). "Introducing Angular v17". Medium. Angular Blog. Retrieved 12 November 2023.
  20. ↑ "Angular: Branding Guidelines for AngularJS". Archived from the original on 2017-02-04. Retrieved 2017-03-04.
  21. ↑ Thompson, Mark (4 November 2021). "Angular v13 is now Available". Angular Blog. Retrieved 10 January 2022.
  22. ↑ Thompson, Mark (2021-05-12). "Angular v12 is now available". Medium. Retrieved 2021-05-17.
  23. ↑ "Version 11 of Angular Now Available". 4 December 2020.
  24. ↑ "Version 10 of Angular Now Available". 25 June 2020.
  25. ↑ Fluin, Stephen. "Version 5.0.0 of Angular Now Available" . Retrieved 2 November 2017.
  26. ↑ "Angular 5 JavaScript framework delayed". 18 September 2017.
  27. ↑ Fluin, Stephen (6 February 2020). "Version 9 of Angular Now Available — Project Ivy has arrived!". blog.angular.io. Retrieved 22 March 2022.
  28. ↑ "Angular". angular.io. Retrieved 2019-06-07.
  29. ↑ "Angular". angular.io. Retrieved 2022-06-10.
  30. ↑ "Best Front End Frameworks for Web Development". Mar 29, 2024.
  31. ↑ "Angular Material". material.angular.io.
  32. ↑ "How to create Angular 6 Custom Elements and Web Components". 29 September 2018.
This page is based on this Wikipedia article
Text is available under the CC BY-SA 4.0 license; additional terms may apply.
Images, videos and audio are available under their respective licenses.