Django: Frequent use of include template tag - how much is too much?

Question

I noticed that I started using include template a lot. One of my template files has 20+ include tags.

Some of them are for modal dialogs that in turn have include for different form field sets. I am also using basically the same buttons with different data attributes so these are also done with include tags. Some my "fragments" that I use with include have around only five lines of HTML code.

I worry if this is too much and can negatively affect performance (since Django loads another files, etc..)

For example whis is markup of one of my HTML fragments I am using with include:

<div class="form-group">
    <input type="url" class="form-control" id="video-link-input" name="video_link"
           placeholder="YouTube link">
</div>

<input type="hidden" id="video_id" name="video_id" value="">

<img class="img-fluid img-thumbnail"  id="video-img-preview">

Hope the question is not too broad. I would just like to avoid possible bad practice.

Answer 1

Overly fragmented templates will impact your performance, but not because Django loads files.

With the default settings, Django caches template files when DEBUG=False:

django.template.loaders.cached.Loader

...

This loader is automatically enabled if OPTIONS['loaders'] isn’t specified and OPTIONS['debug'] is False (the latter option defaults to the value of DEBUG).

IMHO, having lots of includes is not a bad practice in itself. The alternative would be repeating the code, which violates the DRY principle.

If you find yourself including the same template multiple times within one template, you might want to consider a custom inclusion tag.

If you are really worried about performance, look into caching and specifically template fragment caching.

Answer 2

According to Django documentation:

• using {% block %} is faster than using {% include %}
• heavily-fragmented templates, assembled from many small pieces, can affect performance

You can use extends and block

Few examples: In base.html I use these blocks

...
{% block navbar %}
{% endblock %}

{% block sidebar %}
{% endblock %}

{% block searchbar %}
{% endblock %}

{% block content %}
{% endblock %}

{% block footer %}
{% endblock %}
...

Now I extend base.html into login.html. Say my login.html just need navbar, content, and footer

{% extends 'base.html' %}
<h1>Login </h1>
{% block navbar %}
   This is my navbar
{% endblock %}

{% block content %}
  Here is my login form
{% endblock %}

{% block footer %}
  This is footer
{% endblock %}

Now I extend base.html into home.html. Say my home.html need navbar, sidebar, searchbar, content, and footer

{% extends 'base.html' %}
<h1>Home page </h1>
{% block navbar %}
   This is my navbar
{% endblock %}

{% block sidebar %}
    This is sidebar
{% endblock %}

{% block searchbar %}
{% endblock %}

{% block content %}
   This is homepage contents. This will not render which you use in login.html **content** block
{% endblock %}

{% block footer %}
{% endblock %}