Files
PaperClipAI/maps/feature-map
DottaandPaperclip d38cdf261a perf(ui): speed up Tasks and Inbox startup (#18492)
## Thinking Path

> - Paperclip is the open source app people use to manage AI agents for
work.
> - Tasks and Inbox are the main entry points for that work.
> - Earlier changes made their data reads and row counts smaller.
> - Those changes remain, but shared controls now pull in the whole
task-detail bundle.
> - A cold open can also read a remembered organization before selecting
the one in the URL.
> - This pull request separates collection code and selects the
addressed organization first.
> - It warms task code after collection paint, so the next task open
stays fast.

## Linked Issues or Issue Description

Refs #17756, #18323, #16849, #17041, #17983, #17960, #18461.

**What happened?**

Tasks and Inbox still use their optimized index reads and row budgets.
However, small shared controls and hooks were placed in the task-detail
chunk. A collection had to download that whole chunk. The HTML also
preloaded it on every route. The original production profile loaded
about 6.5 MB of decoded JavaScript before useful rows, or 1.9 MB
transferred with compression.

Company bootstrap could select a different remembered organization
before Layout selected the URL's organization. This started unnecessary
company reads. A retained multi-company browser fixture reproduced two
attention-count requests for different companies.

**Expected behavior**

Show correctly scoped, stable collection rows without waiting for
task-detail code. Keep compact reads, bounded rendering, direct task
preloading, immediate New Task input, and fast follow-on navigation.

**Steps to reproduce**

1. Use a production UI build with Coordinator enabled and two active
organizations.
2. Remember one organization, then cold-open Tasks or Mine in the other.
3. Inspect startup script and company requests before the first useful
row.

The baseline UI revision is `91fdf02e95`. This is a UI change. It has no
API, schema, migration, or authorization changes.

## What Changed

- Group the static collection dependency trees above the task-detail
group. Keep the existing startup and task grouping strategy.
- Preload task detail and its static dependency closure early on direct
task and agent-chat URLs. Keep collection aliases out of that preload.
- Fetch the immutable task chunk at low priority after a collection
paints, or on a same-origin task-link hint. After a successful immutable
response is fully read, module-preload the cached chunk so it can
compile without executing. A failed HTTP probe skips module preload.
- Prefer an addressed active organization during bootstrap. Preserve
manual selection, archived-company handling, and account-scoped company
lists.
- Preserve a task reading anchor when a programmatic scroll event
reports an unchanged offset during restore reflow. Strengthen the Back
journey to wait for a completed collection navigation.
- Add production-browser checks for delayed indexes, correct company
scope, stable row geometry, failed speculation, and early direct-task
preload. Update collection verification notes and the feature map.

## Verification

Final source: `e402ab7fc6`; baseline UI: `91fdf02e95`.

- All **234 focused unit cases** and **44 production-browser journeys**
passed on the final source: 33 task journeys and 11 collection journeys.
Coverage includes compact history, saved cards, draft persistence,
avatar continuity, failed-probe recovery, delayed data, pagination, deep
links, desktop/mobile and reading-position restoration through Back.
Desktop and mobile screenshots were inspected.
- Workspace typecheck, full production build, map checks, token gates
and diff checks passed. The default local `pnpm test:run` still stops
before executing tests because the existing chat-test line selector
reports `No test found` (1,816 skipped). This is not a passed full local
test suite. Focused tests and remote CI remain separate evidence.
- Greptile reviewed the exact final commit at **5/5**, with zero open
review threads. Final code CI passed. The complete check inventory is
**55 successful, 3 skipped, 1 neutral**. The neutral result is the
separate Paperclip Review: its agent finished without completing an
assessment, so it is not a passing review score.

Five alternating baseline/candidate pairs per scenario, Chromium
151.0.7922.34, 1440×900, 4× CPU, 50ms latency, approximately 9Mbps down
/ 1.5Mbps up. Cold cases use fresh browser contexts with normal cache
writes enabled; warm cases use the same context and normal application
query cache. Both previews use the server's immutable hashed-asset cache
policy and uncached HTML, with real local feature settings and no
request interception. All task-owned builds and suites were stopped
during timing; other host activity was uncontrolled. Readiness requires
useful rows and editable search, or the readable task thread and
editable composer, followed by two animation frames.

| Journey | Baseline median (range) | PR median (range) | Median paired
saving |
| --- | --- | --- | --- |
| Cold Tasks | 3239 ms (3189–3333) | 2545 ms (2441–2682) | +752 ms |
| Cold Inbox | 3207 ms (3203–3268) | 2679 ms (2502–3062) | +541 ms |
| Warm Inbox | 717 ms (701–917) | 760 ms (745–768) | -47 ms |
| Warm Tasks | 1150 ms (1126–1207) | 1136 ms (1119–1174) | +18 ms |
| First task click | 943 ms (932–1008) | 1007 ms (976–1098) | -74 ms |
| Back to Tasks | 584 ms (568–617) | 566 ms (559–575) | +10 ms |
| Cold direct task control | 3389 ms (3377–3402) | 3415 ms (3395–3896) |
-13 ms |

All five pairs improved for each cold collection. The signed saving is
baseline minus candidate for each pair; it is distinct from the
difference of medians. Warm navigation is broadly similar. First task
click was 74ms slower by median paired difference. Direct-task median
paired difference was 13ms slower, with one slower 3.90s candidate
sample retained in the range; this is not a claimed direct-task speedup.

Completed script transfers by collection readiness fell from about
**1.91MB to 1.14MB** (Tasks), and **1.90MB to 1.14MB** (Inbox). Task
code warms after rows paint. At the test bandwidth, the removed 0.77MB
critical transfer represents roughly 0.65s of download time; CPU and
network overlap, so their savings are not added. Unthrottled loopback
API control medians stayed about 17–18ms in both variants. All 30 cold
samples had zero browser errors.

Rejected experiments remain separate: automatic splitting produced over
200 startup requests; disabling recursive grouping slowed direct tasks;
HTTP-only warming improved collection startup but slowed first task
opens. The final correction preloads direct dependencies and compiles
successfully cached code after paint. Routing disables HTTP caching, so
intercepted runs were kept as diagnostic evidence rather than used for
warm-cache acceptance; see [Playwright's cache
behavior](https://playwright.dev/docs/api/class-page#page-route). Vite
preview's default asset `no-cache` policy was also corrected to match
the shipped server before final measurement.


## Risks

- Bundle placement affects shared consumers. Browser checks cover
collections and task navigation; the full PR checks also cover other
routes.
- Code warming still transfers the task chunk if the user stays on a
populated collection. It moves that download past first paint and does
not execute it. This is a startup latency improvement, not a claim that
all eventual bytes disappear.
- A direct click before warming finishes still loads code on demand.
Direct task and chat URLs retain early module preload.
- Local browser evidence does not establish a deployed staging speedup.
This PR does not merge or deploy itself.

## Model Used

OpenAI GPT-6 (Codex), with reasoning, tool use and local code execution.
The context-window size is not exposed in this environment.

## 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 checked ROADMAP.md and confirmed this PR does not duplicate
planned core work
- [x] I have searched GitHub for duplicate or related PRs and linked
them above
- [x] I have either (a) linked existing issues with `Fixes: #` / `Closes
#` / `Refs #` OR (b) described the issue in-PR following the relevant
issue template
- [x] I have not referenced internal/instance-local Paperclip issues or
links (only public GitHub `#NNN` / `github.com/paperclipai/paperclip`
URLs)
- [x] My branch name describes the change (e.g. `docs/...`, `fix/...`)
and contains no internal Paperclip ticket id or instance-derived details
- [x] I have run the relevant tests locally and they pass (234 unit
cases and 44 browser journeys; the full-command limitation is documented
above)
- [x] I have added or updated tests where applicable
- [x] I have updated relevant documentation to reflect my changes
- [x] I have considered and documented any risks above
- [x] All code CI gates are green (the separate Paperclip Review is
neutral because its agent did not complete an assessment)
- [x] Greptile is 5/5 with no open P2s, recommendations, or follow-ups
- [x] I will address all Greptile and reviewer comments before
requesting merge

---------

Co-authored-by: Paperclip <noreply@paperclip.ing>
2026-10-31 22:12:41 -05:00
..

Paperclip feature map

Start here when reproducing a user-facing bug, verifying a change, or deciding which surfaces a fix must cover. Each recipe describes what a person can do, where they can do it, the expected result, and the evidence needed to verify it. Product behavior is still governed by the implementation spec.

The sibling agent access map records APIs, agent entry points and permission boundaries for the same capability IDs. Follow the shared map contract when maintaining either map.

The chat scenario catalog describes how people might request these capabilities in conversation, including setup and permission branches. These are planned Product E2E journeys, not live coverage results.

IDs and references

Use the existing IDs in issues, PRs, Storybook annotations, tests, and verification evidence:

Reference Example Defined by
Feature ID onboarding The recipe filename without .md.
Capability ID onboarding/company The feature ID plus a key from its Sub-features list, separated by /.
Entry-point reference onboarding.md#web-wizard The recipe filename plus its entry-point heading. The local entry-point ID is web-wizard.

For example, report verifying onboarding/company through web-wizard. Capabilities describe behavior; entry points identify the surface used to exercise it. Entry-point IDs are separate from generated capability IDs. Both maps and Storybook use the same full capability IDs. Each child page states its feature ID; recipe bullets show the full capability ID beside the local key, and access companions show it beneath the local heading. Local keys remain unchanged for parsing and existing anchors.

Keep recipe filenames, sub-feature keys, and entry-point keys stable when changing display titles or navigation. Renaming a filename or key changes its references. The section headings below are navigation labels, not additional IDs.

Browse features

Use this index to open a recipe or copy its feature and full capability IDs.

Getting started and access

Feature ID Recipe Capability IDs
onboarding Onboarding and first work onboarding/instance, onboarding/company, onboarding/adapter, onboarding/first-task, onboarding/resume
access Login, invitations, and access access/login, access/invitations, access/membership, access/resources, access/cli-auth
companies Companies and portability companies/selection, companies/identity, companies/decision-models, companies/prompt-injection-prevention, companies/fast-responses, companies/agent-observability, companies/archive, companies/portability

Tasks and conversations

Feature ID Recipe Capability IDs
tasks Task creation and lifecycle tasks/create, tasks/organize, tasks/properties, tasks/discussion, tasks/completion, tasks/privacy
task-coordination Delegation, dependencies, and signoff task-coordination/delegation, task-coordination/dependencies, task-coordination/signoff, task-coordination/tree-control
inbox-search Inbox, decisions, and search inbox-search/views, inbox-search/triage, inbox-search/decisions, inbox-search/search, inbox-search/toasts
agent-chat Agent conversations and project handoff agent-chat/discovery, agent-chat/history, agent-chat/handoff, agent-chat/conference-room
questions-and-approvals Questions and approvals questions-and-approvals/questions, questions-and-approvals/dismiss-and-reopen, questions-and-approvals/confirmations, questions-and-approvals/plan-review, questions-and-approvals/audience, questions-and-approvals/governance, questions-and-approvals/tool-review, questions-and-approvals/continuation
steering Steering and queued messages steering/queue, steering/edit-order-discard, steering/steer, steering/interrupt, steering/stop-and-pause, steering/drafts, steering/approval-queue
documents-artifacts Documents, attachments, and work products documents-artifacts/documents, documents-artifacts/annotations, documents-artifacts/attachments, documents-artifacts/work-products, documents-artifacts/library

Agents and reusable capabilities

Feature ID Recipe Capability IDs
agents Hiring, configuration, and organization agents/hire, agents/grok-bot, agents/instructions, agents/organization, agents/primary-agent, agents/lifecycle, agents/built-in, agents/api-keys, agents/managed-agent-setup
runs-adapters Runs, harnesses, and model accounts runs-adapters/availability, runs-adapters/validation, runs-adapters/runs, runs-adapters/session
skills Skills and Skill Studio skills/discovery, skills/authoring, skills/versions, skills/policy, skills/testing
teams Team packages and installation teams/discovery, teams/preview, teams/install, teams/configuration

Projects and execution

Feature ID Recipe Capability IDs
projects Projects and repositories projects/lifecycle, projects/task-context, projects/repositories, projects/defaults, projects/privacy
goals Goals and work alignment goals/hierarchy, goals/alignment, goals/navigation
workspaces Workspaces, services, and files workspaces/binding, workspaces/provisioning, workspaces/services, workspaces/files-git, workspaces/closure
execution-environments Execution environments execution-environments/configuration, execution-environments/capabilities, execution-environments/probe, execution-environments/assignment, execution-environments/images
recovery Recovery recovery/diagnosis, recovery/bounded-continuation, recovery/source-action, recovery/exhaustion, recovery/workspace, recovery/unknown-outcome, recovery/user-continuation, recovery/reconnect

Apps, channels, and extensions

Feature ID Recipe Capability IDs
connection-setup Connection setup connection-setup/catalog, connection-setup/identity-and-access, connection-setup/credentials, connection-setup/handoff, connection-setup/draft-recovery, connection-setup/task-request, connection-setup/channel-setup, connection-setup/failure
assistant-connections Assistant connections (MCP) assistant-connections/setup, assistant-connections/consent, assistant-connections/device-login, assistant-connections/client-use, assistant-connections/revocation
app-permissions App access and action permissions app-permissions/agent-access, app-permissions/action-policy, app-permissions/catalog-change, app-permissions/test-action, app-permissions/account-maintenance
chat-channels External chat and email chat-channels/providers, chat-channels/identity, chat-channels/conversation, chat-channels/attachments, chat-channels/lifecycle, chat-channels/outbound-email
gateways-profiles Tool gateways and access profiles gateways-profiles/gateway, gateways-profiles/profiles, gateways-profiles/client-connect, gateways-profiles/tokens, gateways-profiles/activity
secrets Secrets and proposals secrets/company-secrets, secrets/user-secrets, secrets/proposals, secrets/vault-import, secrets/runtime-delivery
plugins Plugins plugins/installation, plugins/configuration, plugins/contributions, plugins/lifecycle

Automation and structured work

Feature ID Recipe Capability IDs
routines Routines, schedules, and triggers routines/definition, routines/triggers, routines/run-now, routines/history, routines/management
cases Cases cases/browse, cases/structure, cases/history, cases/task-links, cases/handoffs
status-cards Status cards status-cards/authoring, status-cards/generation, status-cards/inspection, status-cards/archive

Oversight and operation

Feature ID Recipe Capability IDs
budgets-costs Costs and budgets budgets-costs/cost-reporting, budgets-costs/budgets, budgets-costs/incidents, budgets-costs/resolution, budgets-costs/subscriptions, budgets-costs/accounting-recovery
activity Dashboards and audit trails activity/overview, activity/activity, activity/runs, activity/routine-audit, activity/timeline, activity/agent-commentary
navigation-preferences Navigation, profile, and announcements navigation-preferences/navigation, navigation-preferences/preferences, navigation-preferences/profile, navigation-preferences/announcements, navigation-preferences/fallbacks, navigation-preferences/command-palette
instance-operations Instance operations instance-operations/install-update, instance-operations/server-service, instance-operations/configuration, instance-operations/diagnostics, instance-operations/backup, instance-operations/runtime-setup
cli-operations CLI/API and local worktrees cli-operations/context, cli-operations/domain-commands, cli-operations/outputs, cli-operations/run-controls, cli-operations/worktree-instances, cli-operations/feedback-export

Contributor surfaces

Feature ID Recipe Capability IDs
developer-labs Developer previews and diagnostic labs developer-labs/design, developer-labs/interaction-labs, developer-labs/performance, developer-labs/route-gates

Open the published Storybook guide for the assembled feature and capability index. The Markdown recipes in this directory are the authored source. Each has a same-named agent-access companion.

Run node scripts/storybook-catalog.mjs to generate local navigation in maps/generated/feature-map.md, maps/generated/agent-access-map.md, and the Storybook guide. Recipes are discovered automatically from their navigation metadata; generation does not depend on this high-level index.

Before driving a journey

  1. Use this checkout's isolated test drive for manual product checks. It creates a temporary instance and prints its URL and data directory. Do not guess that a server on port 3100 belongs to you.
  2. Record the commit, URL, company, login role, relevant experimental settings, adapter, runtime mode, and live versus simulated dependencies. Use disposable tasks and provider resources. A fresh test drive creates a company and CEO, but no task or first run.
  3. Use the current navigation and company prefix. Paths in recipes omit that prefix. Record whether the streamlined or production shell is selected; Agent Chat, chat connectors, and the combined Inbox/Tasks view have separate gates. A hidden surface is an unmet prerequisite, not a successful test.
  4. Run the smallest relevant test first. Vitest commands below run from the repository root after installing dependencies. Playwright recipes use their named configuration and its isolated environment, not an unrelated running instance. Reserve expensive runner/provider tests for the behavior at issue.
  5. Exercise the actual user action, inspect its result, reload, and verify the persisted state or continuation. Use read-only API checks to corroborate UI evidence; creating state through the API does not prove the creation UI.

For agent-driven acceptance work, start with the Paperclip verification skill for an isolated launch, ownership/readiness checks, browser driving, evidence, and cleanup. It uses this directory as its feature map. The existing dev-workspace run/verify skill and evaluation skill describe runtime ownership and evidence handling. Reuse them; this map introduces no environment launcher, credentials, scheduled job, or second test framework.

Evidence contract

Report each entry point as passed, failed, blocked (with its missing prerequisite), or not run. Include the feature ID, full capability IDs and entry-point ID (for example, onboarding/company through web-wizard), plus the recipe link, commit/environment, user action, expected and observed result, command/exit code, and evidence links. Screenshots or traces should show both the action and the discriminating result. Include task/run/request IDs when relevant, without secrets.

A fix is verified across its affected surfaces only when each has evidence or an explicit reason it does not apply. Shared code alone does not prove parity. Keep product regressions visible; do not change the recipe to bless a failure. For Paperclip-assigned work, attach evidence through the artifact workflow.

Inventory and remaining depth

The generated maps/generated/coverage.json lists the current non-test TSX page modules and the recipes that directly reference each one. An unreferenced module is a documentation candidate, not proof that its feature is absent or untested. Remaining workflow limits live in each recipe. Inventory and example associations describe documentation scope, not runtime health.

Maintaining the reference

The map documents user journeys. It does not execute them automatically; generated inventories record documentation scope rather than live test health. Product E2E reports reuse these capability IDs through the journey associations. Their coverage view shows which scenarios in a campaign are linked to each capability and the associated test results. An association or passing scenario does not certify the whole capability; unselected and unmapped journeys remain distinct.

When maintaining a recipe, compare its entry points and expected results with the current source. Check that linked tests still exercise the stated behavior and that local references still exist. Keep the same-named agent access companion and stable sub-feature IDs aligned when behavior or access changes. Source-only access inventory remains distinct from live verification. Run node scripts/check-maps.mjs after map edits for structural/reference checks; follow the shared contract for the source and behavioral checks it cannot perform.

Each recipe starts with a small frontmatter navigation record, then an H1:

---
navigation: {"section":"Tasks and conversations","sectionOrder":20,"order":10}
---

The H1 supplies the feature title, and the first paragraph supplies its summary. Orders are local to the section; leave gaps for additions. Equal orders use the stable filename as a tie-breaker. Keep a section's name/order consistent across its recipes. Discovery uses the recipe and companion; keep the readable ID index above aligned when features or capability IDs change.

Optional ### Storybook verification guidance lives inside the recipe's Gotchas section. Each level-four heading contains a backtick-quoted capability key and has Scope (ui, cli, or browser), Storybook, Production, and Sources fields. These are verification instructions and intentional scope limits, not run results or a required story for every API. The generated gap report combines this guidance with current story associations.

After frontmatter, each recipe starts with an H1 and a user-visible description, then exactly:

  1. Sub-features — stable backticked local keys, full capability IDs, and observable behavior/states, such as - `company`: `onboarding/company` — create a company.
  2. How to get to it (user POV) — one H3 backticked entry-point ID per surface.
  3. Driving it with — starts with Preconditions:; repeat each entry-point H3, with Automated: and Manual: paragraphs. Name test scope and gaps honestly.
  4. Gotchas — misleading look-alikes, feature gates, and invalid evidence.

New or updated entries follow Poteto's feature-map examples. Existing entries with a Driving it heading can adopt the named harness when their recipes are updated. The original format was inspired by Omnigent's feature map. Paperclip's recipes and checks follow its own task model and test infrastructure.