css (1) 썸네일형 리스트형 will-change UI나 UX가 괜찮아보이는 페이지를 보고 따라 만들어보는 중에 transform을 사용해서 hover로 변경될 때 애니메이션을 적용했다.근데 애니메이션이 약간 버벅인다고 해야되나 부드럽지 못하게 보였다. 퀄리티가 정말 떨어져보이고 별로 안 예뻐서 찾아보던 중에will-change라는 css속성을 찾았다. will-change: transform; 이 한 줄 추가되니깐 애니메이션이 부드러워지는 걸 봤다.브라우저에게 엘리먼트가 어떤 변경을 할 것인지 미리 알려주는 속성이라고 한다.참고글을 보니깐 transform으로 처리되는 부분과 엘리먼트를 따로 관리하고 다시 합쳐서 출력하는 중에 지연이 생겨서 처음에 버벅이는 현상처럼 보였던 것 같다.transform은 GPU가속이 자동으로 활성화 되지 않아서 렌더링이 .. 이전 1 다음