What is the best practice for managing javascript and css files


How do You manage all of Your .js and .css files in asp.net project. Especially when they have a lot of dependency between each other?

I've combined all script in one. But it's become weighty, and 90% of them were not used on particular pages. What I want is an instrument or guidence to manage all of those scripts, simple dependency management, that help to include on page only those JS and CSS that needed on this page.

Also used ScriptManager nut when You use a lot of controls it's very handy.... maybe I'm using it in wrong way.

I prefer to divide my JS files based on their function - for instance, I could have a single JS file for all AJAX based interaction, one for all Validations and a common JS library for all functions that are common to the entire web application. Having a single file that combines the entire JS scripts into one would definitely slow down the application because each page would load the entire file, even though only a small portion might be relevant.

For CSS files, I prefer to have a single common stylesheet that would contain the general styles available to the entire application. I might also create individual CSS files for pages that have a very specific layout structure.

I don't know of any tools that could handle this dependency automatically, but When you divide your files according to function, this becomes unnecessary in most cases.