Search code examples
polymerweb-componenthtml-imports

Wrap javascript-dependencies in HTML-Import?

To use javascript-libraries in web-components, I've seen the pattern to wrap them into a html-import like this:

(moment.html)

<script type="application/javascript" src="bower_components/moment/moment.js"></script>

(component.html)

<link rel="import" href="moment.html">

instead of just importing the script directly in component.html. Are there any advantages of using just html-imports?

Solution

  • There are advantages to embedding it directly in the HTML: it eliminates an extra HTTP request (which would slow down the loading of your webpage by however the request latency time is).

    However the cost is maintainability and it means that your component.html file now has a direct dependency to something that would otherwise be abstracted away (by moment.html - because component.html should be ignorant of moment.html's dependencies).