안드로이드 앱 성능 최적화 - 2. 최적의 레이아웃 구성 확인방법

안드로이드 플랫폼이 국내에 출시 된지도 약 3년이라는 시간이 지났습니다. 개발자들도 많은 경험이 축척되면서 앱의 퀄리티는 점점더 높아지고 있으나, 아직 해외 만큼의 퀄리티를 가진 국내앱은 손에 꼽힐 정도라고 생각합니다. 이런 퀄리티 높은 앱을 개발하기위해 좀 더 성능을 높이는 방법에 대해 소개 하기위해 "안드로이드 앱 성능 최적화"라는 주제를 가지고 연제글을 쓰게 되었습니다.

안드로이드 앱 성능 최적화 - 2. 최적의 레이아웃 구성확인 방법

레이아웃이 그려지기 위해서는 Main Thread에서 xml의 레이아웃을 파싱해서 해당 View를 그립니다. 레이아웃의 구조가 많거나 복잡하면 그리는 시간이 오래 걸리기때문에 사용자들은 반응이 느리다라고 느끼게 됩니다. 앱이 좀더 빠르게 작동되도록 하기위해서 레이아웃 구조 최적화는 필수 요소입니다.

최적화된 레이아웃인지 확인 하는 방법중 안드로이드 4.2부터 개발자 옵션에 불필요하게 드로잉 되는 영역을 알려주는 기능이 있습니다. Show GPU overdraw를 활성화 한다음 앱을 실행하면 드로잉 횟수를 색상으로 표현 해줍니다.

Blue 1번 

Green 2번 

Light Red 3번

Dark Red 4번 이상

구글에서는 Light Red인 3번 정도까지는 무리 없으며 Dark Red는 최대한 없게 만들어라고 제안해주고 있습니다. 

여기에서 Draw되는 영역은 테마의 윈도우 배경도 포함 됩니다.

레이아웃에서 특별히 배경을 따로 주었다면 테마의 윈도우 배경은 android:background="@null"을 주어 없애도록 합시다. 간혹 android:background="@android:color/transparent"를 주는 경우가 있는데 눈에는 보이지 않지만 실제 내부적으로 draw하게 되니 @null로 주어 그려지지 않게합시다.

이렇게 가이드라인이 잘 지켜지고 있나 보기위해 몇개의 앱을 실행 해보았습니다.

구글에서 만든 앱인 구글 플레이와 구글 플레이어를 실행 해보았습니다. 빨강색은 거의 찾아 볼수 없을 정도로 최소한으로 그려지게 레이아웃을 구성 한것을 볼 수있습니다. 

해외 유명한 앱들도 테스트 해보면, 빨강색이 거의 찾아 볼 수 없을 정도로 최적화된 레이아웃을 구성하고 있습니다.

국내 유명한 앱들도 테스트를 해보니, 빨강색이 아닌 부분을 찾아 볼 수가 없습니다. 필요이상으로 draw되고 있다는 것을 보여주고 있습니다.

이런식으로 Over Draw가 되는 곳에는 레이아웃을 단순하게 정리해야 될 필요가 있다는 것을 확인 해보 실수 있습니다.

다음 시간에는 이런 Over Draw된 영역을 어떤식으로 최적의 레이아웃을 구성하는지에 대해 알아보겠습니다.