LynxJS: Framework Cross-Platform dari TikTok — Cara Kerja & Perbandingan dengan React Native, Flutter, NativeScript, Ionic

Background

LynxJS adalah sebuah framework UI cross-platform yang dikembangkan oleh ByteDance — perusahaan di balik TikTok. Awalnya LynxJS dibuat untuk kebutuhan internal TikTok dan sudah digunakan dalam fitur-fitur yang memiliki trafik tinggi (seperti fitur pencarian TikTok, TikTok Studio, dan beberapa aplikasi lain di ekosistem ByteDance).

Framework ini resmi di announced sebagai proyek open-source pada 5 Maret 2025, dengan dukungan penuh dari TikTok secara finansial maupun teknis. ByteDance merilis LynxJS sebagai jawaban atas tantangan pengembangan aplikasi mobile cross-platform, serta untuk menantang dominasi React Native dan Flutter yang telah bertahun-tahun menguasai pengembangan aplikasi Cross Platform.

Tujuan utama LynxJS adalah memungkinkan developer web untuk bisa memanfaatkan skill HTML, CSS, dan JavaScript yang sudah mereka miliki untuk membangun aplikasi atau UI native di Android, iOS, dan Web dengan satu code base, tanpa mengorbankan performa seperti native app pada Android dan iOS.

Fitur Utama LynxJS

Sebagai pendatang baru, LynxJS membawa sejumlah fitur khas yang membedakannya dari framework lain:

Cross-Platform Native UI

LynxJS memungkinkan pembuatan UI native di Android, iOS, dan Web dari satu codebase JavaScript. Komponen UI yang ditulis dengan Lynx akan di-render sebagai komponen native pada platform mobile, dan sebagai elemen DOM di Web, sehingga user experience tetap optimal di tiap platform. Hal yang cukup menjanjikan adalah Framework ini telah teruji di Real Case di secara production di environment TikTok, sehingga performa dan stabilitasnya sudah terbukti menangani aplikasi skala besar.

High Performance dengan basis Rust & Dual-Thread

Tidak seperti kebanyakan framework JavaScript yang sepenuhnya bergantung pada interpretasi JS saat runtime, LynxJS dibangun dengan dukungan engine berbasis Rust untuk kecepatan dan efisiensi memori.

Ia menggunakan arsitektur dual-thread yang memisahkan eksekusi code ke dalam dua runtime JavaScript secara independen. Main thread menjalankan engine JavaScript khusus bernama PrimJS (berbasis QuickJS) untuk menangani tugas-tugas UI, sedangkan background thread menjalankan logic lain secara paralel. Pendekatan ini menghilangkan bottleneck "bridge" JavaScript–Native yang ada di React Native, sehingga interaksi antara code JS dan komponen native lebih smooth dan cepat. Meskipun React Native sudah menyelesaikan masalah ini pada New Architecture-nya.

Dengan pendekatan tersebut, LynxJS mampu mencapai Instant First-Frame Rendering (IFR) (frame pertama aplikasi langsung tampil dengan cepat tanpa blank screen) serta interaksi yang responsif melalui konsep Main Thread Script (MTS) untuk menangani event dan gesture critical layaknya aplikasi native.

LynxJS menyertakan engine JavaScript custom bernama PrimJS yang ukurannya sangat kecil (hanya ~210 KB) namun sangat bertenaga. PrimJS ini ditanamkan di main thread Lynx untuk mengeksekusi skrip dengan performa tinggi. ByteDance mengklaim PrimJS lebih cepat dibanding Hermes (Engine bawaan React Native), sehingga waktu render dan respons aplikasi Lynx bisa lebih baik. Di Android, PrimJS digunakan di kedua thread, sedangkan di iOS Lynx memanfaatkan JavaScriptCore Apple di background thread demi kompatibilitas (dengan opsi beralih ke PrimJS jika perlu).

Web Development Paradigm

Salah satu keunggulan LynxJS adalah pendekatannya yang familiar bagi web developer, kita bisa menggunakan HTML-like markup dan CSS untuk menyusun UI. Lynx menyediakan elemen bawaan seperti <view>, <text>, dan <image> (ini sama dengan <div>, <p>/<span>, dan <img> di HTML) untuk menyusun UI. Style UI dapat ditulis menggunakan stylesheet CSS biasa — termasuk full support untuk selektor, variabel CSS, transitions, gradients, animations, dan sebagainya — tanpa perlu solusi khusus seperti StyleSheet di React Native.

Agnostik Terhadap Framework

