I'm using LESS for creating CSS and I'm considering using something like grunt-render on the server side in order to only load the CSS / JS that is needed for that page.My goal is to reduce overhead for page load.My CSS is fairly big, but I wonder; Will it matter if my CSS is minimized anyway? Will a few bytes less make any difference?
Dynamically load CSS
css;javascript;performance
Yes and no. Yes: smaller files of course == faster download. But no: Unless your CSS is just completely out of control, it is likely smaller than the average image on your site. Plus, it will be cached after the first page load. If you're looking for a speed uptick, there are better ways to spend your time optimizing your site. In no particular order (other than images being a biggy):optimizing images (there are grunt tasks for this too)switching icons to a font (fewer server requests) and using CSS sprites for the rest (grunt! https://github.com/filamentgroup/grunticon and https://github.com/Ensighten/grunt-spritesmith)minifying and concatenating css/js filesmove js calls to the footeroptimizing your JS - manipulate and query the DOM as little as possible. This wont help load but can have a serious impact on performance. optimizing your CSS (I've noticed that LESS' nesting conveniences cause me to write far less efficient CSS selectors but in the end, this is probably trivial)use CDNs for libraries as visitors may already have them cached and you can get more concurrent asset loading in the browser (actually not sure if the concurrency thing is actually still true in 2014!)setting up your server with gzip and proper expire headers...jeez, a lot of thingshttps://developers.google.com/speed/articles/