7b1b296430
client/ — React + Vite + TypeScript scaffolded with the Pipecat client SDK (@pipecat-ai/client-js) and SmallWebRTCTransport (@pipecat-ai/small-webrtc-transport). useVoiceSession.ts hook manages mic permission, WebRTC connect, audio playback, live transcript, and a latency readout (captures the e2e_latency_ms metric the server emits). App.tsx is a minimal one-page session UI: disclaimer, Start/End buttons, status badge, latency readout (within/over 600ms budget), live transcript. vite.config.ts proxies /pipecat + /health to the Python server (port 8789). npm run typecheck + npm run build pass. server/latency.py — LatencyObserver (a Pipecat FrameProcessor) timestamps transcript-ready, LLM-first-token, TTS-first-audio, and playback-start per turn, computes ASR→TTS-first-audio (the v0.1 latency target), and logs it to console with a within/over-budget verdict. Wired into the pipeline between STT/LLM/TTS so it observes without altering the frame stream. 5 unit tests pass (LatencyRecord e2e math + observer construction + reset_turn). Full server suite: 18 passed. ---ci--- phase: 1 milestone: v0.1 plan: 02 task: 02-05,02-06 status: execute persona: frontend-engineer,backend-engineer requirements: covered: [REQ-VOICE-01, REQ-VOICE-02, REQ-VOICE-03, REQ-NFR-LAT-01] ---/ci---
33 lines
1.2 KiB
Markdown
33 lines
1.2 KiB
Markdown
# React + TypeScript + Vite
|
|
|
|
This template provides a minimal setup to get React working in Vite with HMR and some Oxlint rules.
|
|
|
|
Currently, two official plugins are available:
|
|
|
|
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
|
|
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)
|
|
|
|
## React Compiler
|
|
|
|
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
|
|
|
|
## Expanding the Oxlint configuration
|
|
|
|
If you are developing a production application, we recommend enabling type-aware lint rules by installing `oxlint-tsgolint` and editing `.oxlintrc.json`:
|
|
|
|
```json
|
|
{
|
|
"$schema": "./node_modules/oxlint/configuration_schema.json",
|
|
"plugins": ["react", "typescript", "oxc"],
|
|
"options": {
|
|
"typeAware": true
|
|
},
|
|
"rules": {
|
|
"react/rules-of-hooks": "error",
|
|
"react/only-export-components": ["warn", { "allowConstantExport": true }]
|
|
}
|
|
}
|
|
```
|
|
|
|
See the [Oxlint rules documentation](https://oxc.rs/docs/guide/usage/linter/rules) for the full list of rules and categories.
|