ACTIVELY MAINTAINED • EST. 2010

DJANGO COMPRESSOR — About Django Compressor

Django Compressor (django_compressor) is a popular Python library designed to process, combine, and minify linked and inline JavaScript and/or CSS within Django templates, effectively enabling far-future expiration dates for improved performance. Originating in 2010 from Andrea Pelme's django-compress, the library has evolved to support offline compression and various precompilers.

v1.3 (2013): Dropped support for Python 2.5 and older Django settings, added precompiler class support for custom Python logic, and enhanced CssAbsoluteFilter to better handle hash fragments.

v4.0+ (2014-Present): Added Python 3 compatibility and integration for Django 1.6+. Core Functionality Evolution: It has evolved to support offline compression (via COMPRESS_OFFLINE) allowing assets to be compressed during deployment, creating a manifest.json file for superior production performance, according to the Django Compressor 2.4.1 documentation and usage docs.

// SECTION 01

Compress Logo Example Usage

Here are examples of how this is used in my project. The idea is that on a local/development environment, compression does not take place. But can easily be turned on via a single environment variable boolean to test it's functionality. On production this boolean is set to True, thus enabling it on Production and serving up the minified and consolidated assets. During deployment, one still has to run the compress management command in order to get new assets and should be included in any CI/CD Pipeline as well.

Django Compressor

Compress Logo

 Below is the bare minimum settings that will allow this package to work in both a Local and Production Environment where the Production Environment is Ubuntu with GUNICORN to serve up the Django Project and static files are stored on the actual Ubuntu Server and not some third-party like an AWS S3 Bucket or something. For third-party storages, you would need to adjust these settings to accommodate that storage system.

Settings

INSTALLED_APPS = [
    ...
    'compressor',  # Must be before django.contrib.staticfiles
    'django.contrib.staticfiles',
    ...
]

...

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static/')

# For File Compressing and Minifying
STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
    'compressor.finders.CompressorFinder',
)

COMPRESS_ENABLED = env.bool('COMPRESS', default=False)
COMPRESS_OFFLINE = env.bool('COMPRESS', default=False)

COMPRESS_ROOT = STATIC_ROOT
COMPRESS_OFFLINE_CONTEXT = {}

Templates

base_1.html

<head>
    ...
    <!-- CSS Import -->
    {% block head_stylesheets %}{% endblock %}
    ...
</head>

<body>
    <!-- Body HTML Before JS -->
    ...
    {% comment %}<!-- JavaScript Import -->{% endcomment %}
    {% block js_scripts %}{% endblock %}
</body>

info.html

{% block head_stylesheets %}
    {% compress css %}
        <link rel="stylesheet" type="text/css" href="{% static '/mikedinder/css/common.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static '/mikedinder/css/nav.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static '/mikedinder/css/hero.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static '/mikedinder/css/section1_timeline.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static '/mikedinder/css/footer.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static '/mikedinder/css/pages/contact_info.css' %}" />
    {% endcompress %}
{% endblock %}

{% block js_scripts %}
    {% compress js %}
        <script src="{% static '/mikedinder/js/theme.js' %}"></script>
    {% endcompress %}
{% endblock %}

 When deploying to a Production Environment. The bare minimum commands that would have to be executed are shown below. This is assuming there are no added packages in your requirements.txt file and no drastic changes to your settings.py file either. Drastic could also mean 1 line of code depending on the type of setting that was changed. 

python manage.py collectstatic
python manage.py compress

 You may have to do some troubleshooting from time to time if something is not updating. Often that means your manifest.json file is gunked up and simply removing that and re-running the compress command can do the trick. You can also attempt to force the compress command but that is generally for building in a local environment where compress is disabled by default. The reason we disable it in a local environment is so that when debugging and inspecting code, you can see what CSS file and what line number something appears on. Otherwise, everything will appear on line 1 of the output file, which is not helpful at all for debugging. 

sudo rm -rf static/CACHE/
sudo rm -rf static/CACHE/css
sudo rm -rf static/CACHE/js
sudo rm -rf static/CACHE/manifest.json

python manage.py compress --force

Below are some links to examples files in my source code, which is publicly available for you to look at.