2 min read
Performance
For making your app faster and more responsive.
Diagnosing Slowness
Identify the bottleneck
[Feature/page] feels slow. What's causing it and how can we speed it up?
Slow startup
The app takes too long to load initially. What can we do to reduce startup time?
Janky scrolling
Scrolling feels janky/choppy. Make it smooth.
Images & Assets
Optimize image sizes
The images are too large and slowing down the page. Optimize them.
Lazy load images
Add lazy loading so images below the fold don't load until the user scrolls to them.
Convert to WebP
Convert images to WebP for smaller file sizes.
Web Performance
Reduce bundle size
Reduce the bundle size. Are there any dependencies we can remove or replace with lighter alternatives?
Add loading states
Add loading states so the page feels responsive even when data is still fetching.
Cache data
Cache [data] so we don't fetch it from the API on every page load.
Fix render blocking
The CSS/JavaScript is blocking the page from rendering. Fix it.
Native App Performance
Reduce memory usage
The app is using too much memory. Find and fix the cause.
Fix dropped frames
[Animation/transition] is dropping frames. Make it smooth.
Optimize long lists
The list scrolls slowly with many items. Optimize it.
Tips
- The first rule of performance: measure before you optimize
- Most perceived slowness comes from missing loading states, not actual speed
- Images are almost always the biggest performance win on the web
- See the Performance guide for more context