Overview of AngularConnect 2019. Part 1
On September 19 and 20, my colleagues and I attended the AngularConnect conference. This is one of the major Angular-conferences, this year it was held for the fifth time. The program had 30 reports, of which 8 were from the Angular team, 4 workshops and 5 expert zones. For the sake of this, it was worth going to London (well, well, it is always worth a trip to London).
In this article, we will explain why we chose AngularConnect, what topics were interesting to us, and help you decide on viewing reports on the first day of the conference.
The first thing we noticed when deciding whether to go or not was, of course, the program. 8 reports from the Angular team, known to many Angular developers John Papa, author of the Angular in Depth Max Koretskiy blog and many other famous speakers are a truly stellar cast.
But the matter is not only in big names. The stated topics looked extremely relevant to our work tasks.
We expected a lot from deep-dive reports - Performance optimizations in Angular from Google engineer Mert Değirmenci and Profiling Angular apps like a shark about debugging performance and memory issues. Everything related to performance is important to us, because we make complex interactive applications.
The Migrating breaking changes with TSLint and Schematics report also seemed like an accurate hit. We have an internal UI Kit library, during the development of which we have often encountered a negative when we made breaking changes. We came to the need for automatic migrations, so it was interesting to find out how others do it.
We use NgRx and monitor its best practices. Therefore, we were interested in another deep-dive report - Quantum Facades: Why NgRx Facades are terrible or awesome depending on how you observe them . We wanted to listen to the conclusions of Sam Julien and compare them with ours.
And there were many such intersections!
The first day of the conference was opened by Stephen Fluin and Igor Minar.
Stephen thanked the community for their support and talked about increasing Google's number of Angular projects from 600 in 2018 to 1,500 in 2019.
Igor said that in Angular CLI 8.3 simplified the assembly for ES 5 - this allowed to reduce the time spent by 40%. He also talked about optimization in Angular 9: the weight of artifacts will decrease, applications will start working faster. This will be possible due to the new Ivy render. In the ninth version of the framework, libraries will come with ViewEngine support. And from the tenth version - with Ivy. Check the compatibility of the library by the link .
Alex Rickabaugh, the developer of Angular Compiler, talks about the five steps of compiling an Angular module into JavaScript code. He uses an example to analyze the compilation model: what it was and what will become in Ivy. NgModule scopes, partial code execution, and improved type checking in templates are the main advantages of Ivy, according to Alex.
The report will be useful to those who want to understand in detail the features of the compiler and understand what stages its work consists of.
Philippe De Ryck recalls the OWASP 10 vulnerability rating, but dwells on only three of them in detail: XSS, Broken Auth, and the use of dependencies with vulnerabilities.
We recommend this report as an introduction to OWASP 10.
Manu Murthy joined the Angular team in October 2017. In his report, he talks about three key points during this time: changing focus on the community, improving processes within the team, and current challenges. At the end of the report, he talks about the intern projects of 2019: Caretaker, Scaled searching in code and Connecting Ecosystem.
Two years of the Angular team flew for us in half an hour. They didn’t get bored. If you want to know the framework from the inside, you will like the report.
During the development of Ivy, the team focused on performance.
Most of the talk by Miško Hevery talks about optimizing js scripts with the V8 engine. On the example of benchmarks, he shows the execution time of monomorphic and polymorphic functions.
Miško notes useful programs for working with V8 profiling. At the end of the report, he presents the data structures in Ivy and announces ngDevMode - a mode for visual debugging of your application in the browser console.
Most of the report parses low-level browser optimizations. Suitable for developers who want to optimize their applications as much as possible.
Elana Olson talks about the Angular ecosystem: how to create a project, how to style it with Angular Material, how to add services and why they are needed. In conclusion, Elana Olson explains how you can help the Angular community and add your project to the ecosystem.
The report justifies the level of Starter. Suitable for new developers who have recently completed the Tour of Heroes.
Max Koretskyi addresses three levels of optimization: code execution time, use of data structures, and compiler operation.
Gil Fink begins with a story about the rendering process in the browser, its stages, the difference between reflow and repaint, RAIL model. Then Gil proceeds to profiling and shows with examples how to find problem areas using the Performance tab in Chrome.
The report is suitable for familiarization with the process of profiling applications. There are no ties to Angular, you can recommend friends to frontendders of any specialization.
Nrwl's Brandon Roberts talks about Angular Schematics features. They can be useful for automating routine tasks: establish dependencies when adding a package, perform additional operations during updating. And with the help of schematics, you can add code templates and facilitate the creation of standard entities. For example, Brandon shows how to add a template for an API service.
The report begins with the basics and is suitable for exploring technology.
The sketch report closed the first day program. Ahead of us was Angular-el, informal communication, walks around London ... And the second day of the conference, which we will discuss in a separate article.
Impressions from the first half of the conference remained mixed. On the one hand, some of the reports were really deep, real deep-dive with first-hand content, often from the creators of Angular themselves. On the other hand, there were reports, the level of which we rated below the stated level. But the value of the conference is not only in the reports - we will return to this issue in the second part.
In this article, we will explain why we chose AngularConnect, what topics were interesting to us, and help you decide on viewing reports on the first day of the conference.
Program
The first thing we noticed when deciding whether to go or not was, of course, the program. 8 reports from the Angular team, known to many Angular developers John Papa, author of the Angular in Depth Max Koretskiy blog and many other famous speakers are a truly stellar cast.
But the matter is not only in big names. The stated topics looked extremely relevant to our work tasks.
We expected a lot from deep-dive reports - Performance optimizations in Angular from Google engineer Mert Değirmenci and Profiling Angular apps like a shark about debugging performance and memory issues. Everything related to performance is important to us, because we make complex interactive applications.
The Migrating breaking changes with TSLint and Schematics report also seemed like an accurate hit. We have an internal UI Kit library, during the development of which we have often encountered a negative when we made breaking changes. We came to the need for automatic migrations, so it was interesting to find out how others do it.
We use NgRx and monitor its best practices. Therefore, we were interested in another deep-dive report - Quantum Facades: Why NgRx Facades are terrible or awesome depending on how you observe them . We wanted to listen to the conclusions of Sam Julien and compare them with ours.
And there were many such intersections!
Reports
The first day of the conference was opened by Stephen Fluin and Igor Minar.
Stephen thanked the community for their support and talked about increasing Google's number of Angular projects from 600 in 2018 to 1,500 in 2019.
Igor said that in Angular CLI 8.3 simplified the assembly for ES 5 - this allowed to reduce the time spent by 40%. He also talked about optimization in Angular 9: the weight of artifacts will decrease, applications will start working faster. This will be possible due to the new Ivy render. In the ninth version of the framework, libraries will come with ViewEngine support. And from the tenth version - with Ivy. Check the compatibility of the library by the link .
Deep dive into the angular compiler
Alex Rickabaugh, the developer of Angular Compiler, talks about the five steps of compiling an Angular module into JavaScript code. He uses an example to analyze the compilation model: what it was and what will become in Ivy. NgModule scopes, partial code execution, and improved type checking in templates are the main advantages of Ivy, according to Alex.
The report will be useful to those who want to understand in detail the features of the compiler and understand what stages its work consists of.
Angular and the OWASP top 10
Philippe De Ryck recalls the OWASP 10 vulnerability rating, but dwells on only three of them in detail: XSS, Broken Auth, and the use of dependencies with vulnerabilities.
- Follow the angular way - the key to the absence of XSS.
- OAuth 2.0 and the library will help avoid authorization problems.
- A project created with ng new has 20 thousand installed files that the developer does not control. Attackers use this: the npm package electron-notify-native was added to the popular repository. After some time, we changed the code. A popular repository gets vulnerability when updating dependencies.
We recommend this report as an introduction to OWASP 10.
My journey on the angular team
Manu Murthy joined the Angular team in October 2017. In his report, he talks about three key points during this time: changing focus on the community, improving processes within the team, and current challenges. At the end of the report, he talks about the intern projects of 2019: Caretaker, Scaled searching in code and Connecting Ecosystem.
Two years of the Angular team flew for us in half an hour. They didn’t get bored. If you want to know the framework from the inside, you will like the report.
How we make angular fast
During the development of Ivy, the team focused on performance.
Most of the talk by Miško Hevery talks about optimizing js scripts with the V8 engine. On the example of benchmarks, he shows the execution time of monomorphic and polymorphic functions.
Miško notes useful programs for working with V8 profiling. At the end of the report, he presents the data structures in Ivy and announces ngDevMode - a mode for visual debugging of your application in the browser console.
Most of the report parses low-level browser optimizations. Suitable for developers who want to optimize their applications as much as possible.
Finding angular
Elana Olson talks about the Angular ecosystem: how to create a project, how to style it with Angular Material, how to add services and why they are needed. In conclusion, Elana Olson explains how you can help the Angular community and add your project to the ecosystem.
The report justifies the level of Starter. Suitable for new developers who have recently completed the Tour of Heroes.
The secrets behind Angular's lightning speed
Max Koretskyi addresses three levels of optimization: code execution time, use of data structures, and compiler operation.
- Inline caching and monomorphic functions will help speed up code execution.
- Bloom filter will speed up work with structures.
- Ivy compiler converts the html template into optimized JavaScript code.
- Before watching, I recommend that you familiarize yourself with the video Miško. The Max Koretskyi report is easier to understand because the examples are from Angular. Job Description Bloom filter remembered forever.
Profiling Angular apps like a shark
Gil Fink begins with a story about the rendering process in the browser, its stages, the difference between reflow and repaint, RAIL model. Then Gil proceeds to profiling and shows with examples how to find problem areas using the Performance tab in Chrome.
The report is suitable for familiarization with the process of profiling applications. There are no ties to Angular, you can recommend friends to frontendders of any specialization.
Automating your Angular projects with Schematics
Nrwl's Brandon Roberts talks about Angular Schematics features. They can be useful for automating routine tasks: establish dependencies when adding a package, perform additional operations during updating. And with the help of schematics, you can add code templates and facilitate the creation of standard entities. For example, Brandon shows how to add a template for an API service.
The report begins with the basics and is suitable for exploring technology.
The sketch report closed the first day program. Ahead of us was Angular-el, informal communication, walks around London ... And the second day of the conference, which we will discuss in a separate article.
Impressions from the first half of the conference remained mixed. On the one hand, some of the reports were really deep, real deep-dive with first-hand content, often from the creators of Angular themselves. On the other hand, there were reports, the level of which we rated below the stated level. But the value of the conference is not only in the reports - we will return to this issue in the second part.
All Articles