Push-Based Angular Performance Workshop

Installation Instructions

System Requirements

• node ^20.19.0 || ^22.12.0 || ^24.0.0
• npm > 10
• access to tmdb api

Clone and install

git clone https://github.com/push-based/ws-perf-datev-0608025.git

cd ws-perf-datev-0608025
npm install 

# (optional) if the step before didn't work, please try the following
npm install --force

Run the application

npm run start

Workshop Information

• ws info doc
• slides

Exercises

• 0. Project Setup
• 0.1 Additional Project Setups

Day 1

• Tooling: Performance Analysis & Flame Charts
• Tooling: JS Event Loop
• INP: Scheduling - chunk work
• INP: Scheduling - Prioritize Work
• Network: Preconnect
• Network: Preload & Prefetch
• Network: Lazy Loading Resources
• Network: Prefetch LCP Data
• Network: Cancel In-Flight Requests
• Network: Image Optimizations

Day 2

• CSS: Forced Reflow ResizeObserver
• CSS: Forced Reflow IntersectionObserver
• CSS: Compositor Animations
• CSS: contain
• CSS: content-visibility
• CSS: layout trashing
• Change Detection: Dirty Check
• Change Detection: zone.js optimizations
• Change Detection: OnPush
• Change Detection: Manual Change Detection
• Change Detection: signals
• Change Detection: zoneless
• Defer
• SSR: Setup & Gotchas
• SSR: Caching & Server Timing
• SSR: Server Routes Configuration
• Tooling: Recorder
• Tooling: Lighthouse