react-native-slider icon indicating copy to clipboard operation
react-native-slider copied to clipboard

Add an option to skip componentDidUpdate

Open VinceBT opened this issue 3 years ago • 3 comments

When the parent component of the slider is updated while the user is moving the slider knob, a subtle lag can appear, this can be worse if the onValueChange trigger a setState that re-renders the whole DOM. This part of the code seems to be the cause, maybe we could add a boolean prop to tell if we should let this part trigger ? Or is there another solution ?

VinceBT avatar Sep 16 '22 21:09 VinceBT

@VinceBT have you tested that solution? I'd be open to a PR with this as an option if you can show me how it works and make sure it doesn't introduce any regressions.

miblanchard avatar Dec 28 '22 16:12 miblanchard

Hi, it's been a while, so I reopened the project and I checked what I did. I ended up doing this patch in local using patch-package

diff --git a/node_modules/@miblanchard/react-native-slider/lib/index.js b/node_modules/@miblanchard/react-native-slider/lib/index.js
index 074bd84..39b7743 100644
--- a/node_modules/@miblanchard/react-native-slider/lib/index.js
+++ b/node_modules/@miblanchard/react-native-slider/lib/index.js
@@ -138,24 +138,6 @@ export class Slider extends PureComponent {
             return statePatch;
         }
     }
-    componentDidUpdate() {
-        const newValues = normalizeValue(this.props, this.props.value instanceof Animated.Value
-            ? this.props.value.__getValue()
-            : this.props.value);
-        newValues.forEach((value, i) => {
-            if (!this.state.values[i]) {
-                this._setCurrentValue(value, i);
-            }
-            else if (value !== this.state.values[i].__getValue()) {
-                if (this.props.animateTransitions) {
-                    this._setCurrentValueAnimated(value, i);
-                }
-                else {
-                    this._setCurrentValue(value, i);
-                }
-            }
-        });
-    }
     _getRawValues(values) {
         return values.map((value) => value.__getValue());
     }

VinceBT avatar Dec 28 '22 22:12 VinceBT

Unfortunatedly, set parent state continues to be laggy, even with the patch :/

isaacbatst avatar Jan 30 '23 18:01 isaacbatst