perf: reuse WBS badge shells and skip metadata grid rerenders

[seonghobae]

Buyer impact

Large ScopeWeave plans no longer rebuild the full task grid when a user changes only project metadata. This slice keeps project-name persistence on a metadata-only render path, reuses immutable owner/status DOM shells, preserves per-row data isolation, and keeps the performance guard executable in CI without making the documented local cloud-E2E command depend on GitHub benchmark authority.

Refs #409.

Exact current identity

• protected live base: develop@2c328875e00e86537df3e965170be80532571cad;
• exact contributor head: 9c2cc0b9acf1d3ef234612088ab0fbdf108252f5;
• exact contributor tree: 659e5ad2657f2222b35929e9c20e07a624bcd84d;
• synthetic GitHub PR merge revision: d7e5a89a5a338b5bb9a2773017453eeb0dd72412;
• branch: perf/dom-template-cache-current-develop;
• Ready/non-Draft and mechanically mergeable at the latest fresh refetch;
• every currently enumerated inline review thread is resolved; and
• no qualifying independent current-head/last-push approval exists.

Any head/base/review/check movement invalidates revision-sensitive evidence until freshly revalidated. This body is traceability, not merge authority.

Root-cause repair and implementation contract

The original cache-only optimization reduced element creation but did not address the dominant invalidation path: project-name edits still rebuilt the full task grid. The current implementation separates metadata-only persistence from base-date/full-plan rendering.

• renderAll({ metadataOnly: true }) refreshes project metadata and returns before metric, analytics, and task-grid work; base-date and normal renders retain the complete path.
• owner/status caches retain immutable DOM shells only; row text, title, accessible name, validation state, selected value, and task identity are applied after cloning.
• owner colors use deterministic owner-badge--color-N classes rather than inline style.
• all 20 owner-badge palette entries now meet the registered 4.5:1 normal-text contrast regression against white badge text.
• the browser benchmark requires zero document.createElement() calls in every optimized metadata-edit sample and preserves task-grid DOM identity.
• cached progress selects prove clone isolation across task IDs, values, aria-invalid, and aria-describedby states.

Evidence-integrity repairs

The benchmark base resolver is shared by unit and browser paths and fails closed unless an immutable 40-hex comparison revision is available. Resolution order is explicit override -> PR base snapshot -> protected-branch push before; malformed and all-zero SHAs are rejected.

The documented local test:e2e:cloud command now runs only the cloud/toast browser suite and therefore does not require benchmark authority. The benchmark is registered separately as test:e2e:performance, and Server Tests explicitly invokes it after cloud E2E. A unit contract fails if that CI invocation is removed.

Buyer-visible performance evidence

Server Tests run 33239719025 is terminal-success. Its unit-and-api job passed the registered unit/API/eval-safe suites, and its cloud-e2e job passed both browser stages:

• cloud UI E2E: 10 passed;
• performance benchmark: 1 passed on a 5,000-row state;
• protected-base median metadata render: 4214.5 ms;
• optimized median metadata render: 93 ms;
• median improvement: 97.7933% (target >=15%);
• optimized element creation: [0, 0, 0, 0, 0] across all five samples;
• optimized task-grid DOM identity preserved on every sample; and
• edit, inline-progress, and drag behavior passed on both baseline and optimized variants.

The hosted workflow checked out synthetic merge d7e5a89a5a338b5bb9a2773017453eeb0dd72412 (9c2cc0b9... merged into 2c328875...). This is substantive merged-tree behavior evidence but is not exact-contributor-head merge authority.

Current repository workflow and review truth

For contributor head 9c2cc0b9acf1d3ef234612088ab0fbdf108252f5, all six currently associated repository workflow runs are terminal GitHub-success:

• Server Tests 33239719025;
• Fuzz 33239719008;
• SAST Semgrep 33239719009;
• Security Scan 33239719004;
• Dependency Review 33239719027; and
• OSV Scanner 33239719212.

