CODEWITHSUNDEEP
polymerpolymer-1.0polymer-starter-kit
fearlessbryan
fearlessbryan

Reputation: 165

Why does the Polymer Starter Kit use an auto-binding template in index.html instead of creating a custom component?

In the Polymer Starter Kit, index.html seems to behave very much like a Polymer component, such as binding to properties in app.js. Why not put all the contents of the body of index.html into a custom component instead? What advantages are there to using an auto-binding template in this situation? Does it relate to it being a single page app and keeping the skeleton structure of the app in index.html? Or is it for easier access to app scoped variables such as "baseUrl"? Or perhaps it's related to css scoping?

Upvotes: 2

Views: 92

Answers (1)

ankon
ankon

Reputation: 4215

A bit of a reverse answer: using the auto-bind template is quite straight-forward for the setup of the application (API endpoints, caching, ...). But, as soon as you start adding more and more elements in index.html, you're going to feel quite some pain:

  • app.js/index.html are separate files, which is at least mildly annoying when you're editing
  • binding annotations work slightly differently, in particular it is difficult to get calculated bindings to work
  • no declarative magic for events and properties
  • no behaviors
  • ...

My best-practice so far: only keep the setup logic in the auto-bind template, and only have a single webcomponent in index.html, which is configured via properties/attributes and app.js. Everything else should be done in that element.

Upvotes: 0

Related Questions