# Performance Optimization — Progressive Web Apps: Offline, Installable Web Apps

Source: https://www.skillbyai.com/hi/pwa/pwa-performance

> Core Web Vitals, compression, code splitting और lazy loading से PWA की गति बढ़ाएँ, और real-user metrics ट्रैक करें।

## Performance Metrics

Core Web Vitals पर focus करें: LCP (Largest Contentful Paint), INP (Interaction to Next Paint) और CLS (Cumulative Layout Shift)। Load times कम रखने के लिए compression, code splitting और lazy loading उपयोग करें।

## Lazy load और compress करें

Faster loads के लिए dynamic imports और Gzip compression का उपयोग करें।

```javascript
// Code splitting with dynamic imports
const featureButton = document.getElementById('feature');
featureButton.addEventListener('click', async () => {
  // Only load when needed
  const { heavyFeature } = await import('./heavy-feature.js');
  heavyFeature();
});

// Monitor Core Web Vitals
web_vitals.getCLS(console.log);
web_vitals.getFID(console.log);
web_vitals.getLCP(console.log);
```

Output:

```
Code split and lazy loaded; Core Web Vitals monitored in production.
```

## Performance Timeline

Visualize करें कि कैसे Core Web Vitals user experience को affect करते हैं।

![Timeline जो LCP, FID और CLS metrics और user experience पर उनके impact को दिखाता है।](assets/figures/pwa/pwa-learning-map.svg) — चित्र 9.1 — Core Web Vitals और user experience impact।