createjsのFPSを計測するブックマークレット

[HAKASHUN]

Usage

• globalにwindow.createjsが出ているケースで使用可能
• 確認したいページでブックマークレットを実行

  Bookmarklet

javascript:(function(){ var ele = document.createElement("div"); ele.id = 'fpsMeter'; ele.style.position = 'fixed'; ele.style.background = 'rgba(0,0,0,.7)'; ele.style.top = '10px'; ele.style.left = '10px'; ele.style.padding = '10px'; ele.style['z-index'] = 9999; ele.style['border-radius'] = '5px'; ele.style.border = '1px solid #FFF'; document.body.appendChild(ele); createjs.Ticker.addEventListener('tick', function(){ ele.innerHTML = (createjs.Ticker.getMeasuredFPS() + 0.5 | 0) + 'FPS'; }); })();

Detail

//DOM生成
var ele = document.createElement("div");
ele.id = 'fpsMeter';
ele.style.position = 'fixed';
ele.style.background = 'rgba(0,0,0,.7)';
ele.style.top = '10px';
ele.style.left = '10px';
ele.style.padding = '10px';
ele.style['z-index'] = 99999;
ele.style['border-radius'] = '5px';
ele.style.border = '1px solid #FFF';
ele.style.color = '#FFF';
document.body.appendChild(ele); 
// set event
createjs.Ticker.addEventListener('tick', function(){
  ele.innerHTML = (createjs.Ticker.getMeasuredFPS() + 0.5 | 0) + 'FPS';
});

[HAKASHUN]

実行内容を外部スクリプト化して、後でメンテナンスできるようにする