선언형 UI 에 대한 지극히 개인적인 생각

몇년전부터 많이 언급되고 실제로 사용도 많이하고 있는

선언형 UI 에 대해서 한번쯤 이야기 해보고 싶었다.

여러가지가 있겠지만 내가 경험해본 선언형 UI 는 compose , flutter 가 있다.

 

선언형 UI 라고 하면 

 

라는 개념이 심심치 않게 나오는데 STATE 라고 하는 상태라는 개념이 

컴포즈에서는 컴포저블, 플러터에는 위젯으로 존재하는 것에 들어갔을때

그에 맞는 View를 생상하는 개념이 있다.

 

그래서 xml, html, 또는 명령형 프로그래밍 처럼 특정 view에 하나하나 값을 나열해서

넣어주는게 아니라  state 를 파라미터로 받아 좀 더 직관적이고 짧은 코드로 UI를 작성 할 수 있다고 한다.

 

그럼 직접 명령형 프로그래밍 처럼 값을 set 해주는것도 아닌데 도대체 어떻게 

view를 바꿀까?

 

선언형 UI 들은 그래서 저 state 라는 개념을 사용하여

해당 값이 바뀌었을때 그 state 값을 사용하는 view를 새로 그려내는식으로 동작한다.

조금씩 진영에 따라 다를수는 있겠지만 큰 개념은 대부분 비슷하다.

 

그래 여기까지는 일반적인 선언형 UI 에 대한 이야기고 

나는 직접 사용해보며 느낀것들을 적어보려고 한다.

 

먼저 괜찮다고 느낀점들

1. 딱보면 딱 안다.

 무슨 소리냐면 UI 코드를 읽으면 '아~ 이게 뭘 그릴려고 하는거구나' 하는게 직관적으로 눈에 들어온다.

어떤 색으로 만들어질거며 어떤 배치고 어떤 모양인지 그냥 코드만 읽어도 굳이 xml 이나 속성이 따로 설정된 리소스 파일로 가지 않아도 바로 알 수 있다. 

2. UI 관련 리소스 관리가 편하다.

위의 내용과 이어진다. 리소스 파일로 따로 속성을 제어하지 않고 그냥 UI 코드를 작성하면서 한 곳에서 모든걸 해결 할 수 있다. 

3. 재사용하기 편하다.

어떤 view를 재사용하고 싶다면 해당 부분 ui만 따로 빼내서 xml 파일로 빼내고 include 를 해서 재사용한다던가

번거로운것들이 많은데 선언형 UI는 그냥 코드를 가져다쓰면 끝이다. 따로 모듈화 시켜서 빼내면 

그냥 선언만 해주면 귀찮은 반복적인 UI는 뚝딱뚝딱 만들어진다.  조금씩 변화가 필요하다고 해도 

state 를 이용하면, 즉 파라미터로 속성값을 지정해주면 거기에 맞게 변화도 줄 수 있으니 재사용하기엔 아주 편리하다.

 

의아하게 느낀점들

 

1. 화면을 그리는 코드가 너무 방대해진다.

내가 코드를 분리를 잘 못하는건지 어떤건지는 모르겠으나 생각보다 화면을 그리는쪽 코드가

너무 블럭이 많아지고 어디에 뭐가 있는지 보기가 어지러울때가 종종 있다.

 

2. 화면을 그리는것에 있어서 개발자의 부담이 커진 느낌이다.

그리는것 자체에 대한 난이도를 말하는것이 아닌 view를 좀 더 효율적으로

보여주기 위해 개발자가 해야하는 고민이 더욱 늘어났다고 생각한다.

이전에는 xml 로 뚝딱 뚝딱 그리는 느낌이였다면 지금은 위젯을 새로 그릴때

최소한의 리로드를 만들기 위해 화면을 그리는것에서부터 고민을 시작해야한다.

 

어디까지나 개인적인 생각이고 내가 의아하다고 생각했던 점들이 나의 실력이 올라감에 따라

장점으로 바뀔수도 있다고 생각한다.

어찌됐던 선언형 UI 의 생산성과 재활용성 그리고 최근 트렌드로 주목 받는

반응형 프로그래밍에도 찰떡이라 충분히 배울 가치가 있고 더 배워나갈 생각이다.