Front-end/React Native Error

[React Native] You specified `onScroll` on a <ScrollView> but not `scrollEventThrottle`...

아지송아지 2022. 2. 13. 11:30

You specified `onScroll` on a <ScrollView> but not `scrollEventThrottle`. You will only receive one event. Using `16` you get all the events but be aware that it may cause frame drops, use a bigger number if you don't need as much precision.

 

IOS에서 RN 개발을 하다보면 ScrollView 사용 시 위와 같은 로그가 계속 뜰때가 있습니다.

 

<ScrollView>에서 onScroll 이벤트를 사용하는데 scrollEventThrottle을 정의하지 않아서 나는 것입니다.

 

 

scrollEventThrottle란

스크롤하는 동안 스크롤 이벤트가 발생하는 빈도를 제어합니다. (ms 단위의 시간 간격)

숫자가 낮을수록 스크롤 위치를 추적하는 코드의 정확도가 향상되지만 bridge를 통해 전송되는 정보의 양으로 인해 스크롤 성능 문제가 발생할 수 있습니다. 정확한 위치 추적이 필요하지 않은 경우에는 값을 더 높게 설정합니다.

default는 0이며 스크롤 될 때마다 이벤트가 한번 실행됩니다.

 

이해가 잘 가지 않아 코드로 직접 테스트해 보았습니다.

scrollEventThrottle={0}은 스크롤을 하려고 터치하고 드래그를 하는 순간이벤트가 단 한 번 실행되었습니다.

scrollEventThrottle={1}은 드래그를 하는 동안 계속 실행되었습니다.

 

* bridge -> JS Thread가 bridge를 통해 Native Thread와 통신하는걸로 알고있습니다.

 

참고 : https://reactnative.dev/docs/scrollview#scrolleventthrottle-ios