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.
I vote for using css classes in separate file :
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.
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.