반응형 웹 속도가 떨어지면 어떻게?

일반입력 :2014/11/21 09:42    수정: 2014/11/21 10:02

웹사이트 제작에 있어 반응형 웹이 한동안 화제거리였다. 한 코드 소스로 디바이스마다 최적화된 화면을 보여줄 수 있다는 장점이 다양한 모바일 기기에 맞는 웹 서비스를 제공해야 하는 요구조건과 잘 맞기 때문이었다.

그러나 반응형 웹을 활용해 웹페이지를 만든 여러 기업과 조직에서 생각지도 못한 난관에 봉착했다. 전보다 웹사이트 성능이 떨어지거나, 사용자가 몰리면 접속 자체가 힘들어지는 사태가 벌어진 것이다. 또한 모바일을 위해 만든 반응형 웹 기반 페이지가 모바일 환경에서 제대로 작동하지 못하는 문제도 벌어졌다.

아카마이코리아의 안준수 제품전략담당 이사는 이처럼 반응형 웹 도입 후 나타나는 문제점에 대응하려면 콘텐츠딜리버리에 대한 운영부분에 투자해야 한다고 조언했다.

그는 “과거의 웹사이트는 동적, 정적 콘텐츠가 공존했지만, 반응형 웹은 모든 페이지가 동적으로 작동하므로 모든 트래픽이 캐싱을 넘어 서버까지 가야 한다”며 “콘텐츠와 사용자의 거리가 멀어지니 당연히 성능 저하가 생기게 된다”고 설명했다.

이어 “요즘 반응형 웹을 만들 때 고해상도 이미지를 많이 쓰게 돼 전체 트래픽이 늘어나게 된다”며 “이미지 하나에 5MB에 달하는 상황은 서버 부하를 늘리는 또 하나의 이유”라고 덧붙였다.

모바일에 대응하기 위해 썼던 반응형 웹이 모바일에서 제 역할을 하지 못하는 현상은 최적화와 관련된 부분이다.

안 이사는 “모바일과 PC 웹을 동시에 만족시켜야 해서 어느 한 쪽에 맞춰 최적화하기 힘들어지게 된다”며 “PC에선 잘 되는 웹이 모바일에선 기기 성능 때문에 웹 성능이 떨어지는 현상이 나타난다”고 설명했다.

또 “모바일 때문에 만든 반응형 웹페이지가 모바일에서 오히려 성능이 나빠지는 아이러니다”라고 언급했다.

성능저하, 서버부하증가, 모바일 최적화 부족 등의 현상은 웹페이지 설계를 잘못해서 생겨나는 문제라 보기 어렵다. 웹을 사용자에게 전달하는 체계에서 문제가 벌어진다.

안 이사는 “성능 저하 문제는 동적 페이지를 빠르게 작동시키기 위해 트랜잭션을 가속하는 기능이 필요하다”며 “일부 트랜잭션에만 썼던 가속 기능을 전체 트랜잭션으로 확대하면 성능을 높일 수 있다”고 말했다.

트래픽 증가에 따른 서버 부하 증가 문제는 CDN의 캐시로 해결할 수 있다. 캐시는 과거 인터넷 네트워크의 전반적인 속도가 나빠 속도를 높이기 위해 최대한 접속 기기 가까운 곳에 콘텐츠를 임시저장하는 기능이었다. 인터넷 인프라가 급속도로 발전하면서 캐시의 가치는 전보다 퇴색했지만, 반응형 웹에서 더 적극적으로 사용해야 한다는 게 안 이사의 설명이다.

그는 “서버에 대한 부하가 늘어나는 만큼 거꾸로 캐시를 더 적극적으로 사용함으로써 부하를 줄일 수 있는 확률을 높여야 한다”고 설명했다.

여기에 모바일을 위한 최적화된 전송 기능이 유용한 해법으로 제시된다. 모바일에 적합하지 않은 불필요한 웹 코드를 제거함으로써 모바일 기기의 부족한 성능에 대응하는 것이다.

안 이사는 “불필요한 HTML 코드들을 기기에 전달되기 전 마지막 단에서 제거하고 보낼 수 있어서 모바일엔 더 적합한 용량의 데이터를 보낼 수 있다”며 “웹 개발 단계에선 초점을 어디 한 곳에 둘 수 없으므로, 전달 체계 단계에서 모바일에 최적화해 뿌려야 한다”고 말했다.

그는 “한국이야 이동통신 접속환경이 좋지만, 해외는 3G를 쓰는 곳이 여전히 많으며, 모바일 기기 자체적으로 스레드를 여러 개 쓰지 못해서 페이지 최적화를 자동화하는 게 중요하다”고 덧붙였다.

그는 아카마이의 가변비트레이트 전송 기능을 마지막 해법으로 제안했다. 콘텐츠 제공자가 원본 이미지만 만들면, 아카마이가 클라우드 환경에서 접속기기 스펙에 맞게 해상도와 압축포맷, 용량 등을 변환해 전달하는 것이다. 사용자의 접속 환경에 맞는 이미지 버전 변환을 자동화하므로 콘텐츠 제공자의 부담이 확 줄어든다.

아카마이에서 제시한 해법 4가지는 새롭게 개발된 건 아니다. 이미 아카마이 웹 CDN 솔루션 ‘아이온’에서 제공해온 옵션 기능이 반응형 웹이란 트렌드에서 재조명받았다고 볼 수 있다. 이미지 자동 최적화 기능은 클라우드형 서비스인 ‘클라우드렛(CloudLet)’으로 이용하는데, 필요할 때만 사용료를 지불하고 쓸 수 있다.

그는 ”사실 웹 개발을 아웃소싱하게 되면, 전달에 대한 코드 최적화보다 기능구현과 디자인만 신경 쓴다”며 “사실 웹사이트를 만든다는 건 제작비용보다 오히려 사용자를 끌어들이기 위한 마케팅 등 전송 비용에 더 많은 돈을 쓰게 된다”고 말했다.

이어 “그런데 비싼 홍보와 마케팅으로 사용자를 불렀다고 해도, 정작 웹의 성능이 나오지 않는다면 그 비용은 100% 낭비가 된다”며 “웹페이지 제작에 2천만원 쓰고 홍보를 위한 배너 광고에 4천만원을 썼는데, 사용자가 몰려서 사이트가 죽었다면? 그만큼 웹의 성능에 투자하는 가치는 충분하다”고 강조했다.

관련기사

반응형 웹은 일반 사용자 입장에서도 필요없는 데이터까지 다운로드 받게 하고, 전체 기기 성능을 떨어뜨릴 수 있다. 모바일을 위한 반응형 웹이 이동통신비용을 늘리고, 경험을 나쁘게 하는 상황을 초래한다. 모바일 사용자를 배려한다면 기업은 웹페이지 제작 투자말고도 전달에 대한 투자를 고민해야 한다.

그는 “국내 웹 개발자의 실력은 훌륭하지만, 반응형 웹은 누구도 성능을 장담할 수 없다”며 “또 글로벌 서비스를 하는 경우라면 더욱 무한대의 성능변수에 대응하기 위해 CDN 기능을 필요로 한다”고 강조했다.