Reference JavaScript and CSS from the site

Question

I want to know what's the best practice to reference JS and CSS files in a site collection. What is the benefit of using CSS Registration than using , and using ScriptLink over tag?

If I have an .html page, I won't be using CSS Registration and Script link as they are server controls only, so am I wrong if I choose to reference my files using link and script html tags?

Second question: Is there any benefit from referencing the JS and CSS files from the site collection rather than from the server and storing them there? I would need my files to be fresh everytime they are referenced, and under the server, they will always have the ?rev added to them. What's the best practice in this case?

Answer 1

CSS Registration is some benefit over normal link... CSSRegistration had some extra properties which can be used based on requirement.

1.You can use After property to make sure you CSS file is loaded after a particular file is loaded. E.g. After="corev4.css"

2. You can also use Conditional Expression to load specific css file only for specific browser... E.gl. ConditionalExpression="IE 9", this will create conditional statement in html like below.

   Special instructions for IE 6 here

If you have .html file you have no other option but to use link only.

Regarding Second question - this depends on you requirement, storing files on server will not give you flexibility of easy deployment. You would need to give access to server for deployment. If you store in site collection, site collection admin or user with rights can upload file easily. Your development/debugging time will also be saved up to some extent.. But yes storing files on server gives you advantage on performance...because files stored in site collection will be stored in content database.

But we have one more option to use BLOB storage, so that only first request will go to content database and store file in physical server then from subsequent request files will be served from physical server.

Enable BLOB Cache through powershell

Enalbe BLOB Cache through IIS/web.config