How to identify that an attribute value is static or resolved immediately?

Hi @patrick,

I’m creating the conditions to call a function(or do whatever) when updating.

When the attribute is dynamic I can easily identify it because the updatedProps will change

Safari 14-03-2023 16.02.00 000300

In this example I can filter out the first 3 update calls.

However when an attribute resolves directly the 4 calls will be made.

Safari 14-03-2023 16.04.43 000302

I can declare a variable and use it as flag to stop this but I wanted to know if there is a good practice to handle this and filter out the 3 final calls.

How do you normally approach this?

The update is called each time something on the page called requestUpdate. In the render method you do your initial logic, for example generating the avatar when this.props.seed has a value. In the update method you check when the seed was changed, you do that by comparing props.seed with this.props.seed or by checking if the updatedProps has seed in it. If it was changed you want to regenerate the avatar, if nothing was changed you ignore the update.

That was a dumb lapsus.
I didn’t make the connection between “render” with “already available data” on render.

Peachy.

Dynamic and data not available on render:

Safari 14-03-2023 17.58.37 000308

Static or data available on render:

Safari 14-03-2023 17.59.39 000310

Il leave this example here as reference for others:

render: function () {
 if (this.props.seed) {
  this.set('dataUri', this.generate(this.props.seed))
 }
},
update: function (props, updatedProps) {
 if (updatedProps.has('seed')) {
  this.set('dataUri', this.generate(this.props.seed))
 }
}
4 Likes