React Intersection Observer

네이티브 Lazy Loading + Intersection Observer를 활용한 이미지 지연 로딩

핵심:하이브리드 Lazy Loading - 최신 브라우저는 네이티브loading="lazy" 사용, 구형 브라우저는 Intersection Observer로 폴백

✅ 장점: 최적의 성능 (네이티브), 완벽한 브라우저 호환성 (Observer 폴백), 메모리 효율성, 네트워크 대역폭 절약, 자동 폴백 처리

❌ 단점: 초기 로딩 시 빈 공간, 복잡한 조건부 로직, 브라우저별 동작 방식 차이

💡 사용 시나리오: 이미지 갤러리, 소셜 미디어 피드, 상품 목록, 뉴스 피드, 대규모 이미지 목록

🔧 동작 방식:loading 속성 지원 여부를 확인하여 네이티브 lazy loading 또는 Intersection Observer를 선택적으로 사용