Conversation
this is possible now that we got rid of SCSS
we no longer support IE11 so these are safe to use
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #6654 +/- ##
==========================================
+ Coverage 94.17% 94.26% +0.09%
==========================================
Files 494 496 +2
Lines 41644 42442 +798
Branches 4819 4858 +39
==========================================
+ Hits 39218 40009 +791
- Misses 2421 2428 +7
Partials 5 5 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Collaborator
Author
|
@ckifer I can break this down to smaller PRs if you prefer. There are couple of changes that could go out on its own. |
Bundle ReportChanges will increase total bundle size by 6.26kB (0.24%) ⬆️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: recharts/bundle-cjsAssets Changed:
view changes for bundle: recharts/bundle-umdAssets Changed:
view changes for bundle: recharts/bundle-es6Assets Changed:
|
ckifer
approved these changes
Nov 18, 2025
Member
|
easy enough review, all good. LGTM |
7 tasks
ckifer
pushed a commit
that referenced
this pull request
Nov 24, 2025
…6677) ## Description `eslint-plugin-react-perf` was incorrectly placed in `dependencies` instead of `devDependencies`, causing the entire ESLint toolchain to be installed in downstream projects using Recharts. The plugin is only used in `eslint.config.mjs` for enforcing performance rules during development: ```javascript const perfOptimization = { name: 'perf-optimization-examples', files: ['./www/src/docs/exampleComponents/LineChart/CompareTwoLines.tsx'], plugins: { 'react-perf': reactPerf }, rules: { 'react-perf/jsx-no-new-array-as-prop': 'error', 'react-perf/jsx-no-new-function-as-prop': 'error', 'react-perf/jsx-no-jsx-as-prop': 'error', }, }; ``` ## Related Issue Fixes #6675 ## Motivation and Context Production applications should not install development-only tooling. Moving this to `devDependencies` prevents unnecessary bloat in downstream projects while maintaining functionality for Recharts development. ## How Has This Been Tested? - Verified linting works: `npm run lint` - Verified build completes: `npm run build` - All unit tests pass: 3437 tests ## Screenshots (if appropriate): N/A ## Types of changes - [x] Bug fix (non-breaking change which fixes an issue) - [ ] New feature (non-breaking change which adds functionality) - [ ] Breaking change (fix or feature that would cause existing functionality to change) ## Checklist: - [ ] My change requires a change to the documentation. - [ ] I have updated the documentation accordingly. - [ ] I have added tests to cover my changes. - [ ] I have added a storybook story or VR test, or extended an existing story or VR test to show my changes <!-- START COPILOT CODING AGENT SUFFIX --> <details> <summary>Original prompt</summary> > > ---- > > *This section details on the original issue you should resolve* > > <issue_title>[3.5.0] recharts now installs eslint-plugin-react-perf</issue_title> > <issue_description>## What is the current behavior? > > `recharts@3.5.0` has `eslint-plugin-react-perf` as a dependncy. > It was added by #6654 > This causes this dependency, and entire eslint toolchain, to get installed in downstream projects > > ## What is the expected behavior? > > `eslint-plugin-react-perf` should be a devDependency, as it's only used by repository's own development flow. > > ## Steps to reproduce > > ``` > mkdir recharts-eslint-dep > cd recharts-eslint-dep > npm init -y > npm i recharts > npm why eslint > ```</issue_description> > > ## Comments on the Issue (you are @copilot in this section) > > <comments> > <comment_new><author>@PavelVanecek</author><body> > Thanks @AviVahl yeah this definitely should have been a devdependency.</body></comment_new> > </comments> > </details> - Fixes #6675 <!-- START COPILOT CODING AGENT TIPS --> --- 💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more [Copilot coding agent tips](https://gh.io/copilot-coding-agent-tips) in the docs. --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: PavelVanecek <1100170+PavelVanecek@users.noreply.github.com>
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
2 participants
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.
Description
In #6624 and other issues I noticed that people tend to define things inline - which is no surprise because our docs and examples recommend that too.
We can memoize the object props with a small custom method so I did that, looks like it works well.
We can't do much with inline functions and inline elements, memoization won't work there. v2 just plain ignores them which I don't think we want to do anymore.
So I found this react perf plugin which flags exactly what we need so I added it too and ran against this one example.
Plus some supporting changes in the website navigation list, and allowing some syntax in ESLint config.
I will later summarize it in a perf guide, but that will be in next PR.
Related Issue
#6624
How Has This Been Tested?
Devtools
Before & after video (with 6x slowdown)
Screen.Recording.2025-11-18.at.23.29.38.mov
One render cycle during mouse move
Before - notice the high animation count - it was re-calculating the animation on each mouse move. Also, multiple components render again and again.
After - notice low animation count, and most components never render. Other than Tooltip and ReferenceLine which have to render because they change position on mouse move.
Types of changes
Checklist: