Sparkling — TikTokのクロスプラットフォームインフラ
Lynxエンジン上で実際のアプリを動かすためのプロダクションフレームワーク
Lynxは TikTokが作ったクロスプラットフォームUIレンダリングエンジンだ。Reactに似た方法でコードを書けば、ネイティブレンダリングでAndroid/iOS画面を描画する。ただしLynx自体は「レンダリングエンジン」に過ぎない。
実際のアプリを運用するには、ビルドパイプライン、JS↔ネイティブ通信、ページナビゲーション、ストレージ/メディアアクセスなどのインフラが追加で必要だ。Sparklingがこのインフラレイヤーを担当する。
CLIワンライナーでアプリ生成
npm create sparkling-app@latest my-appの一行でAndroid/iOSネイティブシェルを含む完全なプロジェクトが生成される。
npx sparkling buildでLynxバンドルをビルドし、npx sparkling run:androidやrun:iosでビルド→インストール→実行を一気に行う。npx sparkling devでホットリロード開発サーバーを起動できる。デフォルトポートは5969 — 電話のキーパッドでLYNXを押した数字だそうだ。
npx sparkling doctorでNode.js、JDK、Android SDK、Xcode、CocoaPodsなどの開発環境を自動診断してくれる。
Sparkling Method — 型安全なJS↔ネイティブブリッジ
最も興味深い部分だ。TypeScriptの.d.tsファイルに関数宣言を書くだけで、CLIがKotlin/Swiftネイティブコードとts実装を自動生成する。
生成された抽象クラスを継承してネイティブのビジネスロジックだけ実装すれば、JSから直接呼び出し可能。型が両側で保証されるのでランタイムエラーが減る。
ビルトインでNavigation(ルーター)、Storage(キーバリューストア)、Media(カメラ/アルバム/ファイル)が提供される。
スキームベースの統合ナビゲーション
hybrid://lynxview_page?bundle=main.lynx.bundle&title=Home形式の統合URLスキームで、Lynxページとネイティブページとネイティブ画面を同一にルーティングする。
各ページが独立したバンドルエントリポイントを持つマルチページ構造で、大規模アプリに適している。
既存アプリへの段階的導入(Brownfield)
新規アプリだけでなく、既存Android/iOSアプリにSparklingコンテナを埋め込んで段階的に導入できる。
AndroidはMavenアーティファクト追加後HybridKit.init()→Sparkling.build(context).navigate()でコンテナを開く。iOSはCocoaPodsで追加後SPKRouter.create(withURL:)でコントローラーをプッシュするかSPKContainerViewでビューを埋め込む。
現在のステータス
パブリックベータ段階。Apache 2.0ライセンス。Node.js ^22 || ^24、pnpm v10環境で動作する。AndroidはJDK 11以上 + android-34 SDK、iOSはXcode 16+が必要。
動作フロー
`npm create sparkling-app@latest`でAndroid/iOSネイティブシェル含むプロジェクト生成
TypeScript `.d.ts`に関数宣言 → Sparkling Method CLIがKotlin/Swiftコードを自動生成
生成された抽象クラスを継承 → ネイティブロジック実装 → JSから型安全に呼び出し
`hybrid://` URLスキームでLynxページとネイティブ画面を統合ルーティング
`npx sparkling build` → `run:android/ios`でビルド→インストール→実行を一気に実行