📌 Description
src/pages/Analytics.tsx recomputes the selected-period dataset and derived
metrics on every render, and the chart token sync via MutationObserver can
trigger extra renders. This issue memoizes the period selection and derived KPI
values so the recharts subtree only re-renders when inputs actually change.
🎯 Requirements and Context
- Wrap period-data selection and KPI derivations in
useMemo keyed on period and
tokens.
- Stabilize callback identities passed to chart children with
useCallback.
- No change to displayed values; verify with render-count assertions.
🛠️ Suggested Execution
1. Fork the repo and create a branch
git checkout -b perf/analytics-memo
2. Implement changes
- Update
src/pages/Analytics.tsx.
- Tests: extend
src/pages/__tests__/Analytics.test.tsx asserting stable output
and reduced re-computation.
- Docs: extend
docs/PERFORMANCE.md.
3. Test and commit
- Run
npm test.
- Cover edge cases: period switch recomputes once, theme change recomputes
tokens only, identical inputs skip recompute.
Example commit message
perf: memoize Analytics period selection and derived KPIs
✅ Guidelines
- Minimum 95% test coverage on the new/changed lines.
- No change to displayed metrics.
- Timeframe: 96 hours.
🏷️ Labels
type-performance · area-frontend · MAYBE REWARDED · GRANTFOX OSS · OFFICIAL CAMPAIGN
💬 Community & Support
- Join the Disciplr contributor Discord to coordinate, ask questions, and get
unblocked fast: https://discord.gg/xvNAvMJf
- Please introduce yourself in the channel before you start so we can avoid
duplicate work, pair you with a reviewer, and get your PR merged quickly.
- Maintainers actively triage this channel and aim for fast, clear, respectful
reviews — reach out any time you're blocked.
📌 Description
src/pages/Analytics.tsxrecomputes the selected-period dataset and derivedmetrics on every render, and the chart token sync via MutationObserver can
trigger extra renders. This issue memoizes the period selection and derived KPI
values so the recharts subtree only re-renders when inputs actually change.
🎯 Requirements and Context
useMemokeyed on period andtokens.
useCallback.🛠️ Suggested Execution
1. Fork the repo and create a branch
2. Implement changes
src/pages/Analytics.tsx.src/pages/__tests__/Analytics.test.tsxasserting stable outputand reduced re-computation.
docs/PERFORMANCE.md.3. Test and commit
npm test.tokens only, identical inputs skip recompute.
Example commit message
✅ Guidelines
🏷️ Labels
type-performance·area-frontend·MAYBE REWARDED·GRANTFOX OSS·OFFICIAL CAMPAIGN💬 Community & Support
unblocked fast: https://discord.gg/xvNAvMJf
duplicate work, pair you with a reviewer, and get your PR merged quickly.
reviews — reach out any time you're blocked.