Open
Conversation
Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com>
Copilot
AI
changed the title
[WIP] Chart library 최적화 및 통합 구현
chore: replace react-chartjs-2/chart.js with lightweight custom SVG chart library
Mar 20, 2026
🚀 Preview Deployment
|
… comparison Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/10d1c785-dec8-4385-93f9-2227e6cbe889
Copilot
AI
changed the title
chore: replace react-chartjs-2/chart.js with lightweight custom SVG chart library
feat: chart.js/react-chartjs-2 제거 + 커스텀 SVG 차트 라이브러리 도입 + uplot/visx 번들 크기 POC
Mar 21, 2026
…dle size comparison" This reverts commit 78ba46e.
…rison POC Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/2be2daf4-40d0-405f-9fd3-1f36f9bb3f38
Copilot
AI
changed the title
feat: chart.js/react-chartjs-2 제거 + 커스텀 SVG 차트 라이브러리 도입 + uplot/visx 번들 크기 POC
feat: replace @allcll/chart with visx in client — bundle size POC
Mar 21, 2026
…ze comparison POC" This reverts commit f2989ae.
…adability Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/6aa13c00-bb5a-4ed4-8267-9a6ca54dcac9
Copilot
AI
changed the title
feat: replace @allcll/chart with visx in client — bundle size POC
refactor(@allcll/chart): extract shared internals, memoize SVG computations, improve maintainability
Mar 21, 2026
…ayout fixes Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/50c3a544-1335-4bef-b126-dce519f5a67d
Copilot
AI
changed the title
refactor(@allcll/chart): extract shared internals, memoize SVG computations, improve maintainability
feat(@allcll/chart): entry animations, dark tooltip, legend toggle, RadarChart overflow & MixedChart layout fixes
Mar 21, 2026
…arChart overflow fix Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/2ca75e12-45e8-44e0-be77-5fc7ab1b74a4
Copilot
AI
changed the title
feat(@allcll/chart): entry animations, dark tooltip, legend toggle, RadarChart overflow & MixedChart layout fixes
feat(@allcll/chart): value-based entry/update animations + RadarChart overflow fix
Mar 22, 2026
Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/20284ed7-8e56-426d-bbbc-c6c38a4b964e
Copilot
AI
changed the title
fix(DoughnutChart): value-based chart animations and full-circle arc rendering bug
refactor(chart): accessibility, stable keys, and depth reduction
Mar 24, 2026
Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/e8b26908-1370-4f5d-95ce-6f498962e2c8
…into copilot/optimize-chart-library
Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/f93d8048-62da-44cf-bac4-e4c2eafb1aa8
…into copilot/optimize-chart-library
Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/44e3eec1-109d-4ce7-b62b-66a6c2a0107f
Copilot stopped work on behalf of
hyunwoo0081 due to an error
March 25, 2026 15:43
Co-authored-by: hyunwoo0081 <76638365+hyunwoo0081@users.noreply.github.com> Agent-Logs-Url: https://github.com/allcll/allcll-frontend/sessions/7423d3a9-9dfe-4d78-b5ea-143b3d2d7860
|
hyunwoo0081
changed the title
hyunwoo0081
approved these changes
Apr 14, 2026
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 59b7c3fd1c
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
Comment on lines
+27
to
+28
| function MixedChart({ data, options }: MixedChartProps) { | ||
| return <Chart type="bar" data={data} options={options} />; |
There was a problem hiding this comment.
StatisticsChart now passes height={288}, but this wrapper drops that prop when the lazy chunk resolves because MixedChart only accepts { data, options } and renders <Chart> without forwarding sizing props. This means the fallback skeleton honors the height while the real chart does not, causing avoidable layout shift and inconsistent chart sizing after load.
Useful? React with 👍 / 👎.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
개요
ALLCLL 서비스 내 차트 컴포넌트들의 성능을 최적화하고, 프로젝트 아키텍처를 견고하게 개선하기 위한 리팩토링입니다.
@allcll/charts패키지를 독립적으로 고도화하고, 각 애플리케이션의 번들 최적화를 수행했습니다.🚀 배경
현재 ALLCLL에서 차트(chart.js)는 다음과 같은 문제가 있었습니다.
📦 차트 라이브러리(chart.js, react-chartjs-2)가 번들에 포함되어 초기 로딩이 무거움
🔁 여러 페이지에서 동일 라이브러리를 중복 로딩
⚙️ 차트 사용할 때마다 Suspense 설정 필요 (개발 불편)
🚀 주요 변경 사항
1. @allcll/charts 패키지 분리
React.lazy와Suspense를 내장했습니다.2. 코드 스플리팅 - 번들 최적화 (Manual Chunks)
admin및client패키지의vite.config.ts에manualChunks설정을 추가chart.js와react-chartjs-2를vendor-chartjs청크로 강제 분리하여, 페이지 간 중복 로딩을 줄이고 캐싱 효율을 극대화3. 이미지 크기 최적화 (레이아웃 이동 방지)
packages/client/src/widgets/home/ui/MainBanner.tsx: spring-banner-min.png 이미지에width={740}height={788}속성 추가 (CLS 방지)w-[320px] lg:w-[370px])는 유지, height는 브라우저가 aspect-ratio로 자동 계산packages/client/src/shared/ui/Image.tsx:width/height는 이미React.ImgHTMLAttributes로 지원됨 (변경 불필요)4. (참고) index.html 탭 변경
⚙️ 아키텍처 개선 효과
Suspense설정 없이 컴포넌트만 사용해도 자동으로 성능 최적화가 적용됩니다.client패키지가 외부 라이브러리 타입에 직접 의존하지 않게 되어, 향후 라이브러리 교체 시 영향 범위가 대폭 줄어들었습니다.인프라 변화
Original prompt
📱 Kick off Copilot coding agent tasks wherever you are with GitHub Mobile, available on iOS and Android.