| Metric | What It Measures | Target | Description |
|---|---|---|---|
| Largest Contentful Paint (LCP) | Loading performance | ≤ 2.5 seconds | Identifies when the largest content element in the viewport is rendered, effectively measuring perceived load time |
| Interaction to Next Paint (INP) | Responsiveness | < 200 milliseconds | Identifies all interactions and reports the worst latency |
| Cumulative Layout Shift (CLS) | Visual stability | < 0.1 | Identifies the largest burst (session window) with maximum cumulative score of all layout shifts within the windows using Layout Stability API |
HeLinChooi
/ react-with-typescript-setup
Last active
February 20, 2023 04:57
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| yarn create react-app my-app --template typescript | |
| cd app-name | |
| yarn add @mui/material @emotion/react @emotion/styled @mui/icons-material react-router-dom sass | |
| npx husky-init | |
| yarn add --dev pretty-quick prettier | |
| npx husky set .husky/pre-commit "npx pretty-quick --staged" |