Idea: data key to id convention

[devinrhode2]

Basically, instead of generating script tag markers with mostly arbitrary numbers, have them be a stringification of the data keys. For example:

Sample json:

{
  user: {
    name: 'devinrhode1'
  }
}

Render with template:

<h1> Welcome {{user.name}}</h1>

Produces:

<h1> Welcome
  <script id="ember-start-user.name"></script>
  devinrhode1
  <script id="ember-end-user.name"></script>
</h1>

This moves towards having an initial state rendered server side, as @tomdale just mentioned in a talk tonight.

When you get an update of this json:

{
  user: {
    name: 'devinrhode2'
  }
}

There's a simple convention to update the page. Here's a very rough outline of the code:

for (var key in update) {
    // No strings/numbers at top level, so we would recurse. 
    getElementById('ember-start-'+ *data key 1 (user)* +  *data key 2 (name) ).innerHTML = thatNewDataBrah;
}

For arrays, my best idea is to embed the indices into the id's.

[devinrhode2]

@ebryn, what do you think of this?

[tomdale]

What happens if you have the same value in multiple places?

[devinrhode2]

Combined with another idea, this can be very elegantly taken care of.

Other idea is... embed api endpoints in the handlebars template, looks like:

<ul>
  {{ /friends/list }}
    <li>{{ this.name }}</li>
  {{ /}}
</ul>

Then, you scope by api endpoint. The endpoint url can prefix the names, that is

[devinrhode2]

But if you actually have the same value in two places obviously we want to update both.

[devinrhode2]

@tomdale I think this could really make handlebars shine, especially on the server side A classic problem I think with logic-less templates server side is specifying where the data should come from. Client side apps specify the api endpoints for their data, not the backend. To get the fastest page loads, this is the cleanest api I can think of.

Block helpers are a tricky one, but let's leave that to a separate discussion.