[React] useEffect vs useLayoutEffect: Panning 기능 개선 사례
두 문서나 이미지 등을 비교하는 뷰어에 Panning 기능이 있는데, 최근에 이 기능에 대한 개선요청이 들어왔다.요청사항은 아니었지만 기능을 살펴보던 중 두 작업물에 싱크가 걸려있는 상태에서 Panning 기능을 수행하면, 싱크가 깨지는 문제를 발견했다. 또 각 뷰어에 중복된 코드가 존재해서 코드 공통화와 함께 싱크 문제를 해결해보기로 했다. 싱크 문제 해결: useEffect 활용useEffect(() => { element?.style.transform = `matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, ${xx}, ${yy}, 0, 1)`; element_right?.style.transform = `matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0..
더보기
