Pixi.jsで千切りした画像を動かしてみる

Pixi.js
ブラウザでゲームとか作ったりアニメーションさせる時に便利なcanvas系のJavaScriptライブラリはいくつかあるが最速の描画JavaScriptライブラリは!? パフォーマンスの検証 – ICS LABによるとPixi.jsはWebGLを使ってFlashよりも速いらしい。

以前揺れるキリンで高さ1pxの要素(li)の背景にしてjQueryで動かしてみたがとても遅かった。
そこで、このpixi.jsを使えば早くなるかもと考えやってみた。
kirin wave by Pixi.js

前回同様、高さ1pxにスライスするが今回は要素では無くスプライトに貼り付ける感じだ。
作ったはいいが、WebGLを有効にするとFirefoxでは動かず(参考にしたPixi.jsを初めて触って簡単にアニメーションを作成してみた話(その3) | 株式会社LIGも動いてない)
Google Chromeは動くけどWebGLを有効・無効にかかわらず以前より重くなってしまった。

720個のスプライトを描画させるのは難しいのかもしれない。

Tags: ,

トラックバック

コメントを書く