v-code-diff
v-code-diff copied to clipboard
bundle size critically high
Hey, I've been using the package with great success, but I ran into a slight concern.
I isolated the component down to lazy loading it by doing something like :
const CodeDiff = defineAsyncComponent(() =>
import('v-code-diff').then(({ CodeDiff }) => CodeDiff)
);
But when building and minifying the app, Rollup and Vite still complain about minified chunk for the v-code-diff code to be over 1000KB.
Is there a possibility to reduce the component size ?
Thanks a lot!
Hmm.... one possible way is to import only the few necessary highlighting language plugins. If the users need other highlighting language, they can import more highlighting language plugins by themselves, I will give it a try in this way. Does this way work for you?
I dont even have highlighting turned on. Are language highlighting plugins always imported ? even with highlighting turned off ? that would explain 🤔 If i could have the diff component without any highlighting, or on-demand, maybe that would make the bundle much lighter ?
I dont even have highlighting turned on. Are language highlighting plugins always imported ? even with highlighting turned off ? that would explain 🤔 If i could have the diff component without any highlighting, or on-demand, maybe that would make the bundle much lighter ?
I apologize for ignoring this issue before. Yes, at the time, all language highlighting plugins would be loaded by default, which resulted in a large bundle size. In the new version, I have improved this by only supporting a limited number of commonly used languages by default, and users can import as needed, which should make their bundles lighter.
heya :) no worries I happen to not be working at the company i used the package at. Hopefully they upgrade their dependencies and get optimized size :)
You can close this issue i think 👍
ok. Have a great day!