JavaScript is single threaded. Every script our application executes runs on the main thread. Keeping the execution time as short as possible is crucial for the runtime performance and responsiveness of our applications. Too long running scripts will result in bad (Core) Web Vitals like INP and TBT.
In this talk, we’ll uncover another solution to this problem, the Concurrent Mode. Having profound knowledge about how to orchestrate work on the main thread is key to understanding how the Concurrent Mode works. We’ll start with a deep dive into the JavaScript Event Loop and explore the characteristics of different scheduling techniques.
Building up on the scheduling techniques, I will explain how to implement a custom scheduler.
Finally, we’ll wrap things up with a live demonstration on how to apply the Concurrent Mode to angular applications. We’ll progressively improve the (Core) Web Vitals INP and TBT on this journey.
What You Will Learn
✔️ Control the Browser Render Pipeline - To make your app faster, you need to understand how the browser interprets your code. Learn the different stages of the Browser Render Pipeline. Get to know the tools to inspect & analyze bottlenecks in your application. Write code that always performs optimally.
✔️ Master the Javascript Event Loop - If you care about performance in any JavaScript application, mastering the Event Loop is a must. Dive deep into the JavaScript vm and learn techniques to avoid slow performing code on real world applications.
✔️ Measure & Optimize (Core) Web Vitals - Your performance has a score. Learn how it’s composed, measured and techniques to improve it. Get an expert in analyzing and improving LCP, CLS, INP, TBT, TTFB & more.
✔️ Go Zoneless: Master the new zoneless & signal-based change detection - Understand how Angular is getting faster because of the new change detection and zoneless features. Learn how to benefit from them.
✔️ Use CSS and DOM performance best practices - Improve the performance of real world applications by applying the latest CSS features. Learn how to identify and fix forced reflows and how to avoid layout thrashing.
✔️ Optimize your apps Network requests - Enterprise apps consume a lot of data. Master the tools that allow you to identify network related performance bottlenecks. Learn techniques and strategic approaches to optimize network related data consumption to ultimately improve the performance of your application.
Takeaway
From this workshop you will walk away with a deep understanding of how to enhance your applications performance. You'll gain practical knowledge of the JavaScript event loop, learn optimization techniques for the Core Web Vitals, and understand how to effectively utilize strategic approaches to identify & encounter performance bottlenecks. We'll dive deep into the browsers render pipeline, ensuring you know how to measure and improve your apps performance properly. Additionally, you will learn to apply advanced features like measuring CSS execution performance & utilizing cutting-edge CSS and DOM APIs to reduce reflows and prevent layout thrashing.
Independent Consultant, Architect, Developer & Trainer, Poland
Security Expert, Founder, GDE, Pragmatic Web Security | Belgium
Senior JavaScript Developer, Atos | Poland
Engineering Manager & Frontend SME, eBay | Netherlands
Nuxt Core Team, Leetchi | France
Front End Developer, GDE, Microsoft MVP , CAIS | UK
Tech Lead, Full-stack AI Engineer, GDE, Tikal | Israel
Front-end developer, Conscensia | Poland
Staff Engineer, Mapbox | USA
Senior Software Engineer / Power Grid Gdańsk R&D Manager, Volue/Bottega IT Minds | Poland
Senior Software Developer, Atlantis S.R.L. | Italy
Angular / .NET Developer / Team Lead, Conscensia | Poland
GDE for Angular, softwarearchitekt.at | Austria
Senior Fullstack Developer & Advocate, GDE, Monterail | Poland
Back End Developer, Podme | Sweden
Managing Delivery Architect, Capgemini | Poland
Senior Staff Engineer, GDE, SFEIR | Luxembourg
Principal Engineer, Google Developers Expert, Jumbo Supermarkten | Netherlands
GDE, Expert Web Consultant, Trainer, Mentor, Angular Training | France
Trainer & Consultant, AngularArchitects.io | Austria
Senior Software Engineer, Snowflake | Canada
Passionate Angular Developer, Angular Architects | Austria
Software Development Cook, Teacher & Coach, GDE | France
Software-Architekt, Thinktecture AG | Germany
Trainer and Consultant, AngularArchitects.io | Austria
Google Developer Expert, Author, Podcaster, NG/JS/AI POLAND | Poland
Sign up to receive updates about JS Poland, including workshops, speaker previews, ticket launches, JS Awards, JavaScript Master Podcast, Behind the Code Magazine, CFP details and other exclusive content. We won’t spam you and will only send you emails we genuinely think you’ll find interesting. You can unsubscribe at any time and you can find more information here.