react-native-slider
react-native-slider copied to clipboard
Add an option to skip componentDidUpdate
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 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.
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());
}
Unfortunatedly, set parent state continues to be laggy, even with the patch :/