CODEWITHSUNDEEP
cssvuejs2
Philipp Mochine
Philipp Mochine

Reputation: 4705

Reduce CSS Loading Time by using Vue Style?

I'm not even sure if it reduces the loading time, but if you use several Vue components do you write your (S)CSS in the Vue Component or do you still write it in Modules of e.g. Webpack?

I imagine that using the CSS in Vue, the browser doesn't need to load everything only if the specific Component is needed. On the other hand the main.js is getting bigger and bigger.

So what would you do? I'm curious

Upvotes: 0

Views: 157

Answers (1)

Jayem163
Jayem163

Reputation: 110

Writing the css in the component would, I suppose, make it so there there is one less file for the server to serve so you might save a extremely small amount of load time but even if you had a dial-up connection I can't imagine it would be noticeable.

I would really never do it unless the css was extremely simple. Having the css in a separate file just gives you so many benefits - basically all the benefits of decoupling: re-usability, structural clarity, maintainability, etc.

It's hard to imagine an application that would benefit from a couple of milliseconds of load time for a user. And to be honest you might not even get that - you'd have to run some speed tests. But I wouldn't - I'd just use a separate css file unless your serving your website from a smart toaster or something.

Upvotes: 1

Related Questions