Enable Composite Files and Minify CSS and JS in DNN

Here's how you can enable composite files and minify CSS and JS in DNN.

Pre-requisites

For your CSS and JS, you need to use the Client Dependancy Framework to load CSS and JS through your skin and modules. You can learn more about that here: https://www.dnnsoftware.com/wiki/client-resource-management-api

The basic gist of it is this:

1. Include this in the head of your skin: 
   <%@ Register TagPrefix="dnn" Namespace="DotNetNuke.Web.Client.ClientResourceManagement" Assembly="DotNetNuke.Web.Client" %>
2. Load your CSS like this: 
   <dnn:DnnCssInclude runat="server" FilePath="DNNMega/dnnmega.css" PathNameAlias="SkinPath" />
3. Load your JS like this: 
   <dnn:DnnJsInclude runat="server" FilePath="~/Resources/Shared/Scripts/jquery/jquery.hoverIntent.min.js" />

Once you have your resources loading properly in your DNN Theme / Skin, DNN knows how to properly compress and minify them. Now you simply follow these instructions to turn on composite files and minification:

1. Log in with your SuperUser account
2. In the control panel, hover over the Settings (gear) icon
3. Click "Servers"
4. Click the "Server Settings" tab
5. Click the "Performance" sub-tab
6. At the bottom there is "Client Resource Management"
7. Choose either the "Global" radio button (if it's for all sites on the instance) or the radio button for your one specific site
8. Toggle "Enable Composite Files" on
9. Toggle "Minify CSS" on
10. Toggle "Minify JS" on
11. Click Save
12. Once the page refreshes, click "Increment Version"
13. Test, test, and test again*

* Sometimes things can go wrong with composite and minified files. Dependencies get out of order, maybe a third party module breaks. It's super important to review all the pages and the functionality of your website.