Is it better from performance standpoint / a more efficient use of memory to have the CSS be created with the dynamically generated HTML elements, or to have the classes predefined in a CSS file waiting to be used?

I could imagine that having CSS sitting waiting to be used could make the CSS file unnecessarily big, whereas using JS to create the CSS could be a less efficient use of memory and processing power.

Would love to hear others' thoughts on it.

CodePudding user response：

Personally, I prefer having things separate, since it's easier to find/read/update later one. Having a bunch of CSS styles mixed in with JS could make it hard to read and maintain in the long run.

I also wouldn't worry about optimization until you feel that your code is taking a while to load.

CodePudding user response：

I vote for using css classes in separate file :

1. To separate the display from the processing or the traitement
2. To be able to manage any changes in the future
3. Having the possibility to make your CSS dynamic with CSS Custom Properties
4. Possibility to use css Modules
5. Take all css advantage

CodePudding user response：

Defined in a css file, is a good practice. If you need to update the css after generating html, Then it will be a good to define in css classes.