Zurück zum Programm
08.11.2022 - 15:30 Uhr

Non-trivial optimization techniques in Angular

Angu­lar has a num­ber of dis­tinct per­for­mance bot­tle­necks to alle­vi­ate, espe­cial­ly in larg­er appli­ca­tions. How­ev­er, even though there is infor­ma­tion avail­able on the web on improv­ing per­for­mance, most­ly this knowl­edge is lim­it­ed to change detec­tion strat­e­gy OnPush and async pipe. This for sure is only a tiny frac­tion of what’s pos­si­ble so it’s time to raise the bar and dou­ble down on opti­miza­tion efforts!

The web has nev­er been more excit­ing! But it has also nev­er been as demand­ing to our devices and infra­struc­ture as it is today. Our browsers ship new fea­tures, and lan­guages get updates only to squeeze out the last bit of per­for­mance we can get. The prob­lem here, there are no real resources out there that would show us how to apply those opti­miza­tion tech­niques in prac­tice, which can be espe­cial­ly painful when it comes to frame­work-spe­cif­ic questions.

This talk will fea­ture the most up-to-date infor­ma­tion to expand your knowl­edge of per­for­mance opti­miza­tion tech­niques beyond the basics. In the end, you will go home with lots of exer­cis­es to guide you and a wealth of insights to work with, impressed by how much faster your appli­ca­tion can get.

Togeth­er we will take a clos­er look at what an audit­ing process looks like. Then, we will dis­cuss how to read Flame Charts, learn how to nav­i­gate through the net­work tab, and increase our knowl­edge of net­work analy­sis fea­tures. Final­ly, we will take a spin on the brand-new Angu­lar Per­for­mance Dev­Tools and com­pare them with the orig­i­nal ChromeDevTools.

Lernziele

  • How to record and analyze flame charts
  • How to document performance issues and measure improvements
  • How to detect performance bottlenecks
  • Hands on with Angular’s brand new DevTools
  • Blocking tasks and how to spot scripting bottlenecks
  • Network analysis and improvement strategies
  • Change detection strategies & IVY features
  • Best & bad performance practices for modifying the DOM Structure and CSS rendering
  • Runtime performance of scripting, rendering, and painting

Niveau

Expertenniveau

Vorkenntnisse

Basic performance knowledge and curiosity, no other special prerequisites are needed.

Michael Hladky
Michael Hladky
Team Push-Based
twitter: @Michael_Hladky

Michael Hladky is a Google Developer Expert (GDE), Microsoft MVP, trainer, and consultant with a focus on Angular and RxJS. For years he has been helping companies and developers to set up scalable architectures and performant processes enabling teams to keep up with state-of-the-art development. A vibrant member of the tech community, he organizes multiple community events and workshops each year to give back.