• 2018年7月25日水曜日
アリスト戦記
アリスト戦記 https://blog.aristo-solutions.net/2018/07/django-spaceless_25.html

Djangoのテンプレートタグ 「spaceless」 空白文字、改行、タブを除去

日本一平凡なDjangoバナー

テンプレートタグ 「spaceless」は、これで囲った範囲内の 空白文字、改行、タブなど、HTMLとして認識しない部分を除去してくれる機能です。


例1

さっさと具体例を見た方が分かり易いです。
HTMLにspacelessタグを書いた時のテンプレートと結果のHTML出力は以下のとおりです。

テンプレート

{% spaceless %}
    <p>
        <a href="foo/">Foo</a>
    </p>
{% endspaceless %}

HTML出力

<p><a href="foo/">Foo</a></p>

コメント

見たままですね。確かにHTML出力時に不要な要素が消えました。

例2

取り除かれるのはタグとタグの間の空白だけとのこと。
タグとテキストの間のスペースは取り除かれません。

テンプレート

{% spaceless %}
    <p>
        <a href="foo/">
            Foo
        </a>
    </p>
{% endspaceless %}

HTML出力

<p><a href="foo/">
            Foo
        </a></p>

コメント

確かに、aタグの中にある空白は除去されませんでした。

考察

「は? これ何の意味があるの!?」

空白なんか除去しても画面に見える結果は変わりませんからね!!
考えたのですが、これはHTMLの圧縮を目的とした機能なのではないかと思います。

HTMLの圧縮……。

私は業務システム畑の人間なので余り気にしたことはありませんが、コンシューマー向けのWebシステムともなると、可能な限り伝送データ量を少なくして画面を表示したいという需要があるそうです。

伝送データ量が減ることで以下の利点があります。


  • 画面の表示速度が(僅かなりとも)上がる。
  • 利用者のスマホのギガの減りが(僅かなりとも)緩和される。
  • ネットワークインフラへの負荷が(僅かなりとも)下がる。
  • Googleからの評価が良くなってSEO対策で有利になる。


空白を除去したくらいで減る伝送量なんて微々たるものに決まってるんですが、利用者の多いコンシューマー向けのWebシステムだと、その微々たるものでも無視出来ない規模になるのでしょう。

そのニーズに対応するのがspacelessタグなのだと思います。

これは私の予想です。
spacelessには別の意味があるとご存知の方はコメントで教えて頂きたく。
また、正しい場合は正しいとコメントで賛同頂けるとありがたいです。

出展

公式サイトはこちら。


バックナンバー

0 件のコメント:

コメントを投稿