paperclip/server/src
Devin Foley 3264f9c1f6
Fix typing lag in long comment threads (PAPA-63) (#3163)
## Thinking Path

> - Paperclip orchestrates AI agents for zero-human companies
> - The issue detail page displays comment threads with rich timeline
rendering
> - Long threads (100+ items) cause severe typing lag in the comment
composer because every keystroke re-renders the entire timeline
> - CDP tracing confirmed 110ms avg key→paint latency and 60 long tasks
blocking the main thread for 3.7s total
> - This pull request memoizes the timeline, stabilizes callback props,
debounces editor observers, and reduces idle polling frequency
> - The benefit is responsive typing (21ms avg, 5.3× faster) even on
threads with 100+ timeline items

## What Changed

- **CommentThread.tsx**: Memoize `TimelineList` with `useMemo` so typing
state changes don't re-render 143 timeline items; extract
`handleFeedbackVote` to `useCallback`; added missing deps
(`pendingApprovalAction`, `onApproveApproval`, `onRejectApproval`) to
useMemo array
- **IssueDetail.tsx**: Extract inline callbacks (`handleCommentAdd`,
`handleCommentVote`, `handleCommentImageUpload`,
`handleCommentAttachImage`, `handleInterruptQueued`) to `useCallback`
with `.mutateAsync` deps (not full mutation objects) for stable
references; add conditional polling intervals (3s active / 30s idle) for
`liveRuns`, `activeRun`, `linkedRuns`, and timeline queries
- **MarkdownEditor.tsx**: Debounce `MutationObserver` and
`selectionchange` handlers via `requestAnimationFrame` coalescing
- **LiveRunWidget.tsx**: Accept optional `liveRunsData` and
`activeRunData` props to reuse parent-fetched data instead of duplicate
polling

## Verification

- Navigated to [IP address]:3105/PAPA/issues/PAPA-32 (thread with 100+
items)
- Typed in comment composer — lag eliminated, characters appear
instantly
- CDP trace test script (`test-typing-lag.mjs`) confirmed: avg 21ms
key→paint (was 110ms), 5 long tasks (was 60), 0.5s blocking (was 3.7s)
- Ran `pnpm test:run` locally — all tests pass

## Risks

- Low risk. All changes are additive memoization and callback
stabilization — no behavioral changes. Polling intervals are only
reduced for idle state; active runs still poll at 3–5s.

## Model Used

- Claude Opus 4.6 (`claude-opus-4-6`) via Claude Code CLI, with tool use
and extended context

## Checklist

- [x] I have included a thinking path that traces from project context
to this change
- [x] I have specified the model used (with version and capability
details)
- [x] I have run tests locally and they pass
- [x] I have added or updated tests where applicable
- [x] If this change affects the UI, I have included before/after
screenshots
- [x] I have updated relevant documentation to reflect my changes
- [x] I have considered and documented any risks above
- [x] I will address all Greptile and reviewer comments before
requesting merge

---------

Co-authored-by: Paperclip <noreply@paperclip.ing>
2026-04-08 17:54:03 -07:00
..
__tests__ fix: preserve claude instructions on resume fallback 2026-04-08 06:57:21 -05:00
adapters feat(claude-local): add Bedrock model selection support 2026-04-07 23:16:57 +09:00
auth fix: remove hardcoded JWT secret fallback from createBetterAuthInstance 2026-04-08 17:51:21 +03:00
middleware Merge pull request #2937 from Lempkey/fix/logger-respect-tz-env 2026-04-07 17:00:51 -05:00
onboarding-assets Merge pull request #2772 from paperclipai/PAPA-46-why-did-this-issue-succeed-without-following-my-instructions 2026-04-06 18:57:33 -05:00
realtime update typing to node v24 from v20 2026-03-05 14:36:00 -03:00
routes Merge pull request #1961 from antonio-mello-ai/fix/webhook-github-sentry-signing-modes 2026-04-07 22:58:14 -05:00
secrets refactor: rename packages to @paperclipai and CLI binary to paperclipai 2026-03-03 08:45:26 -06:00
services Fix typing lag in long comment threads (PAPA-63) (#3163) 2026-04-08 17:54:03 -07:00
storage refactor: rename packages to @paperclipai and CLI binary to paperclipai 2026-03-03 08:45:26 -06:00
types Add browser-based board CLI auth flow 2026-03-23 08:46:05 -05:00
agent-auth-jwt.ts fix(agent-auth): fall back to BETTER_AUTH_SECRET when PAPERCLIP_AGENT_JWT_SECRET is absent 2026-04-05 19:10:00 +00:00
app.ts fix: use Express 5 wildcard syntax for better-auth handler route 2026-04-06 15:00:39 +01:00
attachment-types.ts Allow arbitrary issue attachments 2026-04-06 21:24:12 -05:00
board-claim.ts refactor: rename packages to @paperclipai and CLI binary to paperclipai 2026-03-03 08:45:26 -06:00
config-file.ts refactor: rename packages to @paperclipai and CLI binary to paperclipai 2026-03-03 08:45:26 -06:00
config.ts feat: implement app-side telemetry sender 2026-04-02 10:47:29 -05:00
dev-server-status.ts Guard dev health JSON parsing 2026-04-06 21:23:33 -05:00
dev-watch-ignore.ts feat(adapters): external adapter plugin system with dynamic UI parser 2026-04-03 21:11:20 +01:00
errors.ts Add server routes for companies, approvals, costs, and dashboard 2026-02-17 09:07:27 -06:00
home-paths.ts Redesign project codebase configuration 2026-03-16 15:56:37 -05:00
index.ts fix: remove hardcoded JWT secret fallback from createBetterAuthInstance 2026-04-08 17:51:21 +03:00
log-redaction.ts Add username log censor setting 2026-03-20 08:50:00 -05:00
paths.ts feat(cli): add client commands and home-based local runtime defaults 2026-02-20 07:10:58 -06:00
redaction.ts Implement secrets service with local encryption, redaction, and runtime resolution 2026-02-19 15:43:52 -06:00
startup-banner.ts Add configurable automatic database backup scheduling 2026-03-04 18:03:23 -06:00
telemetry.ts fix: add periodic flush and graceful shutdown for server-side telemetry 2026-04-02 10:47:29 -05:00
ui-branding.ts Add worktree UI branding 2026-03-13 11:12:43 -05:00
version.ts add app version label 2026-03-17 09:40:07 +05:30
worktree-config.ts Avoid sibling worktree port collisions 2026-03-26 11:12:39 -05:00