읽기완독률1 블로그 프로그레스 바 (scroll 이벤트, requestAnimationFrame, 완독률) 방문자 대부분이 글의 30% 지점에서 이탈하고 있었습니다. 오랜 시간 공들여 쓴 글인데 스크롤 깊이 지표가 그걸 보여줬을 때, 솔직히 좀 허탈했습니다. 글이 문제인지 구조가 문제인지 알 수가 없어서 프로그레스 바를 붙여보기로 했습니다. 상단에 얇은 바 하나 올리는 게 뭐가 어렵겠냐 싶었는데, 실제로 해보니 생각보다 손이 꽤 많이 갔습니다.scroll 이벤트와 requestAnimationFrame의 관계처음 코드를 짤 때 scroll 이벤트 핸들러 안에서 바로 style.width를 수정했습니다. 스크롤하는 순간 화면이 뚝뚝 끊겼고, 콘솔을 열어보니 이벤트가 초당 수십 번씩 발생하고 있었습니다. 여기서 scroll 이벤트란 사용자가 페이지를 스크롤할 때마다 브라우저가 연속으로 발생시키는 신호입니다. 문제.. 2026. 4. 28. 이전 1 다음