Berbeda dengan React Native yang mengharuskan kita menggunakan React, LynxJS mengambil jalur framework-agnostic. Artinya, Lynx dapat mendukung berbagai framework frontend JavaScript seperti React, Vue, Svelte, dan lainnya. ByteDance menyediakan binding secara official untuk React (yaitu ReactLynx) sehingga React 17+ dapat berjalan di atas Lynx. Tapi, jika kita lebih senang menggunakan Vue atau Svelte, Lynx juga membuka kemungkinan integrasi dengan framework tersebut tanpa memaksa pola atau structure tertentu. Fleksibilitas ini cukup menarik, karena memungkinkan kita memilih paradigma UI favorit kita di atas platform Lynx.

Tooling Modern

Ekosistem Lynx dilengkapi toolchain modern berbasis Rust. Lynx menggunakan Rspack (Rust-based bundler) sebagai pengganti Webpack/Vite untuk melakukan build dan ini di klaim lebih cepat bahkan sangat cepat. Lynx juga menyediakan hot reload dan preview instan pada device melalui aplikasi Lynx Explorer, yang fungsinya mirip dengan Expo pada RN (memberikan preview real-time di device tanpa build manual). Dengan tooling ini, Developer experience di Lynx diklaim efisien baik dari sisi kecepatan build maupun kemudahan debugging.

Arsitektur dan Cara Kerja

LynxJS mengadopsi model component-based reaktif mirip React, namun dengan modifikasi arsitektur yang berbeda. Secara internal, arsitektur Lynx dibangun di atas Dual-Threaded Runtime: kode aplikasi dijalankan di dua thread terpisah. Main thread difokuskan untuk rendering UI dan penanganan interaksi yang bersifat realtime, sementara background thread menangani pemrosesan logic aplikasi dan lifecycle komponen di belakang layar.

Idiomatic React on Lynx

Pada implementasi ReactLynx (mode React), ini berarti setiap komponen React dijalankan dua kali: sekali di background thread (dengan React runtime untuk mengelola state, efek, dll), dan sekali di main thread untuk melakukan render UI, tentu ini terjadi sangat secepat.

Main thread hanya menjalankan subset skrip yang disebut Main Thread Script, misalnya code untuk merespons gesture dan update UI dengan prioritas tinggi, sehingga UI pertama dapat muncul dengan sangat cepat dan interaksi terasa smooth.

Sementara itu, background thread memastikan logic aplikasi yang lebih berat dan ini tidak menghambat rendering karena berjalan secara async. Lynx menetapkan serangkaian aturan yang menentukan code mana yang boleh atau tidak boleh dijalankan di kedua thread tersebut ini demi menjaga konsistensi behaviour.

Native Render

Dari segi render, Lynx menggunakan pendekatan native rendering. Code markup yang kita tulis (misal <View>, <Text>, <Image>) tidak di-draw secara custom seperti Flutter, melainkan diubah menjadi elemen native UI sesuai platform. Contohnya, <Text> pada Android akan menjadi TextView, dan di iOS menjadi UILabel native, sementara di Web ia menjadi elemen HTML <span> atau <p>. Pendekatan ini mirip dengan React Native, sehingga komponen yang dihasilkan benar-benar native di masing-masing OS (bukan webview). Kelebihannya, performa dan look-and-feel benar-benar seperti aplikasi native bawaan platform.

Menariknya, arsitektur Lynx cukup modular sehingga ke depannya dikabarkan dapat mendukung custom renderer layaknya Flutter. Dari beberapa diskusi menyebutkan Lynx berencana menyediakan opsi renderer berbasis Skia (canvas rendering) selain native renderer, meskipun fitur ini belum ada pada rilis saat ini.

Ini berarti Lynx berpotensi mengombinasikan dua pendekatan: menggunakan komponen native untuk kemudahan integrasi platform, atau menggunakan canvas custom untuk mencapai konsistensi pixel-perfect antar platform. Terlepas dari itu, desain utama Lynx saat ini berfokus pada pemisahan framework code dan user code di dua thread terisolasi untuk mencegah script lambat menghambat UI. Pendekatan arsitektural ini tergolong baru dan menjadi ciri khas Lynx dalam meningkatkan performa aplikasi cross-platform.

Perbandingan LynxJS dengan Framework Lain

Sebagai pendatang baru, tentu akan kurang rasanya jika kita tidak bandingkan dengan pemain lama yang sudah menguasai pasar. Mari kita coba compare beberapa point saja antara LynxJS dengan React Native, Flutter, Nativescript dan Ionic, meskipun dua framework yang terakhir emang masih ada yang pakai. Saya dengar dari teman teman yang kerja di luar negeri, masih ada yang pakai ionic, masih di pakai tentu saja karena Legacy.

