Sparkling - Infrastruktur lintas platform TikTok

(github.com/tiktok)

4 poin oleh GN⁺ 2026-03-16 | 1 komentar | Bagikan ke WhatsApp

TikTok merilis sebagai open source lapisan infrastruktur yang dibangunnya untuk mengoperasikan engine Lynx pada skala produksi di aplikasinya sendiri. Menyediakan integrasi dari scaffolding aplikasi, build, bridge native, hingga navigasi
Seperti React Native memerlukan Expo, ini adalah framework infrastruktur produksi untuk menjalankan aplikasi nyata di atas engine Lynx
Dengan satu perintah CLI, dapat langsung membuat proyek aplikasi Lynx lengkap yang mencakup shell native Android/iOS, lalu menjalankan build→install→run sekaligus
Dengan Sparkling Method yang otomatis menghasilkan kode Kotlin/Swift hanya dari deklarasi TypeScript, implementasi bridge JS↔native yang type-safe dapat dibuat
Dengan navigasi skema URL terpadu berformat hybrid://, routing antara halaman Lynx dan layar native ditangani dalam satu sistem

Posisi Sparkling: hubungannya dengan Lynx

Lynx adalah engine rendering UI lintas platform yang dirilis TikTok; jika kode ditulis dengan cara yang mirip React, framework ini akan menggambar layar Android/iOS dengan rendering native
Karena Lynx sendiri adalah sebuah "engine rendering", untuk menjalankan aplikasi nyata masih dibutuhkan infrastruktur tambahan seperti pipeline build, komunikasi native↔JS, navigasi halaman, akses storage/media
Sparkling berperan sebagai lapisan infrastruktur tersebut, yaitu framework aplikasi yang berjalan di atas engine Lynx
Seperti React Native saja sulit dipakai untuk membuat aplikasi tanpa Expo, Lynx saja juga sulit untuk mengoperasikan aplikasi skala besar, dan Sparkling mengisi celah itu
Saat ini masih dalam tahap beta publik, dengan perluasan API dan peningkatan dokumentasi yang sedang berlangsung

Dengan satu baris npm create sparkling-app@latest my-app, dapat membuat proyek lengkap yang mencakup shell native Android/iOS
Dengan npx sparkling build membangun bundle Lynx, dan npx sparkling run:android/run:ios menjalankan build→install→run sekaligus
Dengan npx sparkling dev menjalankan server pengembangan hot reload (port default 5969, angka dari menekan LYNX pada keypad ponsel)
Dengan npx sparkling doctor melakukan diagnosis otomatis lingkungan pengembangan seperti Node.js, JDK, Android SDK, Xcode, CocoaPods, dan lainnya
Dengan npx sparkling autolink melakukan pendaftaran dependensi otomatis Gradle/Podfile untuk modul Sparkling Method serta menghasilkan kode registry native
Dengan npx sparkling copy-assets menyalin bundle yang telah dikompilasi ke direktori resource Android/iOS

Cukup menulis deklarasi fungsi pada file TypeScript .d.ts, lalu CLI (sparkling-method-cli codegen) akan menghasilkan otomatis kode native Kotlin/Swift dan implementasi TS
Dengan mewarisi abstract class yang dihasilkan, cukup mengimplementasikan logika bisnis native saja agar bisa langsung dipanggil dari JS
Menyediakan Method bawaan untuk Navigation (router), Storage (penyimpanan key-value), Media (kamera/album/file)
Konvensi nama paket adalah format sparkling-<module>, dan nama method adalah <module>.<action> (contoh: router.open)
Setelah dipublikasikan ke npm, integrasi di sisi pengguna selesai hanya dengan npm install + npx sparkling autolink

Dengan skema URL terpadu berformat hybrid://lynxview_page?bundle=main.lynx.bundle&title=Home, halaman Lynx dan layar native dirouting dengan cara yang sama
Mengadopsi struktur multipage di mana tiap halaman memiliki entry point bundle yang independen, sehingga cocok untuk aplikasi berskala besar
Pada fungsi navigate(), selain key yang telah didefinisikan sebelumnya, parameter kustom juga dapat diteruskan ke URL skema

Tidak hanya untuk aplikasi baru, container Sparkling dapat di-embed ke aplikasi Android/iOS yang sudah ada untuk adopsi bertahap
Android: setelah menambahkan artefak Maven (com.tiktok.sparkling:sparkling:2.0.0), lakukan inisialisasi HybridKit.init() → buka container dengan Sparkling.build(context).navigate()
iOS: setelah menambahkan CocoaPods (pod 'Sparkling', '2.0.0'), lakukan push controller dengan SPKRouter.create(withURL:) atau embed view dengan SPKContainerView
Salin file .lynx.bundle yang telah dibangun ke aset aplikasi native, lalu tentukan bundle tersebut dengan parameter bundle=

packages/sparkling-sdk: Sparkling SDK inti
packages/sparkling-method: Sparkling Method SDK (bridge JS↔native)
packages/methods: paket Sparkling methods bawaan (Navigation, Storage, Media)
packages/sparkling-app-cli: CLI build dan run aplikasi Sparkling
packages/create-sparkling-app: CLI scaffolding aplikasi
packages/sparkling-method-cli: tooling codegen Sparkling Method
packages/sparkling-types: menyatukan definisi tipe GlobalProps dalam satu paket
packages/playground: aplikasi Playground untuk pengembangan lokal

freedomzero 2026-03-16

Lynx - alat pengembangan aplikasi native berbasis teknologi web - GeekNews
Lynx - 웹 기술 기반 네이티브 앱 개발 도구

Tidak muncul di artikel terkait yang direkomendasikan.