May 7, 2021
Django Static Files Reduce Load Times and Save Your Company Money
The Metaphor
If you bake one cake a year, buy a little bit of flour, right before you bake it.
If you bake a cake every hour every day, then you should keep a large supply of flour in your pantry all the time.
A static file is like an ingredient your templates use all the time. Your html templates should have that logo in their “pantry” instead of going to your web host’s “grocery store” to get a new copy of it every single time it delivers a page to your user.
The Example
Lets say you have a company logo that shows up every time a user loads any page on your website.
Bad:
Don’t just write the url to your logo file.
{# main_page_example.html #}<body> ...
<img src="/media/assets/company_logo.png"> {# BAD! NO!! #}
...</body>
This will make your backend re-retrieve that image every time a user loads the page. Every. Single. Time.
Good:
Use django’s static file template tags and filters.
{# main_page_example.html #}{% load static %} {# must load the static file functionality #}<body>...
<img src="{% static 'company_logo.png' %}"> {# YES! GOOD!! #}
...</body>
Now your backend will cache that file and have it on hand every time it builds the page.
Important Syntaxes (or is it syntaces?)
Place the url to the static file:
{% static 'path/to/file/example.png %}Use static file url as variable in other template tags and filters
{% load filters %}
{% load static %}
{% static "employee/images/employee_default.png" as default_avatar %}<img class="img-responsive img-circle" src="{{ employee_avatar.url|default:default_avatar }}">...
Use staticfiles in your stylesheets by placing them in your html (you can’t use template tags in CSS, unfortunately)
{# This has to be in an html file, not a css file #}{% load static %}
{% block page_stylesheets %}<style>
div.example {
background: url("{% static 'example/image.svg' %}");
}
</style>{% endblock %}
Installation Instructions:
To actually set this up you need to make some changes to your config settings files. The django docs will walk you through that.
