: Optimizing for load time VS staying organized I am working on several projects where I often have to make small changes. Now I know it is important to have a fast loading page, but as a

@Angie530

I always lean towards keeping multiple, organized files for CSS or Javascript, even though it may create more connection overhead through multiple HTTP requests.

I've come to this conclusion by weighing the different resources at stake; mainly, bandwidth vs. developer time.

I'm only one guy, and I have a lot on my plate. Keeping everything separate and organized means less time rooting through minimized blobs of CSS or JS, and more time improving the web sites I maintain.

Besides, things like HTTP compression make a much bigger impact, in my experience, than optimizing the last byte out of your code and preventing a request or two. Keep things lean where you can, but don't drive yourself nuts in the process!

Vote Up Vote Down

@Shanna517

Just keep 2 versions of file


for developing
for production


and minify your developing version everytime you update something

Vote Up Vote Down

@Cody1181609

Are you using a CMS? Many of them have plugins that will let you reference multiple CSS/JS files in your template or theme setup, but then automatically combine and minify them for you on render(WordPress; I think Drupal does this in core now with an option). Sometimes the function is built into a more general caching plugin.

In Movable Type, I have CSS and JS resources stashed as several modules that are then included in an index template for output as a single static file.

CSS preprocessors like Sass can also usually do this for you, either by watching entire directories of source files, or with import functions.

Any development framework should have a mixin/module/whatevertheirtermis to do this, but there are also standalone implementations you can just bolt directly onto any site.

Vote Up Vote Down