 Hi, and welcome to Google I.O. We hope that you are enjoying the show so far. I'm Mark from the Angular team, and my colleague M&I are here to tell you all about the state of Angular. Angular is a framework designed to support developers as they build scalable web applications, whether it's scaling your product as user demand increases or scaling your teams to meet the growing technical needs. Angular has been there and will continue to be there for you and your teams. Our team has been hard at work delivering great features to support developers all over the world building scalable performance applications. Recently, we've completed some major projects that we're very proud of. I can't wait to share more, so let's get started. We rewrote from the ground up Angular's runtime and compiler. Apps are now powered by the better, more efficient IV rendering engine. IV offers numerous advantages. There's improved type checking and error reporting, better debugging, smaller bundle sizes, and so much more. Let's dive into some of the enhancements made possible by IV. We wanted to give developers even better integrated tooling when authoring Angular code. So we introduced the IV-powered Angular Language Service plugin for VS Code. It boosts developer productivity by providing type checking, syntax highlighting, and error reporting while you're writing code. This level of integration was only made possible by the IV compiler. And with more than 3.1 million installs, we think that it's safe to say that, well, developers are enjoying it. IV also enabled us to build the Angular DevTools browser extension, giving developers more detailed insights into an Angular app at runtime than ever before. Now, developers can get data for individual change detection cycles. This provides the type of information required to build and maintain performance production applications. While Angular DevTools is already in a great position, we think that we can do more. Thus, the team is working on adding Firefox support and debugging dependency injection. Along with better tooling, IV also makes Angular faster and more efficient. Let me explain. When IV became the only Angular compiler at Google, we saw internal applications reduce resource usage by 90% during build times. Angular apps also saw a reduction of 30% in bundle size. One of our top goals is to provide an evergreen solution. And this was true for IV as well. To accomplish this, we migrated the entire ecosystem with automated migrations to ensure that we didn't leave any teams or their products behind. This was a challenge that at times felt like we were changing the engine of a car while it was still running. Now that IV has landed, we can continue to build the future of Angular. Speaking of which, let's talk about where Angular is going next. Here on the Angular team, we've heard lots of feedback from the community, and we've been in deep discussions about what's next for Angular. We believe that in order to serve the most developers, we have to create a simpler, more frictionless Angular for existing developers and those new to the framework. We have a pretty good idea where to start and we think that you're really going to like this change. Meet standalone components, a new, simpler way to build components in Angular. Building components is a core part of the Angular developer experience. Right now, building components requires extra configuration. You have to create the component and then ensure that it's imported in the correct NG module. This means that developers have to understand multiple concepts before building an application. We want to improve this part of the developer experience. Standalone components are designed to simplify application building and streamline the steps to getting started. Let's take a moment to investigate the new API. In the component typescript class, we import the dependencies we need for our component, for example, other components, modules, and pipes. Next, we add the standalone property to the component metadata. This allows us to bootstrap our component without an NG module. We then update the imports property of the component metadata to reference our dependencies. Now, our component is ready to be used in our application. We're working hard to polish this new API to ensure that it can integrate seamlessly with your existing code in a backwards-compatible way. There's more to the simpler Angular story. We're also creating an all-new, modern, getting started journey for developers new to the framework. This new guided path in the documentation will include the most important Angular concepts needed for developers to start building new, exciting applications. We're so thrilled about what's to come and we can't wait for everyone to try it out. We're not stopping there with updates to the documentation. We're making other changes to the documentation that will help ensure that the content is a resource to light a path forward for your Angular journey. We're revamping guides, API references, examples, and more. Angular is an opinionated framework with best practices built in by default. We've been proudly serving developer communities with this focus for some time now. Conformance is all about building in strong defaults and best practices to help developers build wonderful, performant applications. This next initiative fits right in line with those strong defaults. We're actively building support for typed forms in Angular templates. This is the number one most requested feature and we're close to making it a reality. Developers will be able to build complex, even nested forms in a safe, backwards compatible method which supports the incremental migration of your applications. What's more is that this feature leverages type checking as a best practice. We want to make sure that the adoption of this new feature is smooth for everyone. So we're testing it on Google's 2,500 plus projects. Let's check out some example code to find out more. Type forms allow form groups to throw compile time errors based on common problems like undefined properties. In this example, the CAD form group doesn't have a defined property called email. Now developers can find this error while writing code and not during runtime where users may come across this error causing unexpected behavior. We think this is a better experience for everyone involved, developers, and users alike. There are more types of errors that we can surface with typed forms. We can count on type checking for existing properties of a form group as well. The live's property is a number but the code attempts to call the substring method which is invalid for form types. Again, the best time to find a problem like this is during compile time. Paired with the TypeScript language service, developers will be treated to error highlighting to help quickly identify the problem. Just as we've seen type forms highlight potential problems with undefined properties and with type checking, we can also expect it to catch errors with missing properties. This example demonstrates the issues that arise when a value of a form group is attempted to be set with an object literal that's missing properties defined in the form group's creation. One of Angular's core strengths is its ability to scale your development, your teams, and your applications. Just imagine how your experience with Angular will improve as these features and more land in the future. But this is only a small preview of what's to come. Emma is going to share even more about Angular and Angular Future with you right now. Emma, you're up. Thanks, Mark. You're right. One of Angular's strengths is its ability to scale. I'm Emma from the Angular team. Let's talk about scaling Angular for applications of all sizes. For new developers, we focus on a simpler Angular. As a solo developer, we want to take care of the hard stuff to support you in quickly building your vision. The Angular command line interface, or CLI, makes getting started as easy as typing ng new. Create new components quickly and make use of simplified standalone components or single component Angular modules to build fast. You provide the idea and we'll provide native solutions for all the things you don't have time to think about, like routing and forms. I MissMyCafe.com relies on provided Angular material components and built-in accessibility to go viral and provide a virtual cafe experience for over 1.7 million lifetime users. For startups and small teams, Angular establishes best practices. The Angular language service, a built-in code editor tool, ensures that developers write consistent code. Strong typing and tooling allows developers to catch errors prior to deployment. As your project starts to scale, we provide out-of-the-box solutions for common functionality like internationalization and progressive web apps to reach a more global audience. Coffee table talks uses Angular's built-in best practices and internationalization to grow with their podcast fan base. Angular is opinionated, which means all apps follow a familiar pattern and ecosystem. One of the things I love to hear is I can open a project and know exactly what I'm looking at. As projects scale, we understand that debugging becomes trickier. Angular DevTools supports debugging and profiling performance to keep your app's lifecycle running smoothly. And don't forget, every PR we merge into Angular is tested against all of Google's monorepository first, ensuring that we deliver backwards compatible features and migration schematics tested against many edge cases. As your team grows, Angular makes it easy to onboard new developers. ClickUp uses Angular to scale quickly and confidently for over 800,000 teams and millions of users worldwide. Angular helped this series C company with a $4 billion valuation meet the global demand for their scalable productivity platform that flexes to the way people want to work. As your users scale, the framework scales with the increasing complexity of your application. We are invested in research and development guides for monorepositories and micro-frontends as we partner with large-scale businesses to support their growing teams. How can build stay fast even as the team grows? And what does improved team autonomy look like? At this point, we're still discussing, but we're happy to be having these conversations and look forward to sharing what we learn from them. Firebase uses Angular at scale with over 1.4 million lines of code, all while upholding high-code quality with linting and testing, while keeping build times low. No matter the size of your application, we want to provide a path to the latest version of Angular. The Angular CLI's ngUpdate command unlocks all that the newest Angular has to offer. Let's take a look at how we prioritize the application updating journey and backward compatibility of Angular. Many new features are no op as they come out of the box to all projects that update, or their small developer experience-driven featureettes. Our goal is to deliver these changes with a minimal transition cost. Update.angular.io maintains a record of our recommendations for how to move your app forward with clear bite-size steps. So what featureettes are on the horizon? We release features as they're ready, which means something as revolutionary like standalone components can be in a minor so long as it meets our rigorous testing and breaking change requirements. Angular wants to enable developers to build for everyone. In addition to our set of accessibility tools we offer together with static checks and the component development kit, Angular's newest version will introduce streamlined management of your app's page title. This built-in router feature allows developers to define unique page titles, more simply, tackling a common accessibility issue in web frameworks. Extended diagnostics allow code editors to warn developers of common mistakes before you deploy to production. This provides an extendable framework for continuing improvements in developer productivity. Catch when knowledge coalescing is applied to non-knowlable values and find when a template has a banana in a box error, all within your code editor. In addition to the latest RxJS, TypeScript, and ES2020, Angular's newest version introduces standardized arguments parsing to ensure the Angular CLI is consistent and provides better output. This also introduces two new commands, NG Analytics, a better way to control and print analytics settings, and NG Cache, a way to control and print cache information directly from the command line. In addition to these feature ads, we're continuing to partner on innovation and exploration of the web. The team has had the wonderful opportunity to partner with Chrome's Project Aurora to help Angular improve user-centric web performance metrics. As a result of this partnership, Angular saw a 110% improvement in their core web vital score. This means faster page loads and a better user experience for end users for all Angular applications. Currently, Angular implements destructive hydration. The second part of this year will spend time investigating hydration. Our focus is on further improving the user experience and performance of all applications and utilizing hydration to further innovate in that space. We're committed to moving the framework forward while providing a backwards compatible experience. We'll keep the community posted on our updates, so make sure you follow us on social media and keep an eye on our open requests for comments. Finally, Better Together is our latest partnership to provide a more complete development experience for Angular applications with the power and resources of Google Cloud, Firebase, TensorFlow, and Bazel. Interested in what else we're working on? Our public roadmap means you have a direct vision into our prioritization. Requests for comment and GitHub discussion are also a great resource for checking the status of current projects. Excited about everything we just covered? Us too. There's never been a better time to be an Angular developer and we're excited about moving the web forward together. Make sure to follow us on Twitter and YouTube and head to angular.io to learn more about joining the party. Thank you.