Don’t know what to tell you. This is an actual web application that has seen four years of development, a migration from vanilla Vue.js 2, to Nuxt, then an integration of Vuetify 2 (which is about the worst library I have ever had the misfortune of working with, and has a giant amount of runtime dependencies).
I wouldn’t say it’s too many modules. We heavily use code splitting, so most of the time, users will fetch only a few of these, and pages load quickly. Plus, there’s some dependencies we cannot get rid of that are quite heavy.
From my personal experience though, it’s nothing unusual really.
Do you have an idea of what kind of functionality all of those deps provide? It would be interesting to see a breakdown of where dep bloat typically comes from.
Yes, I just cannot share the flame graph publicly, but I can describe parts of it. A big chunk is taken up by the Mapbox GL SDK (Vector maps, 35%), Sentry (Telemetry and monitoring, 14%), and Vuetify (component framework, 10%). The rest are small dependencies and application code.
Sure did. We're completely locked in because Vuetify encourages you to use their components for everything from layouts to buttons, their styles are written in sass and depend on an outdated version of dart-sass, and use a half-assed version of Tailwind utility classes that creates conflicts on every level.
And since they rewrote the framework completely for Vue 3, and took special care to make sure that every single darn prop is different, a migration is pretty much impossible without touching absolutely everything.
The only way out for us will be to get rid of vuetify components, one at a time, and introduce Tailwind with a prefix, until we can finally remove that mess.
The biggest recommendation I have is to stay away as far as you can from that library. I think that has been the worst technical decision I ever made at my job.
> Vue.js 2, to Nuxt, then an integration of Vuetify 2 (which is about the worst library I have ever had the misfortune of working with, and has a giant amount of runtime dependencies).
This is my experience with Vue overall, not just it's shitty ecosystem and libraries.
I wouldn’t say it’s too many modules. We heavily use code splitting, so most of the time, users will fetch only a few of these, and pages load quickly. Plus, there’s some dependencies we cannot get rid of that are quite heavy.
From my personal experience though, it’s nothing unusual really.