WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
WeAreDevelopers LIVE • Mar 9, 2022

Angular tips/tricks you can use from tomorrow on

Benedikt Starzengruber

Mask network latency by triggering dynamic component imports on hover. Discover practical RxJS and change detection strategies to instantly optimize your legacy Angular codebase without a complete rewrite.

Pause
Mute Enter Fullscreen
#1 about 7 min

Abstracting recurring logic into custom RxJS operators

Repetitive mapping and filtering operations on arrays are extracted into highly readable custom RxJS operators.

#2 about 8 min

Invoking component methods efficiently with pure pipes

Performance bottlenecks caused by triggering functions during change detection are avoided using a generic wrapper pipe.

#3 about 6 min

Styling native browser scrollbars without external libraries

Replacing heavy third-party scrolling scripts with native CSS pseudo-elements creates lightweight and customizable scrollbars.

#4 about 7 min

Implementing responsive behavior with the resize observer API

Complex responsive layout changes that cannot be achieved with CSS are managed through a custom Angular directive leveraging the resize observer.

#5 about 7 min

Lazy loading components with the intersection observer API

Premature API calls and component rendering are prevented by initiating loading only when elements trigger the intersection observer upon entering the viewport.

#6 about 8 min

Reducing initial bundle sizes with component lazy loading

Detaching heavy components from the main application bundle via dynamic module imports ensures faster initial load times.

#7 about 9 min

Exploring Angular component patterns and upcoming framework updates

Optimal component modularity, upcoming standalone capabilities, and framework ecosystem advantages are evaluated alongside community questions.

Matching moments

3:46 min

The rise of modern component-based frameworks and modular architecture

Sasha Shynkevich · LIVE

3:24 min

Introduction to building reusable Angular components

Valentine Awe · WWC 2022

4:02 min

Implementing standalone APIs in modern Angular architectures

Valentine Awe · WWC 2023

3:12 min

Evaluating Angular trade-offs and the web components alternative

Benjamin Glusa · LIVE

3:00 min

Summarizing modern patterns for robust interactive components

Aurora Scharff Aurora Scharff · WWC 2025

5:24 min

Replacing Angular modules with lightweight fine-grained libraries

Manfred Steyer Manfred Steyer · LIVE

More from WeAreDevelopers LIVE

Aliens in Quarantine, Python Deprecates Loops, and AI Buys Old Books - Zbyszek Tenerowicz thumbnail
5:43
5 days ago

Aliens in Quarantine, Python Deprecates Loops, and AI Buys Old Books - Zbyszek Tenerowicz

Chris Heilmann, Daniel Cranney

WeAreDevelopers LIVE - Node and Package Security thumbnail
1:08:30
5 days ago

WeAreDevelopers LIVE - Node and Package Security

Chris Heilmann, Daniel Cranney, Zbyszek Tenerowicz

WeAreDevelopers LIVE - Streaming HTML thumbnail
1:10:26
12 days ago

WeAreDevelopers LIVE - Streaming HTML

Chris Heilmann, Daniel Cranney, Jad Joubran

WeAreDevelopers LIVE - CODE100 at WeAreDevelopers Europe thumbnail
1:02:34
19 days ago

WeAreDevelopers LIVE - CODE100 at WeAreDevelopers Europe

Chris Heilmann, Daniel Cranney, Justin Halsall, Werner Jeschko, Nicole Jeschko, Mirco Tomić

WeAreDevelopers LIVE - Web Performance in an AI World thumbnail
1:07:59
26 days ago

WeAreDevelopers LIVE - Web Performance in an AI World

Chris Heilmann, Daniel Cranney

FIFA Hack, Midjourney Does Ultrasounds, and Trampoline Traffic Lights - Nicole Jeschko and Werner Jeschko thumbnail
5:55
about 2 months ago

FIFA Hack, Midjourney Does Ultrasounds, and Trampoline Traffic Lights - Nicole Jeschko and Werner Jeschko

Chris Heilmann, Daniel Cranney

Upcoming sessions on this topic

Open session

World Congress 2026 North America

Architecting AI in Angular: WebMCP, A2UI, and the Agent Experience

Ankita Sood

Sr. Principal Engineer @ Secureworks | Angular GDE

Ankita Sood
Open session

World Congress 2026 North America

Beyond Vibe Coding: An AI Builder’s Guide to Migrating 10k+ React Components

Shubham Chaurasia

Senior Software Engineer @ Meta

Shubham Chaurasia
Open session

World Congress 2026 North America

Small LLM in your Browser: Huge Opportunities for Web Applications

Daniel Ostrovsky

UI/UX Architect at Payoneer | AI Architect | Full Cycle Development Expert | Public Speaker | Open Source Contributor |

Daniel Ostrovsky
Open session

World Congress 2026 North America

How to generate business value through performance optimizations

Nikolai Sidiropulo

Software Engineer at Meta

Nikolai Sidiropulo
Open session

World Congress 2026 North America

Designing APIs That Survive AI Agents at Scale

Phani Pendurthi

Mastercard, Principal Software Engineer

Phani Pendurthi
Open session

World Congress 2026 North America

Fast by Design: A Masterclass in High-Performance Web Engineering

Aaron Grogg

Senior web developer, committed to improving the user experience by improving web performance

Aaron Grogg

Related videos

Angular Features You Should be Using thumbnail
36:22
WWC 2021 • about 5 years ago

Angular Features You Should be Using

Sani Yusuf

Angular Unleashed: Mastering Modern Web Development with Angular thumbnail
58:56
LIVE • almost 3 years ago

Angular Unleashed: Mastering Modern Web Development with Angular

Indu Chaube

Angular Magical directives thumbnail
29:11
WWC 2022 • about 4 years ago

Angular Magical directives

Valentine Awe

Angular <> Angular CDK - Awesomeness Combined thumbnail
35:49
WWC 2021 • about 5 years ago

Angular <> Angular CDK - Awesomeness Combined

Muhammad Ahsan Ayaz

Practice makes perfect - when it comes to RxJS thumbnail
33:25
LIVE • about 6 years ago

Practice makes perfect - when it comes to RxJS

Jan-Niklas Wortmann

Stand alone components in Angular thumbnail
28:11
WWC 2023 • almost 3 years ago

Stand alone components in Angular

Valentine Awe

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.