React Native vs Lynx

React Native adalah framework keluaran Meta (Facebook) yang sudah keluar sejak tahun 2015, tentu saja kematangan menjadi keunggulan paling oke yang di miliki oleh React Native, tapi mari kita lihat beberapa aspek perbedaan keduanya.

Arsitektur. React Native menjalankan code JavaScript di satu thread menggunakan bridge untuk berkomunikasi dengan komponen native. Pendekatan inilah yang menjadi masalah pada React Native karena seringkali memunculkan isu performance bila aplikasi sangat kompleks. Namun tenang saja masalah ini sudah di selesaikan dengan New Architecture dari React Native sehingga konsep bridge sudah bisa di tinggalkan. Lynx membagi proses ke dua thread terpisah (main dan background), mengurangi beban bridge JavaScript–Native dan menjaga agar UI tetap responsif.

Styling. React Native menggunakan StyleSheet atau pendekatan JavaScript untuk styling, dan meskipun ada berbagai library tambahan (misalnya Styled Components, Tailwind RN), konsepnya agak berbeda dari CSS murni. LynxJS mendukung CSS standar. Bagi developer yang terbiasa dengan ekosistem web, pendekatan ini tentu lebih terasa natural dan minim learning curve.

Ekosistem. React Native memiliki ekosistem yang sangat luas, komunitas besar, serta banyak library dan dukungan dari berbagai perusahaan. Intinya React Native sudah sangat matang, sudah habis makan asam garam kehidupan. Lynx masih baru, ekosistemnya dalam tahap pertumbuhan. Meski punya potensi untuk tumbuh cepat berkat dukungan ByteDance, tapi tingkat kematangan belum bisa menyaingi React Native, jadi untuk saat ini tetap belum layak untuk di gunakan pada proyek skala production, tapi kalau kecil kecil harusnya masih oke.

Flutter vs Lynx

Flutter adalah framework keluaran Google yang menggunakan bahasa Dart. Beberapa titik perbandingan antara Flutter dan LynxJS:

Bahasa Pemrograman. Flutter sepenuhnya berbasis Dart, yang dapat menuntut learning curve baru bagi developer yang berangkat dari keahlian web developer. Meskipun sepengalaman saya mungkin 2 tahun menggunakan flutter, rasanya flutter ini mirip dengan typescript dengan gaya java. Maksudnya karena sama sama type-safe/ static type dan dart sangat asik untuk ngoding OOP kayak java dan nerapin konsep clean code ala uncle bob. LynxJS menggunakan JavaScript/TypeScript, bahasa yang sangat familiar untuk web developer, sebagaimana tagline mereka Lynx ini untuk memanfaatkan skill web dalam mengembangkan mobile app cross-platform rasa native, jadi mungkin Flutter bukan pesaing yang serius buat Lynx.

Cara Rendering. Flutter menggunakan engine berbasis Skia untuk me-render seluruh UI secara custom, tidak bergantung pada komponen native. Hasilnya, tampilan konsisten di semua platform, tapi ukuran aplikasi cenderung lebih besar dan tampilan bisa terasa "kurang native" di mata sebagian orang, tapi bisa di switch untuk tiap platform, flutter nyediain theme Material untuk android dan iOS dengan Cupertino. LynxJS memanfaatkan native renderer, sehingga elemen UI benar-benar sesuai platform. Pengguna akan melihat komponen bawaan iOS di iPhone, dan native widget Android di ponsel Android.

Performa. Flutter terkenal dengan performa yang bagus dan animasi yang smooth karena rendering engine-nya yang bagus, meski dulu saya sering temui juga lag lag pada component yang memiliki animasi. Salah satunya pada floating button widget nya. LynxJS, dengan pendekatan dual-thread, juga menjanjikan performa yang baik, walau secara benchmark masih perlu lebih banyak pembuktian di luar ekosistem ByteDance.

Ekosistem & Komunitas. Flutter memiliki ekosistem yang relatif matang, dengan banyak package di pub.dev serta dukungan kuat dari Google. LynxJS masih dalam tahap awal membangun ekosistem. Dukungan ByteDance bisa mempercepat perkembangannya, tapi saat ini belum memiliki komunitas sebesar Flutter.

NativeScript vs Lynx

NativeScript adalah framework open-source yang juga menggunakan JavaScript/TypeScript untuk membangun aplikasi cross-platform (Android dan iOS). NativeScript merender komponen native mirip React Native dan LynxJS.

