Swift UIKit Diffable Data Source 배우기

1.이 기능을 사용하게 된 계기

개인 프로젝트나 클론코딩 혹은 소스를 보고 분석하다가보면 많은 사람들이 구현하고 있는 데이터 소스를 관리하는 방식이 정말 많은 걸느꼈다. UITableView 나 UICollectionView 이런것들을 사용한다. 사실 이는 가장 대표적으로 데이터를 리스트나 그리드 형태로 표시하는데에 있어서 가장 많이 사용되는 컴포넌트라고 할 수 있고(그에 대한 증거는 나이긴하다 ..ㅎ ) 사실 어찌됬던 다양한 소스코드에서 사용되어온 컴포넌트라고 생각을 한다. 사실 맨처음 쿠팡을 클론하던 도중에는 익숙한 이 컴포넌트를 사용하다가 보니 앱의 데이터가 변경될때 수동으로 뷰의 상태를 업데이트하거나 아니면 삽입 삭제등의 변경사항들을 반영하려면 좀 복잡하기도 한데? 라고 느껴서 좀 더 다른 컴포넌트를 알아보기 위해서 이 포스팅을 써보려고 한다.

 

2.Diffable Data Source의 도입 동기

 

2-1 . 데이터 동기화의 복잡성: 앱의 데이터가 변경될 때마다, 개발자는 수동으로 뷰의 상태를 업데이트하고, 삽입, 삭제, 이동 등의 변경 사항을 정확히 반영하기 위해 복잡한 로직을 작성해야 했습니다. 이 과정에서 실수가 발생하기 쉬웠고, 버그를 유발하기도 했습니다.

 

2-2 .성능 문제: 대규모 데이터셋을 다룰 때, 전체 뷰를 리로드하는 것은 비효율적이며 성능 저하를 일으킬 수 있었습니다.

 

2-3.애니메이션의 한계: 데이터 변경 시 자연스러운 애니메이션 효과를 적용하는 것이 어려웠습니다.

 

이 대답들은 Chat Gpt 에게 물어본 도입 동기인데 일단 이 Diffable Data Source 에 대해서 알아보기 위해서라면 이게 어떤 이유로 필요로 해서 나왔는지를 아는것이 가장 큰 문제라고 생각해서 물어봤고 그에 대한 대답은 이러했다.

내가 내린 결론은 데이터와 UI 사이의 동기화를 자동화하고, 데이터의 변경 사항을 효율적으로 관리하며, 사용자에게 부드러운 애니메이션을 제공하는 것을 목표로 하는구나 라는 결론이 떨어졌고, 오케이! 생각보다 되게 좋고 최신이다. 라고 생각을 했다.

그럼 이제 알아봐야겠지? 라고 생각했고 이는 3번으로 넘어간다.

 

3.Diffable Data Source의 개념

개념을 알아보자면 Diffable Data Source 는 데이트의 현재상태를 스냅샷으로 캡처를 한다고 한다. 음 스냅샷에 대한 개념은 생각보다 엄청 복잡하지는 않으니까 다른 브로그를 참고 해보면 좋을것 같다. 자 그래서 캡처를 하고 이를 사용해서 UI를 업데이트하는 개념이라고 생각하면 될 것같다. 즉 개발자는 데이터셋의 변경사항을 적용할 새로운 스냅샷을 만들고 이걸 데이터 소스에 적용하기만 하면 현재 UI와 새 스냅샷을 비교해서 필요한 최소한의 변경만을 자동으로 계산해서 업데이트 해준다. 라는 개념인것이다. 

 

4. 핵심 컴포넌트

그래서 어떤 컴포넌트들이 이 좋은 개념을 구현가능하게 구성해주느냐를 알면되겠다. 

• NSDiffableDataSourceSnapshot: 데이터의 현재상태를 나타내주는 변하지않는 불변 객체이다. 이거는 섹션과 아이템등을 추가하거나 삭제하는 작업을 통해서 새로운 스냅샷을 구성해주는 역할을 하는 녀석이다. 

그럼 이제 뷰를 업데이트해야하는데 그게 밑에 있는 친구들이다. 

• UICollectionViewDiffableDataSource / UITableViewDiffableDataSource: UICollectionView나 UITableView의 데이터 소스 역할을 뷰에다가 적용시켜주는 역할을 한다고 생각하면 된다

5. 예시 코드

백문이 불여일견 이제 한번예시코드를 보려고 한다.

 

var snapshot = NSDiffableDataSourceSnapshot<Section, Item>()
snapshot.appendSections([.main])
snapshot.appendItems(items, toSection: .main)

dataSource.apply(snapshot, animatingDifferences: true)

 

이 코드는 main 섹션을 가진 스냅샷을 생성하고, 여러 아이템을 해당 섹션에 추가한 다음, 이 스냅샷을 데이터 소스에 적용하여 UI를 업데이트하는 방법을 보여준다.  animatingDifferences: true 라는 소스에 파라미터는 변경 사항을 애니메이션으로 표시하도록 지정합니다.

 

6.결론

Diffable Data Source는 데이터 관리랑 UI동기화 과정에 있어서 어려운 복잡성을 대폭 줄여주고 , 애플리케이션의 반응과 성능을 향상시켜줄 수 있다. 또한 코드의 가독성과 유지보수성은 당연히 따라온다고 생각한다. 계속해서 발전해나가는 개발자가 되기위해서는 이런 신기술들을 꾸준히 배우고 적용해나가면서 나의 것으로 만든다라는것이 다른사람들과 차별을 주는것이라고 생각 한다.

내 깃허브에 쿠팡클론 소스에 HomeViewController 파일에 가보면 적용해본 예시도 볼 수 있다. !