Is the HTML Import polyfill redundant if I vulcanize all my custom elements into a single script?

[Kiran Rao]

It looks like the HTML Import polyfill is redundant if vulcanize is used to either inline or otherwise squash all the custom elements into a single script. Essentially, HTML imports are replaced with a script import.

Is this assessment correct? Am I missing something here?

I tried creating a version of webcomponents-lite.js minus the HTML imports and the size went further down to ~16 KB minified (~5.6KB gzipped). For comparison, webcomponents-lite is ~28KB minified (~9KB gzipped).

If HTML imports are truly redundant after vulcanizing, maybe we could request inclusion of a webcomponents-feather version of the polyfills that include only Custom Elements and Templates.

[Rob Dodson]

Good question. I know that elements have access to Polymer.import and may potentially lazy load more elements this way. +dfreedman do you know if any polymer elements (or polymer itself) take advantage of Polymer.import at any point?

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/bef0c60d-a49d-4043-83c8-25727aff8408%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Kiran Rao]

@Rob,

I wonder whether my assumption is correct in the first place. It would be good to get the folks developing the core polyfills to weigh in. See also this bug on webcomponentsjs repo.

[Rob Dodson]

+ajo

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/9b71c215-d4e6-4d74-8a91-ce63de27a554%40googlegroups.com.

[raj...@gmail.com]

It also seems that HTML Imports use the WebComponentsReady event due to the polyfill limitation of not being able to block on scripts in the main page during imports: http://webcomponents.org/polyfills/html-imports/

1. Does that mean if we vulcanize that relying on WebComponentsReady is unnecessary? 

2. Following that, if Polymer and Polymer element registrations are being loaded synchronously due to vulcanization does that mean we also do not need to wait for polymer-ready assuming the DOM is ready?

3. The million dollar question: With vulcanization does that mean I can switch back to a "VanillaJS" way of detecting DOM ready state such as waiting for DOMContentLoaded?

4. I'm having difficulty finding documentation to back this up but was the goal for native web components (utilizing HTML Imports, Shadow DOM, Custom Elements, HTML Templates, the works!) to expect that all web components (that don't rely on programmatic lazy importing) are registered and upgraded for DOMContentLoaded? 

[Kiran Rao]

@rajsite,

In my experiments, I found that WebComponentsReady is still required - that's how you know that your custom element has been registered and is safe to interact with. However, I had other issues related to Template not being available (if I eliminate the HTML Imports polyfill that is). Check out the bug I referred to in my response to Rob above for more details.

[AJ Ortega]

Custom element upgrades aren't always synchronous. Even w/ vulcanization, you'll still want to wait for WebComponentsReady.

--

AJ Ortega | Software Engineer | a...@google.com | 626-872-5064 

[Kiran Rao]

+ajo,

Any inputs on the necessity of the HTML Import polyfill after vulcanization?

[Eric Bidelman]

In 0.5, if you fully vulcanize the elements into index.html then yes, you could probably get by without the HTML Imports poyfill. However, this also means any future HTML Import wouldn't work in a polyfill'd browser. As Rob said, lazy-loaded imports are a possibility or components that call Polymer.import. 

In Polymer 0.8, defining an element in the main page is not current supported. It needs to be in a separate HTML Import. For that reason I think we'll need to keep the HTML Imports polyfill around for a while. 10KB is worth it!

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/137a7696-8fe1-410c-b1ec-91ef4aa22fe0%40googlegroups.com.

[Kiran Rao]

Hi Eric,

Thanks for the clarification. I guess I'll stick with webcomponents-lite.js then.