Arsitektur. NativeScript menjalankan JavaScript di satu proses yang berinteraksi dengan native API. Di klaim Performanya bisa setara React Native, meski bergantung pada implementasi bridging. Saya kurang tau juga karena saya tidak pernah pakai. Lynx memiliki dua thread terpisah. Logika berat tidak akan memblok UI thread. Ini bisa menurunkan lag dan meningkatkan responsivitas.

Styling. NativeScript mendukung CSS-like syntax namun tetap terbatas pada subset properti yang didukung native widget. Tidak semua fitur CSS dapat dipakai secara langsung. Lynx mencoba mengadopsi CSS secara keseluruhan, termasuk animasi dan transitions.

Ekosistem. NativeScript relatif lama beredar di komunitas JavaScript (sejak 2014–2015). Ada modul untuk integrasi plugin native, UI libraries, dsb. Namun popularitasnya kalah dengan React Native atau Flutter. LynxJS masih baru dan perlu waktu membangun ekosistem serupa. Meski demikian, nama besar ByteDance bisa saja mempercepat adopsi.

Integrasi Web. NativeScript murni difokuskan pada mobile (Android dan iOS), sedangkan untuk web version biasanya developer membuat aplikasi terpisah. Lynx memungkinkan code reuse lebih mudah untuk Web dan Mobile, sehingga developer bisa menulis satu code base untuk ketiga platform (Android, iOS, dan Web).

Ionic vs Lynx

Ionic adalah framework open-source berbasis teknologi web (HTML, CSS, JavaScript) yang berjalan di atas WebView untuk membuat aplikasi cross-platform.

Pendekatan Teknis. Ionic menampilkan UI melalui WebView, sehingga aplikasi sebenarnya adalah "web app" yang dibungkus agar bisa diinstal di ponsel. Performanya kadang masih kalah dibanding native approach. Lynx merender komponen native di Android/iOS dan elemen HTML di Web. Pendekatan ini memberi performa dan tampilan yang lebih menyatu dengan platform.

Performa. Aplikasi Ionic cenderung bergantung pada kinerja browser WebView, yang bisa saja memadai untuk aplikasi ringan–menengah, tapi kadang kurang mumpuni untuk aplikasi yang berat apalagi banyak animasinya. LynxJS dengan dual-thread dan renderer native berpotensi memiliki performa lebih tinggi, setara framework native cross-platform lainnya.

Ekosistem. Ionic memiliki komunitas besar, banyak plugin, dan mudah diintegrasikan dengan Angular, React, atau Vue. Karena sudah lama ada. Lynx masih tahap tumbuh, walaupun dokumentasi resminya sudah lumayan lengkap. Komunitas global belum sebesar Ionic.

Cakupan Platform. Ionic juga mendukung aplikasi web (PWA), karena dasarnya adalah teknologi web. Lynx juga mendukung tiga platform: Android, iOS, dan Web, tetapi pendekatan rendering UI-nya berbeda.

Ekosistem dan Dokumentasi

Sebagai project open-source yang baru diluncurkan, ekosistem LynxJS masih dalam tahap awal. Saat ini, Lynx belum memiliki library 3rd Party dan tools sebanyak framework yang sudah mapan. Misalnya, React Native memiliki Expo, ratusan modul komunitas, dan panduan best-practice yang sudah sangat teruji; tentu wajar saja karena Lynx baru hadir beberapa hari lalu.

ByteDance sendiri kelihatan cukup serius mengembangkan Lynx — selain membuka soruce code nya ke public, mereka menyediakan dokumentasi saat launching hari pertama yang terbilang cukup matang: ada panduan Quick Start, referensi API, contoh tutorial, hingga pembahasan konsep internal seperti lifecycle ReactLynx. Ini menunjukkan tim mereka telah menyiapkan Lynx siap untuk langsung digunakan publik sejak hari pertama.

Komunitas Lynx masih kecil tetapi antusias di kalangan software engineer cukup menjanjikan. Repositori GitHub langsung mendapat kontribusi issue dan pull request dari early adopters hanya dalam hitungan hari setelah rilis.

Jadi kesimpulannya, Lynx merupakan framework cross platforms yang cukup menjanjikan, patut untuk di tunggu terobosan keseriusan tim mereka dalam mempublikasikan dan menyuarakan bahwa Lynx layak untuk segera di adopsi dalam proyek proyek yang serius. Karena di dunia JS ini ada banyak sekali framework yang menawarkan performa yang lebih bagus, DX yang lebih menyenangkan, tapi tidak bisa menarik minat perusahaan untuk di adopsi.

Semoga informasi ini bermanfaat dan menambah wawasan kita semua mengenai ekosistem pengembangan aplikasi cross-platform. Thank youuu….