アニメーションGIF対ビデオ対カンバス - 速度とファイルサイズのため

Question

シンプルな製品デモを想定します。あるものは何でも、

• アニメーションGIF
• ビデオ（埋め込むことができユーチューブ、カスタムのHTML5プレーヤー：一つは、これは伝統的な高解像度の映像ではないとして熟練した合理的な可能性がありhttp://www.sublimetext.com/

  つまり何かに見つけ

• キャンバス）最も競争力の

ユーザーのためのより良い実行している問題、？両方の面で：

1. ユーザーが「製品のデモ」「の製品のデモ」

を表示するための処理能力の面で

要件を表示するためにダウンロードする必要がありますファイルのサイズ

これを達成するための優れた技術や有用性を判断するための別の指標があると感じたら、教えてください。

Answer 1

私はそれが既に答えられていることを知っていますが、Sublime Textアニメーションを具体的に参照しているので、私はあなたが似たようなものを作りたいと思っていますか？

それは、ここではケースなら自身が、それは崇高なテキスト作成者によって作成された方法を説明する記事です：

• http://www.sublimetext.com/~jps/animated_gifs_the_hard_way.html

記事の興味深い部分は、彼が軽減する方法でありますファイルサイズ - 私はあなたの質問と信じています。

Answer 2

フレームレートが非常に低い単純なアニメーションでは、アニメーションGIFの単純なアニメーションPNGが最適なソリューションになるでしょう。

ただし、これでは帯域幅係数を考慮する必要があります。 GIFまたはPNGの最終サイズが大きい場合、おそらくバッファリングされたビデオがおそらく良いでしょう。

これは、表示する前にgif/pngファイル全体をダウンロードする必要があるためです（インターリーブされたPNGがどのように動作しているかわかりません）。

動画はファイルサイズが大きくなることがありますが、通常はバッファリングされているため、ほぼすぐに動画を表示できます。

YouTubeなどの外部ホストを使用すると、サイトに有益な場合があります。また、帯域幅はサーバーからではなく、それらのサイトから引き出されます（プロバイダーを使用している場合方法）。 （これがないように、よく知られている）アニメーションPNG画像またはAPNGの詳細について

：
https://en.wikipedia.org/wiki/APNG

このキャンバスのみ表示デバイスと本当に必要はない（画像コンテナが同じことですキャンバスはできませんが、GIF/PNGをアニメートすることもできます）。

多くのベクトルを使用する場合は、キャンバスを考えることができます。

CSS3アニメーションはプレゼンテーションスライドなどのオプションにも使用できます。