11FAQ
SVGA 形式仕様、クロスプラットフォームプレーヤー、Web Lite に関するよくある質問。
基本
SVGA の位置づけ、適用シーン、オープンソースエコシステムを理解します。
SVGA とは何ですか?
SVGA はクロスプラットフォームのオープンソースアニメーション形式で、iOS、Android、Flutter、Web、HarmonyOS など複数のプラットフォームに対応し、高性能なアニメーション再生体験を提供します。詳しくは SVGA 公式ドキュメントリポジトリ を参照してください。
SVGA はどのようなアニメーションシーンに適していますか?
SVGA はライブ配信のギフト、イベントの装飾、プロダクトのガイド、インタラクティブなフィードバックなど、高い再現性とクロスプラットフォーム再生が求められるアニメーションに適しています。
SVGA と GIF やフレームアニメーションの違いは何ですか?
SVGA はタイムラインと素材構造を保持し、Dragonbones / CreateJS に似ています。通常、フレームごとの画像よりもサイズを抑えやすく、再生制御やクロスプラットフォームでの再利用にも適しています。
SVGA はオープンソースプロジェクトですか?
はい。SVGA のプレーヤー、コンバーター、形式仕様はコミュニティによって維持されており、GitHub の svga オーガニゼーションでソースコードの閲覧、Issue の作成、コントリビューションができます。
形式仕様
SVGA ファイルの構造と 1.x / 2.x のバージョン差異。
SVGA にはどのような形式バージョンがありますか?
SVGA には 1.x と 2.x の 2 つのバージョンがあります。1.x は JSON でアニメーションを記述し、2.x は ProtoBuf で記述します。複雑なアニメーションでは JSON ファイルが大きくなりすぎ、解析時間とメモリ消費が増えるため、JSON 方式は 2.0 以降で廃止されました。
1.x と 2.x 形式の違いは何ですか?
1.x は JSON テキストで記述し(1.x 形式仕様)、2.x は ProtoBuf バイナリで記述して zlib で圧縮します(2.x Proto プロトコル)。ファイルサイズが小さく、解析も高速です。
SVGA ファイルの拡張子と構造はどうなっていますか?
SVGA ファイルの拡張子は
.svga で、ZIP 圧縮でパッケージされています。解凍後にサブディレクトリを含めることはできず、ファイル名に中国語や日本語などの非標準文字を含めることもできません。ビットマップは PNG-8 または PNG-24 形式である必要があり、pngquant での圧縮を推奨します。プレーヤーの形式バージョン互換性はどうなっていますか?
2.0.0 の Player は 2.x 形式を再生でき、1.x 形式とも下位互換性があります。1.x の Player は 1.x 形式のみ再生でき、2.x は再生できません。
SVGA 形式の Roadmap は何ですか?
2.0.0 では Audio(音声)と Bitmap Mask(ビットマップマスク)の機能をサポートする予定です。1.x は安定性のみを保証します。詳しくは SVGA-Format リポジトリ を参照してください。
プレーヤーと導入
プラットフォーム別プレーヤーの選択、コンバーター、コミュニティリソース。
SVGA はどのプラットフォームに対応していますか?
iOS、Android、Flutter、Web、Web Lite、WeChat ミニプログラム、HarmonyOS NEXT などのプレーヤーを公式に提供しています。完全なリストは svga/docs を参照してください。
Web 版と Web Lite 版のプレーヤーの違いは何ですか?
SVGAPlayer for Web はフル機能のプレーヤーです。SVGAPlayer-Web-Lite はモバイル Web 向けで、より小さく(<60kb、gzip<18kb)、高性能ですが、SVGA 1.x 形式と音声再生には対応していません。
デザイナーはどうやって SVGA ファイルを書き出しますか?
デザイナーは SVGAConverter を使って、After Effects または Animate から .svga ファイルを書き出せます。
コミュニティのサードパーティリソースには何がありますか?
コミュニティのコントリビューションには、React Native プレーヤー(BANG88)、UWP プレーヤー(LancerComet)、VSCode SVGA プレビュー拡張(ETTTTT)などがあります。
Web Lite 専用
SVGAPlayer-Web-Lite の機能、制限、使い方。
SVGAPlayer-Web-Lite とは何ですか?
SVGA のモバイル Web 向け軽量プレーヤーで、より軽量で効率的であることを目指しています。サイズは <60kb(gzip <18kb)で、Android 4.4+ / iOS 9+ に対応しています。詳しくはリポジトリを参照してください。
Web Lite はパフォーマンス向上のためにどのような技術を使っていますか?
マルチスレッド(WebWorker)によるファイルデータの解析、OffscreenCanvas / ImageBitmap による描画を採用し、より良い非同期処理を提供します。実験的な機能には、WebWorker 上でのレンダリングエンジン動作、WebAssembly による WebWorker の代替、GPU 演算の活用があります。
Web Lite にはどのような制限がありますか?
SVGA 1.x 形式の再生と音声再生には対応していません。1.x 互換性や音声が必要な場合は、フル機能の SVGAPlayer for Web を使用してください。
SVGAPlayer-Web-Lite のインストール方法は?
npm でインストールできます:
yarn add svga または npm i svga。CDN から読み込むこともできます:<script src="https://unpkg.com/svga/dist/index.min.js">。Web Lite はどのような高度な機能に対応していますか?
要素の差し替えと動的要素の挿入(解析後データの変更による)、IndexedDB を使った解析済みデータの永続キャッシュによる再ダウンロード・再解析の回避、ビューポート検出(IntersectionObserver)による画面外レンダリングの停止、再生済みフレームのキャッシュによる繰り返し再生の高速化などに対応しています。