undefined | Better HN

story

0 pointsTekMol8y ago0 comments

    this is exactly how CSS works as well

I beg to differ. There is no mapping needed for CSS. CSS works by once defining where the style shall go:

    <div class=city></div>

And once what the style is:

    .city {color: blue; font-family: arial;}

Similar, template syntax once defines where the data shall go:

    <div class=city>{{NAME}} has {{POPULATION}} residents</div>

And once, what the data is:

    city={name: "New York", population: 8491000}

Neither need additional mapping.

0 comments

daliwali8y ago

I'm not sure I understand what you mean by additional mapping.

Here's all that's needed in the template:

    <div class="city"><span class="name"></span> has <span class="population"></span> residents</div>

And the mapping would be:

   [ 'city': [ '.city', { name: '.name', population: '.population' } ] ]

If you don't want to manually define a mapping, you could do it automatically by assuming that some attribute like `data-bind` corresponds to a binding, but Simulacra.js doesn't make assumptions like that.

TekMolOP8y ago

    you could do it automatically by assuming that some
    attribute like `data-bind` corresponds to a binding

Yes, that could be done. That would mean to extend Simulacra. Or do it outside of it.

To me personally, <div>{{NAME}}</div> is easier to read and reason about. Also, it enables you to do stuff like

    <div>{{CITY}} has {{POPULATION}} residents</div>

Which is much shorter then

    <div><span data-bind="city"></span> has <span data-bind="population"></span> residents</div>

You can also do other useful stuff. For example:

    <div class="{{STATUS}}">{{MACHINE}}</div>

And then style different statuses via CSS.

daliwali8y ago

Sorry, but avoiding templating syntax was really a hard design goal. It may not be a tool for everyone.

The reason is that every templating language I've used either is or becomes a Turing-complete language by itself.

1 more reply

j / k navigate · click thread line to collapse

0 comments

daliwali8y ago

I'm not sure I understand what you mean by additional mapping.

Here's all that's needed in the template:

    <div class="city"><span class="name"></span> has <span class="population"></span> residents</div>

And the mapping would be:

   [ 'city': [ '.city', { name: '.name', population: '.population' } ] ]

TekMolOP8y ago

    you could do it automatically by assuming that some
    attribute like `data-bind` corresponds to a binding

Yes, that could be done. That would mean to extend Simulacra. Or do it outside of it.

To me personally, <div>{{NAME}}</div> is easier to read and reason about. Also, it enables you to do stuff like

    <div>{{CITY}} has {{POPULATION}} residents</div>

Which is much shorter then

    <div><span data-bind="city"></span> has <span data-bind="population"></span> residents</div>

You can also do other useful stuff. For example:

    <div class="{{STATUS}}">{{MACHINE}}</div>

And then style different statuses via CSS.

daliwali8y ago

Sorry, but avoiding templating syntax was really a hard design goal. It may not be a tool for everyone.

The reason is that every templating language I've used either is or becomes a Turing-complete language by itself.

1 more reply

j / k navigate · click thread line to collapse