codestates / codestates/triplus

[Error] 이미지 로딩 지연 에러

Open
#331 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
0
Forks
4
PR merge metrics
No merged PRs in 30d

Description

## 어떤 에러가 발생했나요?
- debounce로 인한 이미지 로딩 지연과 reflow 현상 발생

### 에러가 발생한 폴더
- GuideCard.jsx

### 에러 메시지
- debounce로 인한 이미지 로딩 지연과 reflow 현상 발생

### 에러 원인
- setTimeout으로 scroll 이벤트를 감소시키려고 하였지만, 이는 이미지 지연 딜레이를 발생시킴.
- getBoundingClientRect로 인한 reflow 현상 발생

### 에러 해결 방법
이를 해결하고자 intersectionObserver API로 리팩토링 진행
```
useEffect(() => {
const interObserver = new IntersectionObserver(callback, option);
if (cardRef.current) interObserver.observe(cardRef.current);

return () => interObserver.disconnect();
}, []);
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.