spaceless

Use the spaceless filter to remove whitespace between HTML tags, not whitespace within HTML tags or whitespace in plain text:

spaceless フィルタを使用して、HTML タグ内の空白やプレーン テキスト内の空白ではなく、HTML タグ間の空白を削除します。
1
2
3
4
5
6
7
{{
    "<div>
        <strong>foo</strong>
    </div>
    "|spaceless }}

{# output will be <div><strong>foo</strong></div> #}

You can combine spaceless with the apply tag to apply the transformation on large amounts of HTML:

spaceless を apply タグと組み合わせて、大量の HTML に変換を適用できます。
1
2
3
4
5
6
7
{% apply spaceless %}
    <div>
        <strong>foo</strong>
    </div>
{% endapply %}

{# output will be <div><strong>foo</strong></div> #}

This tag is not meant to "optimize" the size of the generated HTML content but merely to avoid extra whitespace between HTML tags to avoid browser rendering quirks under some circumstances.

このタグは、生成された HTML コンテンツのサイズを「最適化」するためのものではなく、HTML タグ間の余分な空白を避けて、特定の状況下でのブラウザのレンダリングの癖を避けるためのものです。

Caution

注意

As the filter uses a regular expression behind the scenes, its performance is directly related to the text size you are working on (remember that filters are executed at runtime).

フィルターはバックグラウンドで正規表現を使用するため、そのパフォーマンスは作業中のテキスト サイズに直接関係します (フィルターは実行時に実行されることに注意してください)。

Tip

ヒント

If you want to optimize the size of the generated HTML content, gzip compress the output instead.

生成された HTML コンテンツのサイズを最適化したい場合は、代わりに出力を gzipcompress してください。

Tip

ヒント

If you want to create a tag that actually removes all extra whitespace in an HTML string, be warned that this is not as easy as it seems to be (think of textarea or pre tags for instance). Using a third-party library like Tidy is probably a better idea.

HTML 文字列内のすべての余分な空白を実際に削除するタグを作成したい場合、これは思ったほど簡単ではないことに注意してください (たとえば、テキストエリアや pre タグを考えてみてください)。 Tidy などのサードパーティ製ライブラリを使用することをお勧めします。

Tip

ヒント

For more information on whitespace control, read the dedicated section of the documentation and learn how you can also use the whitespace control modifier on your tags.

空白制御の詳細については、ドキュメントの専用セクションを読んで、タグで空白制御修飾子を使用する方法を学んでください。