Data binding is triggering getter using polling?

123 views
Skip to first unread message

Sönke Rohde

unread,
Jun 30, 2013, 11:19:28 PM6/30/13
to polym...@googlegroups.com
Just wanted to confirm that it is expected to poll the getter all the time?
Isn't there a more efficient way to have event driven data binding?

My code:

element name="my-model" attributes="foo">
  <script>
    Polymer.register(this, {
     
      _foo: "bar123",

      get foo(){
        console.log("get foo");
        return this._foo;
      },

      set foo(value){
        this._foo = value;
      },

     ...

So when I bind to my-model.foo the log executes every 100ms or so.

Martijn Faassen

unread,
Jul 1, 2013, 5:05:12 AM7/1/13
to Sönke Rohde, polymer-dev
Hey,

Which web browser are you on? It was my understanding that on Chrome
it should use Object.observe, but other browsers don't support this
yet and it indeed goes to a 100 ms polling strategy. If you get this
behavior on Chrome though that looks like a bug to me (but hey, I'm no
expert).

Regards,

Martijn

Daniel Freedman

unread,
Jul 1, 2013, 9:48:34 AM7/1/13
to Martijn Faassen, Sönke Rohde, polymer-dev

You are correct Martijn. The polling is from our dirty check loop when object.observe is not available. It's important to note that Object.observe is not enabled by default in Chrome, and is missing certain features in stable. We've only been using it in canary so far with the experimental JavaScript flag.

--

---
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.
Visit this group at http://groups.google.com/group/polymer-dev.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CAGT4ZFj0%3Drg5nZwAdeeH8nHubphkNR7G8Dc%3DOf%2BDLYgEvTydrw%40mail.gmail.com.
For more options, visit https://groups.google.com/groups/opt_out.


Martijn Faassen

unread,
Jul 1, 2013, 10:08:21 AM7/1/13
to Daniel Freedman, Sönke Rohde, polymer-dev
Hey,

On Mon, Jul 1, 2013 at 3:48 PM, Daniel Freedman <dfr...@google.com> wrote:
> You are correct Martijn. The polling is from our dirty check loop when
> object.observe is not available. It's important to note that Object.observe
> is not enabled by default in Chrome, and is missing certain features in
> stable. We've only been using it in canary so far with the experimental
> JavaScript flag.

Ah, I didn't realize released Chrome didn't support it yet either.
Thanks for the clarification!

So, Sönke:

My statement that this shouldn't happen in Chrome was incorrect. The
code that does this is in the ChangeSummary library, by the way; the
hook that does the call every 125 ms is installed in
platform/lib/patches-mdv.js.

Regards,

Martijn

Daniel Freedman

unread,
Jul 1, 2013, 10:22:56 AM7/1/13
to Martijn Faassen, Sönke Rohde, polymer-dev

Also good to mention that getters/setters are not handled by Object.observe.

Erik Arvidsson

unread,
Jul 1, 2013, 10:37:03 AM7/1/13
to Daniel Freedman, Martijn Faassen, Sönke Rohde, polymer-dev
On Mon, Jul 1, 2013 at 10:22 AM, Daniel Freedman <dfr...@google.com> wrote:

Also good to mention that getters/setters are not handled by Object.observe.

...and that you need to manually notify if you want to able to observe accessors.

 
--
 
---
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.
Visit this group at http://groups.google.com/group/polymer-dev.

For more options, visit https://groups.google.com/groups/opt_out.
 
 



--
erik


Rafael Weinstein

unread,
Jul 1, 2013, 10:39:25 AM7/1/13
to Erik Arvidsson, Daniel Freedman, Martijn Faassen, Sönke Rohde, polymer-dev
I believe the plan is that Polymer will expose sugaring conveniences
for this, but it's not yet implemented. If you would like to get a
sense for what it might look like you can look at the code in
ChangeSummary that sets up "write-through" bindings:

https://github.com/rafaelw/ChangeSummary/blob/master/change_summary.js#L692
> https://groups.google.com/d/msgid/polymer-dev/CAJ8%2BGogTwQc9UsVWQSx6bGnQxwfQAN9yJU-spO559t1pFBEJHQ%40mail.gmail.com.

Sönke Rohde

unread,
Jul 1, 2013, 2:16:10 PM7/1/13
to polym...@googlegroups.com, Erik Arvidsson, Daniel Freedman, Martijn Faassen, Sönke Rohde
Thanks for the details! I am using Canary but did not have the experimental JS features turned on.
Turning it on now works and I can see that the getter is actually executed 4 times.

How would I manually control the data binding?
I think, that's what I am actually looking for.
Can I fire an event which let's the getter re-execute?

Thanks,
Sönke

Rafael Weinstein

unread,
Jul 1, 2013, 2:23:03 PM7/1/13
to Sönke Rohde, polymer-dev, Erik Arvidsson, Daniel Freedman, Martijn Faassen
On Mon, Jul 1, 2013 at 11:16 AM, Sönke Rohde <soenke...@gmail.com> wrote:
> Thanks for the details! I am using Canary but did not have the experimental
> JS features turned on.
> Turning it on now works and I can see that the getter is actually executed 4
> times.
>
> How would I manually control the data binding?
> I think, that's what I am actually looking for.
> Can I fire an event which let's the getter re-execute?

That's the notify() mechanism that Erik was referencing. It is a
signal to observers of an object that a given property has changed
value.

Out of curiosity, what use case do you have in mind?
> https://groups.google.com/d/msgid/polymer-dev/db2a4c45-475f-410f-ba37-4b58e4ca8676%40googlegroups.com.

Sönke Rohde

unread,
Jul 1, 2013, 2:33:28 PM7/1/13
to Rafael Weinstein, polymer-dev, Erik Arvidsson, Daniel Freedman, Martijn Faassen
On Mon, Jul 1, 2013 at 11:23 AM, Rafael Weinstein <raf...@google.com> wrote:
On Mon, Jul 1, 2013 at 11:16 AM, Sönke Rohde <soenke...@gmail.com> wrote:
> Thanks for the details! I am using Canary but did not have the experimental
> JS features turned on.
> Turning it on now works and I can see that the getter is actually executed 4
> times.
>
> How would I manually control the data binding?
> I think, that's what I am actually looking for.
> Can I fire an event which let's the getter re-execute?

That's the notify() mechanism that Erik was referencing. It is a
signal to observers of an object that a given property has changed
value.

Out of curiosity, what use case do you have in mind?

Great, can you please point me to the docs or any example using the notify() mechanism?

My usecase is for instance a lazy getter. The code would look similar to this:

<element name="my-model" attributes="foo">
  <script>
    Polymer.register(this, {
     
      _foo: null,

      pending: false,

      getFoo(){
        if(foo == null){
          pending = true;
          // this._loadFoo()
        }
        return this._foo;
      },

      _loadFoo(){
        // call some service to load the data
        // in a callback this._foo then gets the actual data
        service.loadFoo(function(result){
          pending = false;
          _foo = data;
          notify(); // to re-execute the databinding
        });
      },

Rafael Weinstein

unread,
Jul 1, 2013, 2:40:30 PM7/1/13
to Sönke Rohde, polymer-dev, Erik Arvidsson, Daniel Freedman, Martijn Faassen
Got it.

There aren't really docs yet, but the code I referenced below provides
an example. To make it more concrete:

-Every object has an associated "notifier". e.g.

var notifier = Object.getNotifier(obj);

-Notifiers can be used to notify observers of an object of changes. e.g.

notifier.notify({
object: obj,
name: 'foo',
oldValue: oldValue
});

Keep in mind that this mechanism is only present if Object.observe is
present. That's why the code I referenced is structured that way it
is.

Sönke Rohde

unread,
Jul 1, 2013, 2:49:13 PM7/1/13
to polym...@googlegroups.com, Sönke Rohde, Erik Arvidsson, Daniel Freedman, Martijn Faassen
Thanks for the example!
I would need something with polyfills though which works on mobile.

In Flex days you could do something similar to this:

[Bindable(event="myCustomChangeEvent")]
public function get foo(){
  return this._foo;
}

public function someOtherFunctionLoadingFoo(){
  // load foo and then
  this._foo = loaded data;
  this.fire("myCustomChangeEvent");
}

In JS/Polymer wouldn't it be possible to only re-execute the `get foo` bindings when for instance the host fires a "foo-changed" event?
So the syntax would be "[property name]-changed"?

Does that make sense?

Rafael Weinstein

unread,
Jul 1, 2013, 4:13:41 PM7/1/13
to Sönke Rohde, polymer-dev, Erik Arvidsson, Daniel Freedman, Martijn Faassen
The notification acts essentially as the event you describe.

I missed a critical property ('type') of the changeRecord which might
have made this more clear:

notifier.notify({
object: obj,
type: 'updated',
name: 'foo',
oldValue: oldValue
});

> https://groups.google.com/d/msgid/polymer-dev/6b2aab13-80fa-4a36-9aea-ceeb4db12028%40googlegroups.com.

ijaz786b...@gmail.com

unread,
Apr 17, 2018, 7:01:28 AM4/17/18
to Polymer
There are three ways to observe changes in JavaScript objects: Methods (as ... If you want to use properties instead you need to either use polling using a timer or you can use an object observer. However the ... Note it will trigger callback on any property change so need to iterate the events. For example:
c# - WPF Databinding - Getter/Setter for intermediary object not
c# - DataTrigger binding to a get-only property
properties - What Getters and Setters should and shouldn't do
python - How to trigger function on value change.



Reply all
Reply to author
Forward
0 new messages