react translate scroll is a component which scroll function is emulated by css translate.
By using browser scoll, the performance problematic if you wanna get and set scroll position every 10 milliseconds.
For example, if you wanna completely syncronize scroll position of two elements, the overhead of it is nonignorable.
Using css translate attribute is a good solution and this component offers it.
yarn add git+ssh://git@github.com:kageomi/react-translate-scroll.git
import TranslateScroll, { ScrollEventHandler } from "react-translate-scroll"
const handleScroll: ScrollEventHandler = (position) => {
const { top, left } = position
console.log(top, left)
}
<TranslateScroll
scrollTop={100}
scrollLeft={100}
style={style}
onScroll={handleScroll}
>
<div>hogehoge<div>
<div>hogehoge<div>
<div>hogehoge<div>
</TranslateScroll>