Re: [WICG/webcomponents] [dom-parts] Declarative syntax for creating DOM Parts (Issue #1003)

Having taken some time to reflect on this issue, I realize I was starting to do something I find quite annoying when others do:  Critique some request for something other people desperately want, which I have no need or desire to use (I thought I did, which is why I was starting to get involved, but on further reflection, realize I don't).

I'm 100% Team Template Instantiation With Built In Support For Moustache Syntax that supports nested loops, conditionals, etc.  The sooner the better.  I trust the browser vendors can find a way to take server rendered content that is consistent with the output that would be generated by template instantiation, and find the best way, with or without the help of markers, to take that generated content, and apply the template with future updates, in as efficient a way as possible.   Perhaps the browser vendors can consult with how frameworks do it for tips, also perfectly fine as far as I'm concerned, especially if the result is better performance / ergonomics, etc.

If frameworks don't want to compile their DX optimized syntax to that template syntax (under the hood), that's their prerogative, and if they want to request some other support, also fine, as long as it doesn't block what I want.

For my needs / desires:

1.  Hydrating/extracting the data from the server-rendered HTML, so that we don't require a separate download of the data, which would need to be parsed and aligned with the corresponding HTML nodes.
2.  Reverse engineering the HTML to infer the template used to generate the HTML.
3.  Providing search engines the ability to correlate information displayed to the user with data attributes like they can do with microdata (itemprop attributes).

The only things I *think* I would ask for is the following, which I'm mulling over before making it a  full proposal:

---------------------------------

A good [percentage](https://w3techs.com/technologies/details/da-microdata#:~:text=Microdata%20is%20used%20by,24.2%25%20of%20all%20the%20websites) of websites use [microdata](http://html5doctor.com/microdata/) .

I think nudging developers to make use this feature by making it super-easy, when working with template instantiation, would have beneficial impact for the web and society in general.

<details>
    <summary>My (hidden) agenda</summary>
    [TODO]
</details>

The specific syntax of this proposal is not meant to be read as a particular endorsement of any particular syntax (i.e. handlebar vs moustache), and is up in the air, as far as I know, so please interpret the examples "non-literally".

Because there's a performance cost to adding microdata to the output, it should be something that can be opt-in (or opt-out).

But basically, for starters, there would be an option we could specify when invoking the Template Instantiation API:  emitMicrodata.

What this would do:

Let's say our (custom element) host object looks like:

```JavaScript
const host = {
    name: 'Bob'
    eventDate: new Date()
}
```

And we apply it to the template:

```html
<template>
    <span>{{name}}</span>
</template>
```

then with the emitMicrodata setting it would generate:

```html
<span itemprop=name>Bob</span>
```

## Formatting

If template instantiation supports formatting:

```html
<template>
    <time>{{eventDate.toLocaleDate|ar-EG, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }}}</time>
<template>
```

it would generate:

```html
    <time itemprop=eventDate datetime=2011-11-18T14:54:39.929Z>11/18/2011</time>
```

Now let's talk about the dreaded interpolation scenario.

```html
<template>
    <div>Hello {{name}}, the event will begin at {{eventDate}}</div>
</template>
```

Template instantiation would generate:

```html
<div>Hello <meta itemprop=name/>Bob<meta content>, the event will begin at <meta itemprop=eventDate itemtype=date content=2011-11-18T14:54:39.929Z>11/18/2011</div>
```





-- 
Reply to this email directly or view it on GitHub:
https://github.com/WICG/webcomponents/issues/1003#issuecomment-1536902127
You are receiving this because you are subscribed to this thread.

Message ID: <WICG/webcomponents/issues/1003/1536902127@github.com>