Menu
Removing artificial delays in Crok AI chat SSE endpoint for WSH 2026 user flow scoring.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Crok AI chat rendering optimization — SSE debouncing, ChatMessage memoization, Markdown re-render prevention
DM page and flow optimization — afterSave hook, message rendering, unread count queries for WSH 2026
Home page performance optimization — Post defaultScope, SSR data reduction, lazy media hydration for WSH 2026 CaX app
Lazy loading modal containers and route components to reduce initial bundle size — CrokContainer, NewPostModalContainer
SSE streaming optimization — batching char-by-char events and debouncing React re-renders for Crok AI chat performance
Runs Visual Regression Testing (VRT) locally to prevent disqualification in Web Speed Hackathon. Captures screenshots, compares against baselines, updates snapshots, and validates visual integrity after performance optimizations. Use when optimizing WSH apps, running VRT checks, updating VRT baselines, or investigating VRT failures.
| name | wsh-crok-optimization |
| description | Removing artificial delays in Crok AI chat SSE endpoint for WSH 2026 user flow scoring. |
The Crok AI endpoint has intentional artificial delays — 3000ms TTFT and 10ms per character. This directly impacts the "Crok AI チャット" user flow score (50 pts).
Use this skill when optimizing the Crok AI SSE endpoint.
// Before (crok.ts)
await sleep(3000); // TTFT delay
for (const char of response) {
res.write(`event: message\n...`);
await sleep(10); // Per-character delay
}
// After — remove sleep calls
// Stream entire response immediately
for (const char of response) {
res.write(`event: message\ndata: ${JSON.stringify({ content: char })}\n\n`);
// No sleep
}
Or even better — send the entire response at once:
res.write(`event: message\ndata: ${JSON.stringify({ content: response })}\n\n`);
res.write("event: done\ndata: {}\n\n");
Impact: User flow score for Crok AI chat: +30-50 pts (INP, TBT)
| Change | Visual Impact | Mitigation |
|---|---|---|
| Faster response | Chat messages appear instantly | No visual diff in screenshots |
application/server/src/routes/api/crok.tsevent: message, event: done