perf: Implement zero-copy audio transfer and optimize scroll

[ysdede]

This change addresses two performance issues:

1. Issue 4 (Worker Message Overhead):
   • Reordered AudioEngine.ts to call audioChunkCallbacks after internal processing (RingBuffer write, VAD, Vis). This allows subscribers (like TenVAD worker) to transfer the audio buffer without detaching it before the engine uses it.
   • Updated TranscriptionWorkerClient.ts to support transferring buffers (Transferable[]) in sendRequest.
   • Updated processV4ChunkWithFeatures, processV3ChunkWithFeatures, and processV3Chunk to transfer large buffers (features, audio) instead of copying them.
2. Issue 2 (Scroll Reflows):
   • Optimized TranscriptionDisplay.tsx by adding a 50ms debounce to scrollToBottom and explicitly disabling characterData observation in MutationObserver. This prevents excessive layout thrashing during rapid text streaming.

Verified with mel-e2e.test.ts and a temporary reproduction test for AudioEngine.

---

PR created automatically by Jules for task 13074619647761767215 started by @ysdede

[kiloconnect]

Code Review Summary

Status: No Issues Found | Recommendation: Merge

Overview

This PR implements performance optimizations focused on zero-copy buffer transfers and scroll behavior improvements:

Severity	Count
CRITICAL	0
WARNING	0
SUGGESTION	0

Changes Reviewed

1. TranscriptionDisplay.tsx - Scroll optimization

   • Changed from requestAnimationFrame-based scheduling to setTimeout (50ms) + requestAnimationFrame for better debouncing
   • Added cleanup of scroll timeout in onCleanup
   • Added characterData: false to MutationObserver to reduce callback frequency

2. AudioEngine.ts - Zero-copy optimization

   • Moved audioChunkCallbacks notification from before processing to after internal processing
   • Allows subscribers to safely transfer the buffer (zero-copy) since internal processing is complete

3. TranscriptionWorkerClient.ts - Transferable buffers

   • Added transfer parameter to sendRequest method
   • Implemented zero-copy transfers using Transferable objects for:
     • processV3Chunk: [audio.buffer]
     • processV3ChunkWithFeatures: [features.buffer]
     • processV4ChunkWithFeatures: [params.features.buffer]

Technical Notes

• The buffer transfers are safe because callers create fresh arrays for each request and don't reuse them after the call
• The scroll debouncing adds a small 50ms delay which is intentional to reduce excessive scroll events
• All changes are performance-focused and follow existing patterns in the codebase

Files Reviewed (3 files)

• src/components/TranscriptionDisplay.tsx
• src/lib/audio/AudioEngine.ts
• src/lib/transcription/TranscriptionWorkerClient.ts

---

Review generated by Kilo Code Review Agent

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 4b7484c386

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Keep debounce armed until scroll frame executes

scrollTimeout is cleared immediately after scheduling requestAnimationFrame, which means in background tabs (where RAF is paused) each incoming mutation can enqueue another RAF callback while transcription continues. When the tab becomes visible again, those queued callbacks can run in a burst and cause avoidable jank/memory growth; keeping the debounce state set until the RAF callback runs avoids this regression.

Useful? React with 👍 / 👎.

[ysdede]

Related follow-up landed in PR #143 (conservative round-2 perf pass). It focuses on low-risk v4 worker/UI/debug optimizations and references this PR as related context.