[SwiftUI] 뷰의 성능 개선(2) - 뷰의 slow update 개선 | WWDC23. Demystify SwiftUI performance

 

> 뷰의 성능 개선 시리즈

[SwiftUI] 뷰의 성능 개선(1) - Dependency 관리
[SwiftUI] 뷰의 성능 개선(2) - 뷰의 slow update 개선
[SwiftUI] 뷰의 성능 개선(3) -Identifier의 중요성

 

 

이번 글은 뷰 성능 개선 (1), (3) 보다는 간단한 글이 될 것 같다. 근데 실제 프로젝트에 대한 성능을 개선할 때 고려해야 할 점을 언급한 부분이 있어서 작성해 본다.  

 

첫 번째 성능 개선 글에서는 dependency와 뷰의 업데이트 "횟수"에 초점을 맞췄다면, 이 글에서는 뷰가 업데이트 될 때 사용되는 비용을 줄여 "속도"를 개선하는 것에 초점이 있다.

 

 

📍 반응성 저하(reduced responsiveness)

뷰가 느리게 업데이트 되는 것이 어떤 문제가 있길래? 사용자가 버튼 탭 등 어떤 이벤트를 일으켰을 때 그에 대한 반응이 즉각적으로 나타나지 않고 느리게 나타나는 것을 “반응성 저하(reduced responsiveness)” 라고 하고 이렇게 되면 사용자 경험에 좋지 않은 것은 모두가 알 것이다.

 

"반응성 저하(reduced responsiveness)” 에는 hang과 hitch가 있는데 각각에 대해 간단히 살펴보면

 

✔️ hang

• 유저 인터렉션에 대한 반응이 딜레이되는 것
• e.g. 초기 appear가 시간이 오래 걸리는 것, 한 번에 많은 이미지를 불러와서 이미지가 느리게 뜨는 것

✔️ hitch

• 사용자가 인지할 수 있는 애니메이션 문제
• Render Loop가 제 시간에 프레임을 완료하지 못하면 발생한다
• e.g. 스크롤 / 애니메이션 / 화면 트렌지션이 건너뛰어지거나 버벅거리는 것

 

 

 

hang과 관련해서는 Instruments를 활용한 분석 방법에 대해 WWDC 세션도 있다. hang에 대한 분석 방법을 넘어서 사용자의 인터렉션이 일어난 후 그에 대한 반응이 어느 정도 시간 이후에 일어났을 때 불편함을 느끼는지와 같은 지점도 생각해 볼 수 있어서 재미있었다!

https://developer.apple.com/videos/play/wwdc2023/10248/

Analyze hangs with Instruments - WWDC23 - Videos - Apple Developer

 

hitch에 대한 내용은 Tech Talk 비디오에서 더 자세하게 이야기한다. 그치만 지금 상태에선 어려운 기술적 이야기들이 담겨 있어서.. 천천히 보고 공유하고 싶은 내용 있으면 블로그로 작성해 보겠다!

https://developer.apple.com/videos/play/tech-talks/10855

Explore UI animation hitches and the render loop - Tech Talks - Videos - Apple Developer

 

 

 

어우 역시 WWDC는 제대로 이해하려면 하나만 볼 수가 없고 연결된 문서랑 세션이 너무 많음 ㅎㅎ 그래도 관심 있는 건 마치 마인드맵 마냥 가지치기해서 알아 나가는 게 참 재밌다

 

 

 

 

 

 

 

📍 slow update의 요인

• 비용이 많이 드는 동적 속성을 인스턴스화할 때
  • e.g. StateObject를 초기화/할당 / State를 초기화
• 비싼 view body
  • body는 그 자체로 최대한 리소스, 비용이 적게 드는 게(cheap) 중요!
  • 리소스 많이 드는 문자열보간법, 데이터를 필터링하는 작업들이 body 내부에 있는지 확인해야 한다
• slow identification
  • 이것도 view body에서 자주 일어날 수 있는 건데, '뷰의 성능 개선' 세 번째 글에서 List를 사용할 때 뷰의 식별 속도에 대한 내용으로 다룰 예정!

 

 

 

 

 

 

📍 대표적인 문제코드와 해결코드

init 시점에 시간이 오래 걸리는 작업을 동기적으로 진행하게 된다면 뷰가 느리게 업데이트됨

 

 

task 수정자를 사용해서 비동기 적으로 뷰를 업데이트해 주자

 

 

 

 

---

 

 

 

여튼 이렇게 사용자의 기대와는 다르게 반응이 느리게 나타나거나 이상하게 나타나는 경우는 보통 뷰가 업데이트되는 속도가 느리기 때문이다. 아마 hang이나 hitch와 같은 반응성 저하에 대한 코드는 여러 경우에 발생할 것 같은데 추후 최근 프로젝트에 대한 성능 개선을 하면서 분석하고 작성해보려 한다!