Push-Based Angular Performance Workshop

Installation Instructions

System Requirements

• node > 20
• npm > 8

Clone and install

git clone https://github.com/push-based/ws-perf-swedbank-090125.git

cd ws-perf-swedbank-090125
npm install 
# or if you're using yarn
yarn 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

• Tooling: Performance Analysis & Flame Charts
• Tooling: JS Event Loop
• INP: Scheduling - chunk work
• Network: Preload & Prefetch
• Network: Lazy Loading Resources
• Network: Image Optimizations
• CSS: Forced Reflow ResizeObserver
• CSS: Compositor Animations
• CSS: contain
• CSS: content-visibility

Optional

• SSR: Setup & Gotchas
• SSR: Caching & Server Timing
• SSR: Server Routes Configuration
• Change Detection: Dirty Check
• Change Detection: OnPush
• Change Detection: Manual Change Detection
• Change Detection: signals
• Change Detection: zoneless