4

Supose i have this simple but fairly nested Eco template:

<div class="example">
  <% for thing, i in @things: %>
    <div class="nested">
      <% if i % 2 == 0: %>
        This block is fairly nested.
      <% end %>
    </div>
  <% end %>
</div>

When compiled to JS the result is:

function(__obj) {
  // ... A couple of auxiliary functions ...
  (function() {
    (function() {
      var i, thing, _i, _len, _ref;

      __out.push('<div class="example">\n  ');

      _ref = this.things;
      for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
        thing = _ref[i];
        __out.push('\n    <div class="nested">\n      ');
        if (i % 2 === 0) {
          __out.push('\n        This block is fairly nested.\n      ');
        }
        __out.push('\n    </div>\n  ');
      }

      __out.push('\n</div>\n');

    }).call(this);

  }).call(__obj);
  __obj.safe = __objSafe, __obj.escape = __escape;
  return __out.join('');
}

Now, this function (which is served as JS to the client to do client-side rendering) includes some unnecessary blanks spaces on strings, like ...

`'\n        This block is fairly nested.\n      '`

... that cannot be removed by a JS compressor because they are not JS blank space (but become HTML blank space when rendered). I understand Eco compiles the templates this way to keep their output nicely indented, which is cool in a development environment, but not so much on a production one :D

Is there a way to remove this unnecessary blank spaces from the eco.precompile output?

BTW, i'm using Sprockets to compile, concatenate and serve these assets.

epidemian
  • 18,817
  • 3
  • 62
  • 71
  • 1
    I haven't used Eco and don't have an immediate environment to try anything. Can you see if enclosing the unwanted whitespace in `` helps? – Ates Goral May 09 '12 at 18:42
  • Thanks for the suggestion @AtesGoral, but unfortunately that would not help that much, because the spaces seen in JS the output are because of the indentation used in the template (i've edited my question commenting that). Before adding unnecessary HTML comment blocks i'd rather remove the indentation of the soruce templates, but that's a far from ideal solution (there probably is a way to remove them on .eco -> .js compile time). – epidemian May 09 '12 at 18:49
  • If Eco honors XML comments, it might still work. I'll post what I meant as an answer. – Ates Goral May 09 '12 at 19:05
  • One option is to hack/override https://github.com/sstephenson/eco/blob/master/src/util.coffee and make `inspectString` pipe through `trim`. – Ates Goral May 09 '12 at 19:27

2 Answers2

2

What if you write it like this 

<div class="example">
  <% for thing, i in @things: %>
    <div class="nested"><%= "fairly nested" if i % 2 is 0 %></div>
  <% end %>
</div>

as suggested in ECO templates README, under a note about whitespace.

topless
  • 8,069
  • 11
  • 57
  • 86
0

If Eco honors XML comments, this might help:

<div class="example">
  <% for thing, i in @things: %><!--
    --><div class="nested"><!--
      --><% if i % 2 == 0: %>
        This block is fairly nested.
      <% end %>
    </div>
  <% end %>
</div>

Though, you would have to make a choice between this ugliness or the ugliness of giving up indentation.

Ates Goral
  • 137,716
  • 26
  • 137
  • 190
  • 2
    The HTML comments are also included in the JS output as well as the blank space. Eco borrows it's comment syntax from ERB: '<%# %>'. Those comments won't appear on the JS output, but replacing indentation by comments is a no-go for me is not what i'm looking for =D – epidemian May 09 '12 at 19:15