Re: [webcomponents] HTML Parsing and the <template> element

Here's a real-world example, that's probably relatively simple
compared to "high traffic" web pages (i.e. amazon or facebook)

http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extensions/docs/template/api_template.html?revision=120962&content-type=text%2Fplain

that produces each page of the chrome extensions API doc, e.g.

http://code.google.com/chrome/extensions/contextMenus.html

This uses jstemplate. Do a search in the first link. Every time you
see "jsdisplay" or "jsselect", think <template>.

On Wed, Feb 8, 2012 at 2:36 PM, Adam Barth <w3c@adambarth.com> wrote:
> On Wed, Feb 8, 2012 at 2:20 PM, Erik Arvidsson <arv@chromium.org> wrote:
>> On Wed, Feb 8, 2012 at 14:10, Adam Barth <w3c@adambarth.com> wrote:
>>> ... Do you have a concrete example of
>>> where nested <template> declarations are required?
>>
>> When working with tree like structures it is comment to use recursive templates.
>>
>> http://code.google.com/p/mdv/source/browse/use_cases/tree.html
>
> I'm not sure I fully understand how templates work, so please forgive
> me if I'm butchering it, but here's how I could imagine changing that
> example:
>
> === Original ===
>
> <ul class="tree">
>  <template iterate id=t1>
>    <li class="{{ children | toggle('has-children') }}">{{name}}
>      <ul>
>        <template ref=t1 iterate=children></template>
>      </ul>
>    </li>
>  </template>
> </ul>
>
> === Changed ===
>
> <ul class="tree">
>  <template iterate id=t1>
>    <li class="{{ children | toggle('has-children') }}">{{name}}
>      <ul>
>        <template-reference ref=t1 iterate=children></template-reference>
>      </ul>
>    </li>
>  </template>
> </ul>
>
> (Obviously you'd want a snappier name than <template-reference> to
> reference another template element.)
>
> I looked at the other examples in the same directory and I didn't see
> any other examples of nested <template> declarations.
>
> Adam