틱톡의 비밀병기, 웹보다 빠른 Lynx 프레임워크 전격 해부!
리액트 네이티브를 넘어설 새로운 강자가 등장했습니다.
혹시 Lynx(링스)라는 프레임워크에 대해 들어보셨습니까.
최근 오픈소스 커뮤니티에서 가장 뜨거운 화제 중 하나인데요.
놀랍게도 이 기술은 이미 전 세계 수억 명이 사용하는 앱, 바로 틱톡의 여러 화면을 만드는 데 쓰이고 있습니다.
이 프로젝트를 이끄는 개발자는 과거 페이스북(메타)에서 리액트와 리액트 네이티브의 성능을 책임졌던 핵심 인물입니다.
과연 Lynx가 무엇이고, 왜 이렇게 주목받는지 자세히 알아볼까요.
그래서 Lynx가 정확히 무엇일까요.
가장 쉽게 설명하면, Lynx는 리액트 네이티브나 플러터와 같은 '크로스플랫폼 프레임워크'입니다.
한 번 코드를 작성하면 아이폰, 안드로이드, 심지어 웹에서도 동작하는 앱을 만들 수 있는 기술이라는 뜻입니다.
개발자에게 익숙한 리액트(JSX)와 비슷한 문법을 사용하고, 진짜 CSS로 스타일을 꾸밀 수 있어서 웹 개발자들이 배우기 매우 쉽습니다.
Lynx의 압도적인 성능, 그 비결은 무엇일까요.
Lynx가 특별히 주목받는 이유는 바로 '성능' 때문입니다.
웹 기술을 사용하면서도 네이티브 앱처럼, 아니 어떤 면에서는 그보다 더 빠르게 느껴지도록 설계되었습니다.
비결 1: 화면이 즉시 뜬다! IFR 기술
Lynx의 가장 강력한 무기는 IFR(Instant First Frame Rendering)이라는 기술입니다.
보통 앱은 실행 파일을 불러오고, 코드를 해석하고, 화면을 그리는 데 시간이 걸리는데요.
Lynx는 이 과정을 개발 단계에서 미리 처리해서 최적화된 결과물을 만들어 둡니다.
덕분에 사용자가 앱을 켜면 거의 즉시 첫 화면이 나타나는 놀라운 로딩 속도를 보여줍니다.
비결 2: 두 개의 엔진으로 일을 나눈다! BTS와 MTS
Lynx는 마치 두 개의 뇌를 가진 것처럼, 자바스크립트 엔진을 두 개 사용한데요.
하나는 '백그라운드 스레드(BTS)'에서, 다른 하나는 '메인 스레드(MTS)'에서 작동합니다.
대부분의 복잡한 계산이나 데이터 처리는 백그라운드에서 조용히 처리하고, 사용자의 터치나 스크롤처럼 즉각적인 반응이 필요한 작업만 메인 스레드에서 처리합니다.
이렇게 일을 나누기 때문에 앱이 버벅거리지 않고 항상 부드러운 움직임을 유지할 수 있는 것입니다.
웹 개발자에게는 최고의 선물
Lynx는 네이티브 UI를 사용하기 때문에 스크롤 같은 동작이 매우 자연스럽습니다.
하지만 가장 큰 장점은 웹 개발자들이 가진 지식을 그대로 활용할 수 있다는 점입니다.
진짜 CSS를 지원하기 때문에 테일윈드(Tailwind) 같은 최신 CSS 라이브러리도 사용할 수 있습니다.
심지어 Framer Motion 같은 유명 애니메이션 라이브러리도 거의 그대로 가져와 사용할 수 있다고 한데요.
앞으로가 더 기대되는 Lynx
Lynx 팀은 올해 안에 틱톡이 실제로 사용하는 UI 컴포넌트들과 프레임워크 전체를 오픈소스로 공개할 예정이라고 합니다.
이것은 웹 기술로 네이티브 앱을 만들 때 부족했던 부분들을 채워줄 완벽한 도구 세트가 될 것입니다.
웹의 편안함과 네이티브의 강력함을 모두 잡으려는 Lynx의 도전, 앞으로의 발전을 지켜볼 가치가 충분합니다.