# Common performance pitfalls and how to avoid them — Web Performance Optimization

Source: https://www.skillbyai.com/en/web-performance/web-perf-24

> Learn from common mistakes and anti-patterns that degrade performance.

## Performance anti-patterns

Avoid: unoptimized images, render-blocking CSS/JS, layout thrashing, polling instead of events, missing caching headers, bloated frameworks, inlining large resources, not testing on slow networks, ignoring third-party scripts. Each costs 100-1000ms of performance.

## Testing on realistic conditions

Always test on slow networks (3G, 4G) and older devices (2–3 year old phones). DevTools throttling "Fast 3G" is roughly 1.6Mbps down and 750Kbps up. Most real users aren't on fiber, so measure on real devices regularly.

## Avoiding regressions

Set performance budgets in CI/CD. Use synthetic monitoring for early detection. Compare before/after metrics. Educate team on performance impact. Measure third-party impact (analytics, ads, tracking). Budget for unavoidable dependencies.

Quick check

**Quiz:** What is a common performance anti-pattern?

- [x] Polling instead of events
- [ ] Using Service Workers
- [ ] Optimizing images
- [ ] Compressing images

*Answer:* Polling instead of events. Polling wastes network and CPU; events or push updates are more efficient.
