The official TypeScript template for Create React App providing preconfigured TypeScript support and development environment setup.
Overall
score
98%
{
"context": "Evaluates how the solution wires the optional performance hook to the web-vitals library. Scoring prioritizes correctly importing web-vitals on demand, invoking its metric collectors, and forwarding the exact metric objects from the library to callbacks and network targets. Only package usage and wiring behavior are assessed.",
"type": "weighted_checklist",
"checklist": [
{
"name": "Lazy import",
"description": "web-vitals is loaded dynamically (e.g., import('web-vitals')) only when reporting is requested, avoiding eager static imports.",
"max_score": 20
},
{
"name": "Core metrics",
"description": "All five web-vitals collectors (getCLS, getFID, getFCP, getLCP, getTTFB) are called and each receives the reporting handler so every core metric can be emitted.",
"max_score": 30
},
{
"name": "Report handler typing",
"description": "The reporting callback is typed/treated as a web-vitals ReportHandler and receives the metric objects (with name, value, id, delta, rating, entries) directly from the library without re-shaping them first.",
"max_score": 15
},
{
"name": "Conditional start",
"description": "No web-vitals collectors are invoked when neither a callback nor endpoint is provided; instrumentation only starts when a reporter target exists.",
"max_score": 15
},
{
"name": "Network payload",
"description": "When an endpoint is configured, the solution posts the metric objects returned by web-vitals (including name, id, value, delta, rating) once per metric rather than custom-computed data.",
"max_score": 20
}
]
}Install with Tessl CLI
npx tessl i tessl/npm-cra-template-typescript