WebGLに対応し高速化したCreateJSの描画性能を探る - ICS MEDIA
インタラクティブコンテンツ制作に役立つHTML5向けのフレームワークCreateJS (使い方は入門サイトを参照ください)。2014年1月に公式ブログでWebGLサポートが発表されました（参照記事「WebGL Support in EaselJS」)。公式ブログによるとパフォーマンスが従来比の6〜50倍にも達するとのことです。 果たしてどのぐらいの性能があるのか気になりましたので、以前の検証記事「HTML5開発者必見、最速のJavaScriptライブラリはどれだ!? パフォーマンスの徹底検証」を元に、WebGL対応版のCreateJS(描画を扱うJSライブラリ「EaselJS」)のパフォーマンスを比較検証してみました。検証に用いたデモは次のリンクをクリックすることで再生できます。 CreateJS (EaselJS 0.7.1) : 従来版。CanvasのContext2Dが利用されている
javascriptで遊ぼう
最近createjsっていうライブラリにはまってます。 これが楽しくて仕方ない今日このごろです。 これは何かというと、ブラウザで簡単にアニメーションを魅せることができるんです。 せっかく触れてるんだから、自分の覚書を兼ねて基本的な事を書きとどめておこうと思った次第です。 ちなみに、このWebサイトのトップページにもこのライブラリを使って描画されてるものがあったりします。 夜19時以降にアクセスして頂き、TOPのふすまが空いた後、空が夜になっているんですが、そこで星が輝いてるんです。 その星の輝きをこのライブラリでやっています。 アクセスする度に星の散らばり方が変わります。 それぞれの星の輝く速度は毎回違います。 この星の1つにフォーカスを当てて、今回は書いてみようと思います。 基本の基本で、ランダムにどうこうするとかもとりあえず置いといて、まずは・・・ 「星を描いて回す」 これだけしてみよ
CreateJSのMotionGuidePluginでモーショントゥイーン - jsdo.it - Share JavaScript, HTML5 and CSS
CreateJSには、モーションガイド機能が追加されました。 http://www.createjs.com/Docs/TweenJS/classes/MotionGuidePlugin.html キャンバス上をドラッグすると、マウスの軌跡に合わせて線を描画し、その線上をモーショントゥイーンします。 var canvas, stage; var pointList =[]; var shape; //軌跡表示用 var arrow; //矢印 var oldPoint; //座標保持用 function init() { //いつもの canvas = document.getElementById("canvas"); stage = new createjs.Stage(canvas); createjs.Ticker.setFPS(24); createjs.Ticker.addEv
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5
