Add versioning to static resources

Static resources that are likely to change from one repomaker release to another such as CSS and JavaScript files should add the current version to their URL to prevent a new version from using old cached resources.

So <script src="add.js"> becomes <script src="add.js?v=1.0"> for example.

assigned to @NicoAlt

@grote That's a good idea. But I have a better one :)

What if we not only name static resources differently (i.e. ?v=1.0) but also compress everything so the end resource is tinier than the ones before? This can be achieved with django-compressor. From the readme:

Since the file name is dependent on the content, these files can be given a far future expiration date without worrying about stale browser caches.

Here's a dump of the readme in case you can only receive mails but no web pages because of slow internet:

Django Compressor =================

Django Compressor processes, combines and minifies linked and inline Javascript or CSS in a Django template into cacheable static files.

It supports compilers such as coffeescript, LESS and SASS and is extensible by custom processing steps.

Django Compressor is compatible with Django 1.8 and newer.

How it works

---

In your templates, all HTML code between the tags {% compress js/css %} and {% endcompress %} is parsed and searched for CSS or JS. These styles and scripts are subsequently processed with optional, configurable compilers and filters.

The default filter for CSS rewrites paths to static files to be absolute. Both Javascript and CSS files are by default concatenated and minified.

As the final step the template tag outputs a <script> or <link> tag pointing to the optimized file. Alternatively it can also inline the resulting content into the original template directly.

Since the file name is dependent on the content, these files can be given a far future expiration date without worrying about stale browser caches.

For increased performance, the concatenation and compressing process can also be run once manually outside of the request/response cycle by using the Django management command manage.py compress.

Configurability & Extensibility

---

Django Compressor is highly configurable and extensible. The HTML parsing is done using lxml_ or if it's not available Python's built-in HTMLParser by default. As an alternative Django Compressor provides a BeautifulSoup_ and a html5lib_ based parser, as well as an abstract base class that makes it easy to write a custom parser.

Django Compressor also comes with built-in support for YUI CSS and JS_ compressor, yUglify CSS and JS_ compressor, the Google's Closure Compiler_, a Python port of Douglas Crockford's JSmin_, a Python port of the YUI CSS Compressor csscompressor_ and a filter to convert (some) images into data URIs_.

If your setup requires a different compressor or other post-processing tool it will be fairly easy to implement a custom filter. Simply extend from one of the available base classes.

More documentation about the usage and settings of Django Compressor can be found on django-compressor.readthedocs.org_.

The source code for Django Compressor can be found and contributed to on github.com/django-compressor/django-compressor_. There you can also file tickets.

The in-development version of Django Compressor can be installed with pip install http://github.com/django-compressor/django-compressor/tarball/develop.

We can also use Django's CachedStaticFilesStorage, though. Found here. More information about it.

This can be achieved with django-compressor.

Good find! I think we might be depending on/using this already due to django sass.

ManifestStaticFilesStorage also sounds interesting (they warn about using CachedStaticFilesStorage), but we would need to make sure it doesn't have any side effects and doesn't interfere with the way we serve MEDIA files at the moment.

removed assignee

assigned to @grote

added Doing label

ManifestStaticFilesStorage requires running collectstatic and does not work in DEBUG mode (which is used in the desktop app).

The compressor requires strange {% compress %} template tags and requires an additional step after collectstatic.

While compressing resources would be nice, it doesn't seem to make such a big difference. Since this ticket was mainly about preventing old resources from being loaded, I'll go for the simple solution first.

Turns out doing it manually has its own pitfalls, maybe django-compressor isn't such a bad idea after all. Will look into it again tomorrow.

mentioned in merge request !171 (merged)

closed via merge request !171 (merged)