Re: [HTML Imports]: Sync, async, -ish?

Another alternative:

First let's agree that Souder's example must block:

<link rel="import" href="import.php">

...

<div id=import-container></div>
<script>
var link = document.querySelector('link[rel=import]');
var content = link.import.querySelector('#imported-content');
document.getElementById('import-container').appendChild(content.cloneNode(true));
</script>

If we don't block on the script tag then we have a race between the
querySelector and the import, fail.

To me the async solution is on the script, just like it is today load
events:

<div id=import-container></div>
<script>
var link = document.querySelector('link[rel=import]');

link.addEventListener('load', function() {
  var content = link.import.querySelector('#imported-content');
  document.getElementById('import-container').appendChild(content.cloneNode(true));

}
</script>

Now the script still blocks but it is short and just registers a handler.
When the link loads it is executed. Here the dependency is correctly set by
the script tag.

But I don't see a 'load' event in the Import spec,
http://www.w3.org/TR/html-imports/
jjb


On Mon, Nov 18, 2013 at 1:40 PM, Dimitri Glazkov <dglazkov@google.com>wrote:

> 'Sup yo!
>
> There was a thought-provoking post by Steve Souders [1] this weekend that
> involved HTML Imports (yay!) and document.write (boo!), which triggered a
> Twitter conversation [2], which triggered some conversations with Arv and
> Alex, which finally erupted in this email.
>
> Today, HTML Imports loading behavior is very simply defined: they act like
> stylesheets. They load asynchronously, but block <script> from executing.
> Some peeps seem to frown on that and demand moar async.
>
> I am going to claim that there are two distinct uses of <link rel=import>:
>
> 1) The import is the most important part of the document. Typically, this
> is when the import is the underlying framework that powers the app, and the
> app simply won't function without it. In this case, any more async will be
> all burden and no benefit.
>
> 2) The import is the least important of the document. This is the "+1
> button" case. The import is useful, but sure as hell doesn't need to take
> rendering engine's attention from presenting this document to the user. In
> this case, async is sorely needed.
>
> We should address both of these cases, and we don't right now -- which is
> a problem.
>
> Shoot-from-the-hip Strawman:
>
> * The default behavior stays currently specified
> * The "async" attribute on <link> makes import load asynchronously
> * Also, consider not blocking rendering when blocking <script>
>
> This strawman is intentionally full of ... straw. Please provide a better
> strawman below:
> __________________
> __________________
> __________________
>
> :DG<
>
> [1]:
> http://www.stevesouders.com/blog/2013/11/16/async-ads-with-html-imports/
> [2]: https://twitter.com/codepo8/status/401752453944590336
>