mirror of
https://github.com/alkimake/paperclip.git
synced 2026-06-19 12:10:37 +09:00
## 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> |
||
|---|---|---|
| .. | ||
| access.ts | ||
| activity-log.ts | ||
| activity.ts | ||
| adapter-plugin-store.ts | ||
| agent-instructions.ts | ||
| agent-permissions.ts | ||
| agents.ts | ||
| approvals.ts | ||
| assets.ts | ||
| board-auth.ts | ||
| budgets.ts | ||
| companies.ts | ||
| company-export-readme.ts | ||
| company-portability.ts | ||
| company-skills.ts | ||
| costs.ts | ||
| cron.ts | ||
| dashboard.ts | ||
| default-agent-instructions.ts | ||
| documents.ts | ||
| execution-workspace-policy.ts | ||
| execution-workspaces.ts | ||
| feedback-redaction.ts | ||
| feedback-share-client.ts | ||
| feedback.ts | ||
| finance.ts | ||
| github-fetch.ts | ||
| goals.ts | ||
| heartbeat-run-summary.ts | ||
| heartbeat.ts | ||
| hire-hook.ts | ||
| index.ts | ||
| instance-settings.ts | ||
| issue-approvals.ts | ||
| issue-assignment-wakeup.ts | ||
| issue-execution-policy.ts | ||
| issue-goal-fallback.ts | ||
| issues.ts | ||
| live-events.ts | ||
| local-service-supervisor.ts | ||
| plugin-capability-validator.ts | ||
| plugin-config-validator.ts | ||
| plugin-dev-watcher.ts | ||
| plugin-event-bus.ts | ||
| plugin-host-service-cleanup.ts | ||
| plugin-host-services.ts | ||
| plugin-job-coordinator.ts | ||
| plugin-job-scheduler.ts | ||
| plugin-job-store.ts | ||
| plugin-lifecycle.ts | ||
| plugin-loader.ts | ||
| plugin-log-retention.ts | ||
| plugin-manifest-validator.ts | ||
| plugin-registry.ts | ||
| plugin-runtime-sandbox.ts | ||
| plugin-secrets-handler.ts | ||
| plugin-state-store.ts | ||
| plugin-stream-bus.ts | ||
| plugin-tool-dispatcher.ts | ||
| plugin-tool-registry.ts | ||
| plugin-worker-manager.ts | ||
| project-workspace-runtime-config.ts | ||
| projects.ts | ||
| quota-windows.ts | ||
| routines.ts | ||
| run-log-store.ts | ||
| secrets.ts | ||
| sidebar-badges.ts | ||
| work-products.ts | ||
| workspace-operation-log-store.ts | ||
| workspace-operations.ts | ||
| workspace-runtime-read-model.ts | ||
| workspace-runtime.ts | ||