Infinite Scroll

[이미지 렌더링: 01] 무한스크롤과 이미지 렌더링

타 사이트들을 돌아다니며, 크롬 개발자 도구의 Ligthouse 를 사용하여 성능 측정을 해보았다. 꽤나 많은 사이트들이 성능 점수에서 낮은 것을 확인할 수 있었고, 이에 대한 이유를 파악해보고자 하였다. 해당 사이트(어디인지는 비밀 ㅎ...)는 성능적으로 매우 아쉬운 점수를 보였다. 체감 상, 이 점수대의 성능에서는 웹 인터렉션이 빠르다 라는 체감을 전혀 받지 못하는 것 같다. 다소 버벅거림이 있는 성능, 주된 원인으로서 이미지라 생각했다. 해당 사이트는 다량의 이미지를 렌더링하는데, lazy loading과 같이 성능적인 설계를 전혀 고려하지 않았었다. 조금 더 근거를 얻기 위해 Lighthouse의 의견을 들어보았다. 이미지 인코딩과 크기, 차세대 형식 및 오프스크린 이미지 지연하기를 제외한 부분들..