All currently enumerated inline review threads are resolved. Historical OpenCode CHANGES_REQUESTED submissions are dismissed/predecessor-head evidence and do not transfer. Devin/CodeRabbit/GitHub Code Quality COMMENTED evidence is supplementary rather than a qualifying independent approval.

ScopeWeave #523 owns repository-native exact-head Server Tests/coverage checkout integrity. ContextualWisdomLab/.github#1222 owns organization-reusable SAST/Security exact-head checkout integrity. Synthetic, predecessor, status-only, author-only, model-only, pending, queued, skipped, neutral, absent, failed, rate-limited, or stale evidence is non-authorizing.

Remaining #409 boundary and merge gate

This slice does not close #409 merely by merging. Close the issue only after protected integration preserves the hot-path behavior and exact protected-head acceptance evidence.

Do not merge or enable auto-merge until this unchanged exact head remains reconciled to freshly resolved protected develop, applicable exact-head evidence controls are protected-shipped and regenerated, every required CI/browser-performance/owned statement-branch-function-line coverage/docstring/CodeQL/SAST/security/dependency/supply-chain/package/provenance gate is substantively terminal-passing for the correct revision, valid unresolved findings are zero, and a qualifying independent current-head/last-push approval genuinely exists under live branch protection/rulesets.

[coderabbitai]

📝 Walkthrough

Walkthrough

프로젝트 메타데이터 렌더링 경로를 분리했습니다. 담당자·상태 배지는 행별 데이터가 없는 불변 DOM 셸을 복제합니다. 고정 색상 클래스를 추가했습니다. 단위 테스트와 5,000행 Playwright 성능 벤치마크를 추가했습니다.

Changes

DOM 렌더링 최적화

Layer / File(s)	Summary
메타데이터 렌더링 분리 app.js, docs/doctoring/dom-template-cache.md	프로젝트명 변경은 메타데이터만 갱신합니다. 기준일 변경은 전체 계획을 갱신합니다. 각 입력의 blur 이벤트는 해당 디바운스를 즉시 실행합니다.
불변 배지 셸 복제 구현 app.js, styles.css, .jules/bolt.md, docs/doctoring/dom-template-cache.md, CHANGELOG.md	담당자·상태 배지를 공유 불변 셸에서 복제합니다. 복제 후 행별 텍스트, 클래스, ID, 제목, ARIA 속성을 적용합니다. 담당자 색상은 문자열 해시와 20개 고정 CSS 클래스로 결정합니다.
셸 복제 단위 검증 tests/unit/caching.test.mjs, package.json	진행률 셀의 행별 ID, 작업 ID, 선택값, 검증 속성을 확인합니다. 경고 상태가 다음 행으로 전달되지 않는지 확인합니다. 단위 테스트와 커버리지 실행 목록을 갱신했습니다.
브라우저 성능 검증 tests/e2e/render-performance.spec.js, package.json, CHANGELOG.md	5,000행 렌더링에서 시간, DOM 생성량, 메모리, long task, DOM 노드 수를 측정합니다. 편집, 인라인 진행률 변경, 드래그 정렬을 검증합니다. 기준 커밋이 있으면 동일 조건으로 성능을 비교합니다.

Estimated code review effort: 4 (Complex) | ~45 minutes

Merge Risk: 🟡 Moderate · up to b0523

The performance change avoids rebuilding the task grid for metadata-only edits, but some owner badges can render with insufficient text contrast and the select-isolation regression test does not accurately model browser defaults. Merge should wait for the contrast fix, corrected regression test, and the required independent approval.

Sequence Diagram(s)

sequenceDiagram
  participant Playwright
  participant Browser
  participant appjs
  participant DOM
  Playwright->>Browser: 5,000개 작업 데이터 주입
  Browser->>appjs: 페이지 로드 및 렌더링 실행
  appjs->>DOM: 행과 배지 DOM 셸 복제
  Playwright->>Browser: 렌더링 및 메모리 지표 수집
  Playwright->>Browser: 편집·진행률·드래그 동작 검증

