Re: [w3c/webcomponents] HTML Modules (#645)

Average-joe-boots-on-the-ground-the-meek-shall-inherit-the-earth developer here :-).  Apologies in advance for any lacking nuance or inaccuracies.

The picture I have in my head is a [recursive yin yang symbol](https://www.dreamstime.com/royalty-free-stock-photos-recursive-yin-yang-symbol-image19092388).  Html and JavaScript have a symbiotic complementary relationship.   

Today, Html can import JavaScript (external and inline), which can (now) continue to import JavaScript recursively.  It can import styles natively.  But, unfortunately, HTML (without imports or client-side includes, or iframes) can't import common html natively.  I think this is a serious gap, especially with the advent of HTTP/2.

Also today, JavaScript can't import HTML or css files.  I see benefits from all combinations working -- recursively, external and inline).  

rniwa's proposal:

```JavaScript
import template from 'my-template.html' as HTMLTemplateElement;
import styleSheet from 'my-style.css' as SheetStyle;
```
or

```JavaScript
import template from module `
<div>hello, world</div>
` as HTMLTemplateElement;

import styleSheet from module `
div { color: green; }
` as StyleSheet;
```

seems brilliant on a number of fronts -- familiar, natural syntax, ease of polyfilling (?) and the ability, I presume, for parsers to optimize, and tools to colorize / autocomplete, etc, in a standardized, non proprietary way.

Perhaps there is some pitfall in doing this, but it would be fantastic if the template literals could evaluate constants, if that can be done without sacrificing optimizations / tooling:

const commonMarkup = `
<inner-stuff>
hello, world
</inner-stuff>
`
```JavaScript
import template_1 from module `
<div>${commonMarkup}</div>
` as HTMLTemplateElement;

import template_2 from module `
<span>${commonMarkup}</span>
` as HTMLTemplateElement;
```

This would allow large blocks of common html to be shared, without the ceremony of polluting the precious namespace of custom element tags, just for snippets of html.  This would greatly reduce the payload (and maintenance).

The ability to have HTML files to be able to recursively import other html is also quite useful, for similar reasons, including activating  inline and external JavaScript as well as style dependencies.  This can be done as a custom element, I'm sure (essentially rewrite HTML import as a custom element), but I assume the browser would be faster if it implemented this natively?










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