I would like to have a polymer element with two sub-elements, one that produces data, and the other that performs some action when the data changes (in my case: sending a notification to a server).

To implement this, I wrote a polymer element, namely `root`, with the following structure (names changed to simplify the discussion):

```
<producer data={{foo.bar}}></producer>
<consumer data=[[foo]]></consumer>

```

The producer changes the data using the `set('property', 'value')` method, so that the `root` element sees the notifications. The problem is that the `consumer` element won't notice the changes to `foo` since they involve a sub-property.

To solve this, I tried using a [computed binding](https://www.polymer-project.org/1.0/docs/devguide/data-binding.html#annotated-computed "computed binding") as follows:

```
<producer data={{foo.bar}}></producer>
<consumer data=[[_compute(foo)]]></consumer>

...
_compute: function() {
    return this.foo;
}

```

However this won't cause the `consumer` to be notified. I think the reason for this is that the returned object is the same reference (only a sub-attribute changed). Currently the workaround I've used is to use the following version of the `compute` function:

```
_compute: function() {
    return Object.assign({}, this.foo);
}

```

This works (the `consumer` element gets notified), however I'm affraid it might not be the most efficient (I'm creating an object at every call of `_compute`) and/or elegant way. Then my question is: what is the proper way to achieve this behavior in Polymer?