fluid_styled_content rendering generates lots of blank lines - typo3-7.6.x

Question

I'v created three websites with TYPO3 V7.6.x. All of them use fluid_styled_content extension. As setup for output I use 10.variables.content < styles.content.get and in template {content -> f:format.raw()}. Whit these all the output html code has lots of blank lines. For example:
<!--TYPO3SEARCH_begin-->
<div id="c26">
<h1>Fachstelle Gesundheitsförderung Uri</h1>
</div>
<div id="c14">
<div class="ce-textpic ce-left ce-above">
<div class="ce-bodytext">
<p><span class="lead-text">Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Dolores et ea rebum. Stet clita , no sea takimata.</span></p>
</div>
</div>
</div>
<div class="row link-box"><div class="col-sm-6"><img src="/fileadmin/_processed_/8/7/csm_teaser-1_f496539e13.jpg" width="720" height="375" class="img-responsive" alt="Gesundheitsförderung" ><div class="link-box-title"><h2>Gesundheitsförderung</h2></div></div><div class="col-sm-6"><img src="/fileadmin/_processed_/8/7/csm_teaser-1_f496539e13.jpg" width="720" height="375" class="img-responsive" alt="Cool & Clean" ><div class="link-box-title"><h2>Cool & Clean</h2></div></div><div class="col-sm-6"><img src="/fileadmin/_processed_/8/7/csm_teaser-1_f496539e13.jpg" width="720" height="375" class="img-responsive" alt="Verein" ><div class="link-box-title"><h2>Verein</h2></div></div><div class="col-sm-6 news-latest"><div class="link-box-description"><p>15. November 2016</p><h3>Projekt Ernährung</h3><p class="teaser">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et...</p></div><div class="link-box-title"><h2>News</h2></div></div></div>
<div id="c40">
<h2>Weitere Infos</h2>
<div class="ce-textpic ce-left ce-above">
<div class="ce-bodytext">
<p>NewsletterVeranstaltungenKontakt </p>
</div>
</div>
</div>
<!--TYPO3SEARCH_end-->
How can you remove the unneeded blank lines?
Thanks in advance
Daniel

Answer 1

As Dan already noted: use the f:spaceless VH.
Aside of that you could optimize all templates of your installation, but that is a very painful work as you need to work on a lot of templates. on the other side you will make all these templates unreadable as you loose the structure of indention.
A better approach would be to use extensions and external tools to optimize the resulting html. E.g. there is the extension tidy but that also needs the software tidy to be installed and accessible on your server. Then there are other minifier and compressor extensions.
A last (and possibly the easiest) optimization would be to configure your server (apache) to use compression / gzip for delivery. So those whitespace gets compressed to nearly nothing.