gif 를 mp4로 랜더링 한후에 올렸는데

 

오히려 모바일 기기에서 가끔 버벅이거나 잠깐 검은 화면으로 바뀌었다가 재생이 되더라고요.

 

gif를 mp4로 랜더링 해서 올린거라 mp4가 용량이 1/10 작은데도 모바일에서 약간 늦게 뜨네요?

 

gif가 모바일 기기에서 cpu에 더 무리가 가는 거라고 생각했는데 제 생각이 틀린건가요?

  • profile

    gif는 여러 사진을 한 파일로 묶어놓은 것에 불과하므로, 용량은 크지만, 한 프레임만 도착해도 보여는 줄수는 있겠죠. 움직이지는 않더라도 정지상태로 화면에 보이기는 하는...

     

    mp4는 사진 한장 내에서도 압축이 되지만, 앞뒤 프레임간에도 압축이 됩니다. 3차원 압축이죠. 따라서 한 프레임을 보여주려면 앞뒤 프레임들 데이터가 있어야 합니다. 버퍼링이 좀 있는게 당연한데... 영화볼때는 1초 먼저보고 늦게보고 신경 안쓰니까 문제가 없는데, 웹페이지처럼 바로 떠야 하는 상황이면 눈에 거슬릴수도 있겠네요.

  • profile ?
    네 감사합니다
  • profile

    윗분 설명에 더해서, 대부분의 브라우저는 gif를 처음 표시하는 순간부터 첫 프레임을 보여주지만 <video> 태그는 첫 프레임 재생 전에 검은 화면이 나오는 것이 기본값입니다. 이 검은 화면의 임팩트가 나름 크기 때문에, 실제보다 한 박자 더 느리게 뜬다는 느낌을 주지요. 유튜브처럼 작정하고 영상을 볼 때 쓰라고 만들어진 표준이다 보니, gif처럼 바로 재생되어야 하는 상황에는 살짝 거슬리는 것이 사실이예요.

     

    <video> 태그에 poster 속성을 넣으면 이 찰나의 순간 동안 검은 화면 대신 보여줄 섬네일을 지정할 수 있습니다. 이걸 잘 활용하면 검은 화면의 임팩트를 줄일 수 있을지도 모르겠네요. 최근 라이믹스는 동영상 섬네일을 생성할 수 있는 경우 poster 속성에 섬네일 경로를 자동으로 넣어주고 있습니다. 그러나 그 섬네일을 로딩하는 데도 시간이 걸린다는 점을 감안하면, 체감상의 착시현상일 뿐 실제 로딩 속도는 오히려 느려질지도...?

  • profile ?
    네 감사합니다
    다른 방안이 없나 더 찾아봐야겠네요.