난제를 해결한 iOS 키보드 레이아웃 최적화 전략
최근 iOS 키보드 레이아웃을 최적화한 과정과 함께 만든 성과를 공유하려고 합니다. 우리가 쉽게 접근할 수 있는 일반적인 레이아웃 방식의 분명한 한계가 존재하기 때문에 새로운 시각에서 출발해 근본적인 문제를 해결할 필요가 있었는데요.
그동안의 노력이 어떤 성과를 만들었는지 같이 살펴볼까요?
사용자 경험과 안정성의 중요성
키보드 앱을 개발할 때 가장 중요한 것은 사용자 경험이에요. 사용자는 매일, 매순간 키보드를 통해 입력하기 때문에, 입력 과정에서의 아주 작은 불편함도 용인할 수 없죠. 특히, 타이핑 도중에 메모리가 부족하거나 렉이 발생하면 사용자는 큰 불편을 겪게 됩니다. 이는 앱의 신뢰성을 떨어뜨리기 때문에, 키보드 입력에서의 버그를 최소화하고 안정성을 극대화하는 것이 저희의 최우선 과제입니다.
최적화는 쉽지 않은 도전이지만, 저희는 늘 더 가볍고 빠른 키보드를 위해 새로운 방법을 찾아내기 위해 항상 노력 중입니다! 😉
최적화를 위한 노력: PinLayout과 FlexLayout 도입
최근 우리는 더 가볍고 빠른 키보드를 제공하기 위해 서드파티 레이아웃 엔진인 YogaLayout을 기반으로 한 PinLayout과 FlexLayout을 도입했습니다.
Apple의 AutoLayout을 사용하지 않고, 전부 PinLayout과 FlexLayout으로 전환하는 데 성공했습니다. 이 과정은 간단하지 않았지만, 결과적으로 큰 성과를 이뤘습니다.
iOS 플레이키보드는 세 번의 레이아웃 코드 구조 변화를 겪었습니다. 각각의 변화는 사용자 경험을 개선하고, 개발 효율성을 높이기 위한 중요한 단계였습니다.
첫 번째 레이아웃 코드 구조: NSLayoutConstraint
첫 번째로 사용된 레이아웃 방식은 NSLayoutConstraint였습니다. 이는 iOS 개발자들에게 가장 익숙한 방식으로, 서드파티 라이브러리 없이 레이아웃을 구성할 수 있는 큰 장점을 가지고 있습니다. 하지만 이 방법에는 분명한 한계가 존재했습니다.
NSLayoutConstraint를 사용하면 코드가 길어지고 가독성이 떨어지며, 유지보수가 어려워집니다. 코드가 길어질수록 오류가 발생할 가능성이 높아지고, 이를 수정하기 위한 시간이 증가합니다. 또한, 가독성이 떨어지면 코드 리뷰 시간에도 큰 영향을 미치게 됩니다. 안정적인 코드를 작성하는 것도 중요하지만, 읽기 쉬운 코드를 작성하는 것은 팀 전체의 효율성을 높이는 중요한 요소입니다. 그렇기에 새로운 코드로의 전환을 시도했습니다.
두 번째 레이아웃 코드 구조: SnapKit
두 번째로는 SnapKit을 사용하여 레이아웃을 구성했습니다.
SnapKit은 NSLayoutConstraint를 기반으로 코드를 더 읽기 쉽게 만들어주는 라이브러리로, 일반적인 앱 개발에서 많이 사용되는 레이아웃 기법입니다.
SnapKit을 도입함으로써 우리는 코드 가독성을 크게 향상시킬 수 있었고, 이는 원활한 코드 리뷰와 유지보수에 도움이 되었습니다.
SnapKit의 도입은 우리 팀이 더 효율적으로 일할 수 있도록 도와주었으며, 개발 속도를 높이는 데 기여했습니다.
세 번째 레이아웃 코드 구조: PinLayout과 FlexLayout
가장 최근에는 PinLayout과 FlexLayout을 사용한 레이아웃으로 전환했습니다.
이 두 라이브러리는 YogaLayout을 기반으로 하며, 더 직관적이고 성능이 뛰어난 레이아웃 구성을 가능하게 합니다.
그러나 FlexLayout에는 키보드 키를 일정 간격으로 배치하는 기능이 없었습니다.
기존 YogaLayout에는 gap이라는 기능이 있었지만, FlexLayout에는 구현되지 않았습니다. 그래서 우리는 이 기능을 직접 구현하기로 결정했습니다.
기능 구현의 도전과 해결
c++로 구현된 YogaLayout의 gap이라는 기능을 분석한 후, 이를 Swift에서 사용할 수 있도록 브릿징했습니다.
그리고 저희 팀은 PR을 올려 구현된 구조에 관련되어 의견을 주고 받았고, 이를 확인하는 Test코드를 추가함으로써 기능의 안정성을 보장했습니다.
컨트리뷰트를 한 후, 다시 전환작업에 착수했습니다.
많은 것을 한 번에 바꾸는 것은 큰 위험을 동반하기 때문에, 우리는 작은 것부터 천천히 변경하기 시작했습니다.
먼저 키들을 일정한 간격으로 배치하는 StackView를 대체했고, 그다음에는 키보드 전체 레이아웃을, 마지막으로는 키보드 높이를 구성하는 로직까지 전환했습니다.
이를 통해 성공적으로 PinLayout과 FlexLayout을 도입할 수 있었습니다.
성과와 안정성 향상
키보드 레이아웃 전환 과정이 끝나면서 우리는 안정성을 66%에서 약 99%까지 크게 향상시킬 수 있었습니다.
이는 사용자 경험에 큰 변화를 가져왔으며, 성능 지표에서도 긍정적인 결과를 확인할 수 있었습니다. 사용자 만족도는 물론, 키보드의 전반적인 성능도 크게 개선되었습니다. 🎉
안정성이 향상됨에 따라, 사용자가 키보드 입력 도중에 경험할 수 있는 렉이나 메모리 부족으로 인한 문제를 경험하는 빈도를 크게 걱정하지 않아도 되었습니다. 이는 사용자 경험을 크게 향상시켰고, 결과적으로 앱의 평가와 리뷰에도 긍정적인 영향을 미쳤습니다. 또한 앞으로 추가될 다양한 기능들을 넣을 수 있는 기초적인 발판이 되기도 했죠.
오픈소스 기여와 커뮤니티 참여
이번 과정에서 우리는 오픈소스 커뮤니티에도 기여할 수 있었습니다. 필요한 기능을 직접 구현하고, 이를 GitHub에 공개함으로써 다른 개발자들도 이를 활용할 수 있도록 했습니다.
변화가 많지 않고 간단했던 기여였지만 의미와 상징성이 있었어요.
이는 단순히 우리의 문제를 해결하는 것을 넘어, 이 분야에 도움이 되는 일을 했다는 점에서 큰 보람을 느꼈습니다. 오픈소스에 기여함으로써 우리는 더 많은 사람들과 지식을 공유하고, 함께 성장할 수 있었습니다.
하지만 우리는 앞으로도 오픈소스 커뮤니티와 적극적으로 협력하여 더 나은 솔루션을 제공하고, 함께 성장할 것입니다.
앞으로도 멈추지 않을, 미래를 향한 도전
우리는 앞으로도 사용자 경험을 최우선으로 생각하며, 지속적으로 키보드 앱을 개선해 나갈 것입니다.
새로운 기술을 적극적으로 도입하고, 성능을 최적화하며, 사용자가 더 나은 입력 경험을 할 수 있도록 끊임없이 노력할 것입니다. 🚀
팀의 협력과 도전정신
이번 성과는 더 나은 제품을 만들기 위한 끈기 있는 노력과 약간의 모험정신 덕분에 가능했던 결과라고 생각합니다. 우리는 작은 변화부터 시작하여 점진적으로 개선을 이루어냈으며, 이는 팀의 협력과 지속적인 도전 덕분입니다. 함께 노력해준 동료들에게 감사의 말을 전하며, 이번 글을 마무리하겠습니다.
글을 읽어주셔서 감사합니다 🙇♂️
