Performance on moving : slow movement

[chamartt]

Hi,

I would like to use your package to restrict the number of Custom widgets (in a column) depending on the range choosen by the user. So I used your "RangeSlider".

Unfortunatly, I have seriously performance problem during the movement of the cursor. Even if I only put onChanged: (double newLowerValue, double newUpperValue) { setState(() { _lowerValue = newLowerValue; _upperValue = newUpperValue; }); }, ) the problem is still present.

I saw that if I show only 10 items (manually) of my Custom Widget, the problem disappear, if I show 20-30 it begins to be bad...

So the performance of the cursor moving is indirectly lied to the numbers of elements show on the same page. It's the same with the default widget RangeSlider of Flutter.

Do you know why that is happens ?

Thank you in advance for your help !

[boeledi]

Hi Tom,

Difficult to answer without having a look at your source code but when we are dealing with the notion of "setState", we need to make sure we are only invalidating the part of the screen that needs to be rebuilt (and not the entire page).

Therefore, may I ask you if you have 20-30 instances of the RangeSlider in the "same" StatefulWidget or do you have 20-30 instances of a StatefulWidget which only contains 1 RangeSlider ?

If the answer to the question is the first option, please consider having 1 RangeSlider per StatefulWidget. This will already improve the performance.

Could you please keep me informed?

Thanks

Didier

[chamartt]

Hi Didier,

Thank you for the (quick) reply.

Effectively, if I leave empty the onChanged method (so without setState call), the cursor move perfectly.

In my page, I have my cursor and one column which can contains 100+ Stateful Custom Widget (these Custom Widget not contains any RangeSlider) So I have only one instance.

Is the initState method called every time that setState is called ? Maybe the problem is here.

Thank you again.

[boeledi]

Hi Tom,

Let me recap. You have 100+ StatefulWidgets + ONE RangeSliver. All these Widgets are part of a SAME StatefulWidget. Am I right?

Does the RangeSlider "value" have any impact on any of these 100+ StatefulWidgets?

If the answer is "no", please consider creating a new StatefulWidget which will ONLY contain the RangeSlider. This way, when you will invoke the "setState()" inside this new StatefulWidget, it will only rebuild the RangeSlider and NOTHING else.

To answer your question, no the initState is only invoked ONCE (at the moment that Flutter instantiates the State of the Widget).

The problem I can understand is that your StatefulWidget container (which contains the 100+ custom Widgets + RangeSlider) is being rebuilt each time you are invoking the setState, following a variation of the RangeSlider.

Please let me know if this helps

[chamartt]

Thank you so much, the problem was there. I put my refresh of my item's number on changeEnd and put nothing on the onChange, so my number is updated when the finger leave the screen, which is suffisant in my case ! Thank you for your reactivity and your help !