Question

I am evaluating Ember.js for my next project. I am loving the binding mechanism so far, but have a question about the approach. As per the docs “In order to know which part of your HTML to update when an underlying property changes, Handlebars will insert marker elements with a unique ID.” I can probably live with these tags but they are very distracting (see example below). Is the rationale behind this approach discussed anywhere. Were any alternatives considered?

<tbody>
    <script id="metamorph-0-start" type="text/x-placeholder"></script>
    <script id="metamorph-1-start" type="text/x-placeholder"></script>
    <tr>
        <td class="quote-name">
            <script id="metamorph-7-start" type="text/x-placeholder"></script>
            Apple
            <script id="metamorph-7-end" type="text/x-placeholder"></script>
        </td>
        <td class="quote-code">...</td>
        <td class="quote-value">...</td>
        <td class="quote-bid">...</td>
        <td class="quote-offer">...</td>
    </tr>
    ...
</tbody>

Answer 1

The rationale that Metamorph uses script tags, as I know it, is that script tags can appear within the DOM anywhere without breaking anything visually. This fact becomes very important when you think about it because it allows for a way to make just about anything in the DOM watchable by the framework. Thus enabling all of the binding “magic” that makes Ember so great.

Earlier last year I do remember some of the discussions on the IRC channel about this and yes alternatives were considered but script tags won.