Loading

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 17 functions across 3 files. (5 skipped: 5 unsupported.)	Write docstrings for the functions missing them to satisfy the coverage threshold.
Linked Issues check	❓ Inconclusive	구현과 테스트는 [#409]의 셸 복제, 행별 상태 격리, 성능 측정 목표를 반영하지만 실제 벤치마크 결과와 모든 게이트 통과는 확인되지 않습니다.	현재 head에서 5,000행 벤치마크의 다중 실행 median·p95 결과와 접근성, E2E, 단위, 보안, 커버리지 게이트 결과를 제출하십시오.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Out of Scope Changes check	✅ Passed	변경 사항은 [#409]의 DOM 캐싱, 렌더링 경로, 스타일, 테스트, 문서 범위에 있으며 서버·인증·보안 런타임 변경은 포함하지 않습니다.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	제목은 불변 배지 셸 재사용과 메타데이터 그리드 재렌더링 생략이라는 주요 변경 사항을 정확하고 간결하게 설명합니다.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch perf/dom-template-cache-current-develop

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[seonghobae]

@opencode-agent

[seonghobae]

@opencode-agent
@cwl-noema-review

Review exact clean head b47771745a204f5f391cda7f49b9295969f3aaea against live develop@b88e66e81e9701404d29a0f5de4f58573ceee14f. All six repository-native workflows are terminal-success and current review threads are empty. Verify 256-entry bounded owner/status template caches, clone-before-specialization semantics, accessible description isolation, realistic 5,000-row browser evidence, and that the seven-file replacement carries none of the superseded branch's server/auth/Clearfolio/attachment/security regressions. Publish current-head review evidence only; do not mutate or merge.

[seonghobae]

@opencode-agent
@cwl-noema-review

Request independent review for exact current head b47771745a204f5f391cda7f49b9295969f3aaea against live develop@b88e66e81e9701404d29a0f5de4f58573ceee14f. All six repository-native workflows are terminal-success and there are no unresolved review threads. Verify owner/status template caches remain clone-before-use, semantically keyed, 256-entry bounded, free of stale accessibility metadata, and the production 5,000-row benchmark reports measured evidence without fabricating a before/after speedup. Confirm the seven-file diff preserves current protected-base server/security/auth behavior. Publish current-head review evidence only; do not mutate or merge.

[coderabbitai]

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

• @coderabbitai resume to resume automatic reviews.
• @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

• ▶️ Resume reviews
• 🔍 Trigger review

📝 Walkthrough

Walkthrough

메타데이터 전용 렌더링 경로를 추가했습니다. 담당자·상태 배지는 불변 DOM 셸을 복제합니다. 고정 색상 클래스와 대비 검증을 추가했습니다. 5,000행 성능 벤치마크와 기준 커밋 검증을 추가했습니다.

Changes

DOM 렌더링 최적화

Layer / File(s)	Summary
메타데이터 렌더링 분리 app.js, docs/doctoring/dom-template-cache.md	프로젝트명 변경은 renderAll({ metadataOnly: true })를 사용합니다. 기준일 변경은 전체 렌더링을 유지합니다.
불변 배지 셸 복제 구현 app.js, styles.css, toast-state.css, .jules/bolt.md, CHANGELOG.md, docs/doctoring/dom-template-cache.md	담당자·상태 배지를 공유 셸에서 복제합니다. 복제 후 행별 텍스트, 접근성 속성, 색상 클래스를 적용합니다.
셸 복제 및 접근성 단위 검증 tests/unit/caching.test.mjs, tests/unit/owner-badge-contrast.test.mjs, package.json	행별 상태 격리, <select> 기본값, 숫자 담당자 값의 문자열화, 20개 색상 클래스의 WCAG 2.2 대비를 검증합니다.
5,000행 브라우저 성능 검증 tests/helpers/benchmark-base.mjs, tests/unit/render-performance-base.test.mjs, tests/e2e/render-performance.spec.js, package.json, .github/workflows/server-tests.yml, index.html, CHANGELOG.md, docs/doctoring/dom-template-cache.md	기준 SHA를 검증하고 현재 구현과 기준 구현의 렌더링 시간, DOM 생성량, 메모리, long task 및 편집·진행률·드래그 동작을 비교합니다.

Estimated code review effort: 4 (Complex) | ~45 minutes

Merge Risk: 🔵 Low · up to 9c2cc

The PR delivers the intended rendering performance and accessibility improvements, but one unit test should tighten its script and workflow matching so malformed benchmark configuration cannot pass unnoticed. This is a bounded, non-blocking follow-up with owner awareness.

Sequence Diagram(s)

sequenceDiagram
  participant Playwright
  participant Browser
  participant appjs
  participant DOM
  Playwright->>Browser: 5,000개 작업 데이터를 localStorage에 주입
  Browser->>appjs: 페이지 로드 및 렌더링 실행
  appjs->>DOM: 불변 담당자·상태 셸 복제
  appjs->>DOM: 행별 텍스트와 접근성 속성 적용
  Playwright->>Browser: 렌더링 및 상호작용 지표 수집
  Playwright->>Playwright: 기준 구현과 중앙값 성능 비교

Loading

🚥 Pre-merge checks | ✅ 2 | ❌ 3

❌ Failed checks (3 warnings)

Check name	Status	Explanation	Resolution
Linked Issues check	⚠️ Warning	DOM 셸 불변성, 복제 후 행별 데이터 적용, 상태 격리, 접근성 검증, 5,000행 벤치마크 요구를 대부분 반영합니다. 그러나 이슈 #409는 보안 기준선 이후 workflow 수정을 금지하며, 이 PR은 .github/workflows/server-tests.yml을 수정합니다.	이슈 #409의 범위를 준수하려면 workflow 변경을 제거하십시오. 필요한 벤치마크 실행은 기존 workflow 구조를 수정하지 않는 방식으로 제공하십시오. 또한 standalone client와 SaaS overlay의 동작 일관성을 현재 코드에서 확인하십시오.
Out of Scope Changes check	⚠️ Warning	대부분의 변경은 DOM 셸 캐싱과 벤치마크에 관련됩니다. 그러나 index.html의 cloud-sync.js 및 analytics.js modulepreload 추가는 연결된 요구사항과 직접 관련이 없습니다. workflow 수정도 이슈 #409의 명시적 범위를 벗어납니다.	index.html의 무관한 modulepreload 변경을 제거하십시오. .github/workflows/server-tests.yml 수정도 제거하거나, 이슈 요구사항과 충돌하지 않는 별도 변경으로 분리하십시오.
Docstring Coverage	⚠️ Warning	Docstring coverage is 3.85% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 26 functions across 6 files. (3 skipped: 3…	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	제목은 WBS 배지 셸 재사용과 메타데이터 그리드 재렌더링 생략이라는 PR의 주요 변경 사항을 정확하고 간결하게 설명합니다.

Full details: Docstring Coverage

Explanation

Docstring coverage is 3.85% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 26 functions across 6 files. (3 skipped: 3 unsupported.)

✨ Finishing Touches 💡 2

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🛠️ Fix failing CI checks 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch perf/dom-template-cache-current-develop

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[devin-ai-integration]

Note

This report is out of date. Scroll down for Devin Review's latest report on this PR.

Devin Review found 1 new potential issue.

Dismissed as predecessor-head-only coverage-control evidence for b3dd6e5. The current PR head is 8d11eb3, so this review cannot govern the current tree. This dismissal is not an approval and does not satisfy any current-head review gate.

[devin-ai-integration]

Note

This report is out of date. Scroll down for Devin Review's latest report on this PR.

Devin Review found 1 new potential issue.

[devin-ai-integration]

Note

This report is out of date. Scroll down for Devin Review's latest report on this PR.

Devin Review found 1 new potential issue.