Property setters/getters for interop

[robdodson]

For Custom Elements to work well in other frameworks like Angular and React (or even just in a regular old vanilla HTML page) it's useful if they follow the conventions of native tags. This means, attributes and properties to send data in, and events to get data out/listen for changes. The set() and get() APIs make this a bit difficult because it means the consumer of the components has to know to call those methods. In other words, the implementation is leaking to the outside world.

Instead of explicit set() api (which I'm assuming triggers rendering), you might have the element author define an object that specifies the properties of their element and install setters for those properties. The setters could then call render anytime they update. The one catch is if a user is mutating data instead of passing in a new value (like pushing to an array or modifying an object subproperty). In that case, the setters would not be called and you'd miss out on rendering. To work around this, I think a good best practice for Custom Elements might be to encourage folks to always pass complex data by copy, instead of by reference.