다수의 이미지가 존재하는 화면의 경우엔 이미지가 한꺼번에 로딩이되며 랜더링 속도가 저하된다. 그리고 사용자가 모든 이미지를 다 보지 않을 경우엔 불필요한 이미지가 로딩되어 데이터가 낭비된다. 랜더링 성능 향상 및 불필요한 데이터 낭비를 줄이기 위해 화면에 보여지는 항목만 이미지만 로딩될 수 있도록 조치가 필요한다. 1. img 태그에 src 지정하지 않기. 2. 이미지 로딩 1) 스크롤 이벤트를 이용 2) 화면에 보여질 Y축 포지션 값(bottomPos)을 설정 3) 화면에 보여질 img 항목들을 필터링 4) img의 top 포지션값이 bottomPos보다 작을 경우 src값을 설정 5) opacity값을 변경하여 화면에 표시 (opacity : 0 -> 1)로 변경 // Simple Image Lazy..