4 min read

선언형 UI에 대한 나의 생각

최근에 Flutter를 사용하면서 느낀 생각
선언형 UI에 대한 나의 생각
Photo by Markus Winkler / Unsplash

태초의 개발

안드로이드를 개발하면서 XML을 이용하여 UI를 작성하는데 가장 귀찮은점이 기본 Material을 벗어나서 Custom UI를 개발할 때다.
작은 UI 쪼가리를 개발하기 위해 많은 시간과 코드를 소비하는데. 정말 작은 기능인데도 불구하고 작게는 30분 길게는 하루를 UI에 시간을 소비했던적이 있다. 특히 ToggleGroup과 Checkbox는 귀찮은 작업이다. 또 동일한 로직을 가지고 있는 화면에서 사용하기 위해 Fragment를 사용하는데 파일이 또 늘어나고, 처리해야하는 코드도 동시에 늘어난다. 눈앞이 캄캄해 진다.

Jetpack Compose 사용

Flutter를 쓰기 전에는 안드로이드의 Jetpack Compose를 먼저 사용해 보았다. 상태와 함께 무엇을 렌더링 할 것인가만 생각하면 작업하기 쉬웠기 때문에 금방 적응을 했다. 하지만, 느리다. 안그래도 느린 맥북과 안드로이드 스튜디오가 내 혈압을 상승시키는데 Compose의 장점이라고 할 수 있는 Preview가 코드를 한번 작성(수정)할 때마다 끊기기 시작하니 참을수없는 분노가 찾아왔다.
그래도 한 번 작성해둔 UI를 다른곳에서 쉽게 사용하고, 눈에 보이는 UI코드를 작성할 수 있어서 좋았다.

몇 번 사용해 보니 좋았는데 다시 옛날 프로젝트를 봐야하는 상황이 찾아왔었다. 이럴수가 Compose를 그리워할 줄은 몰랐다.
임시방편으로 아래처럼 코드를 작성하기 시작했다.

addLinearLayoutVertical {
    addCheckBox("동의합니까?") {
        setOnCheckedChangeListener { button, isChecked ->
            // 체크 처리
        }
    }
}

그렇다. 모든 UI들을 코드를 이용하여 작성하기 시작했다. Kotlin으로 작성했기 때문에서 Compose처럼은 아니지만 머릿속에서 그리면서 작성할 수 있었다. 직관적이고 빨랐다. 스스로 생산성이 올랐다고 칭찬했다. 하지만 미리볼 수 없었기 때문에 확인을 위해서 실제 스마트폰을 이용하여 확인할 수 밖에 없었다.
하나의 프로젝트를 이런식으로 코드만 작성해서 처리해 버린적도 있다.

Flutter

사이드 프로젝트를 시작했다. 이왕 시작하는거 그냥 iOS까지 배포하고 싶었다. 그런데 iOS를 안한지 조금 오래되서 다시 시작하려니 약속하지 못할것 같아서 크로스 플랫폼인 Flutter를 선택했다.
Compose와 크게 다르지 않아서 어떤식으로 작성하는지 어떻게 동작하는지만 파악하고, 바로 작업에 들어갔다. 뭐든 해보면 된다.

가장 큰 장점은 빠르다. 기존에 작업하는 방식과는 비교할 수 없을만큼 빠르고, UI를 구현함에 있어서 개발자가 신경써야할 게 많이 줄어들었다. 상태관리만 잘 해주면 의도대로 작동하는것이다. UI의 일부를 변경하고, 제거하고, 추가하는데 많은 비용이 들지 않는다.

개인적으로 Jetpack Compose와 Flutter를 많이 써보진 않았지만 Flutter가 훨씬 낫다. 답답함도 별로 없고, HotReload 기능을 가지고 있기 때문에 바로 확인할 수 있다. 네이티브 기능을 위해서 MethodChannel을 이용해야 하는거는 사소하게만 느껴질 뿐이다.