Last active
May 28, 2019 14:07
-
-
Save magne4000/c11316b1e5a8c9cf9ba5728f1461b25f to your computer and use it in GitHub Desktop.
Inject console FPS counter
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function(maxDurationParam){if(maxDurationParam===void 0){maxDurationParam=30} | |
var maxDuration=maxDurationParam*1000;var Animate=(function(){function Animate(){var _this=this;this.update=function(tickAt){if(tickAt-_this.lastInsertAt>=1000){_this.fps.push(_this.framesCount);_this.lastInsertAt=tickAt;_this.framesCount=0} | |
_this.framesCount+=1;if(tickAt-_this.startedAt<maxDuration){requestAnimationFrame(_this.update)} | |
else{_this.elem.dispatchEvent(new Event('finish'))}}} | |
Animate.prototype.start=function(startedAt){this.startedAt=startedAt;this.lastInsertAt=startedAt;this.framesCount=0;this.fps=[];this.elem=document.createElement('span');requestAnimationFrame(this.update)};Animate.prototype.waitFinish=function(){var _this=this;return new Promise(function(resolve){_this.elem.addEventListener('finish',resolve,!1)})};return Animate}());var average=function(list){return list.reduce(function(prev,curr){return prev+curr})/list.length};var anim=new Animate();anim.start(performance.now());console.log('FPS - test duration:',maxDuration/1000,'seconds');anim.waitFinish().then(function(){return anim.fps}).then(function(fps){var fpsBelowThreshold=fps.filter(function(v){return v<5});if(fpsBelowThreshold.length>2){console.error('FPS - failed ❌',average(fps),fps)} | |
else{console.log('FPS - success ✅',average(fps))}}).catch(console.error)})() |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Original code: https://www.typescriptlang.org/play/#src=((maxDurationParam%3A%20number%20%3D%2030)%20%3D%3E%20%7B%0D%0A%20%20const%20maxDuration%20%3D%20maxDurationParam%20*%201000%0D%0A%20%20class%20Animate%20%7B%0D%0A%20%20%20%20startedAt%3A%20number%3B%0D%0A%20%20%20%20lastInsertAt%3A%20number%3B%0D%0A%20%20%20%20framesCount%3A%20number%3B%0D%0A%20%20%20%20fps%3A%20number%5B%5D%3B%0D%0A%20%20%20%20elem%3A%20HTMLElement%3B%0D%0A%0D%0A%20%20%20%20start(startedAt%3A%20number)%20%7B%0D%0A%20%20%20%20%20%20this.startedAt%20%3D%20startedAt%3B%0D%0A%20%20%20%20%20%20this.lastInsertAt%20%3D%20startedAt%3B%0D%0A%20%20%20%20%20%20this.framesCount%20%3D%200%3B%0D%0A%20%20%20%20%20%20this.fps%20%3D%20%5B%5D%3B%0D%0A%20%20%20%20%20%20%2F%2F%20Fake%20element%20to%20bind%20events%20on%20it%0D%0A%20%20%20%20%20%20this.elem%20%3D%20document.createElement('span')%3B%0D%0A%20%20%20%20%20%20requestAnimationFrame(this.update)%3B%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%20%20%20%20update%20%3D%20(tickAt%3A%20number)%20%3D%3E%20%7B%0D%0A%20%20%20%20%20%20if%20(tickAt%20-%20this.lastInsertAt%20%3E%3D%201000)%20%7B%0D%0A%20%20%20%20%20%20%20%20this.fps.push(this.framesCount)%3B%0D%0A%20%20%20%20%20%20%20%20this.lastInsertAt%20%3D%20tickAt%3B%0D%0A%20%20%20%20%20%20%20%20this.framesCount%20%3D%200%3B%0D%0A%20%20%20%20%20%20%7D%0D%0A%20%20%20%20%20%20this.framesCount%20%2B%3D%201%3B%0D%0A%20%20%20%20%20%20if%20(tickAt%20-%20this.startedAt%20%3C%20maxDuration)%20%7B%0D%0A%20%20%20%20%20%20%20%20requestAnimationFrame(this.update)%3B%0D%0A%20%20%20%20%20%20%7D%20else%20%7B%0D%0A%20%20%20%20%20%20%20%20this.elem.dispatchEvent(new%20Event('finish'))%3B%0D%0A%20%20%20%20%20%20%7D%0D%0A%20%20%20%20%7D%0D%0A%0D%0A%20%20%20%20waitFinish()%20%7B%0D%0A%20%20%20%20%20%20return%20new%20Promise(resolve%20%3D%3E%20%7B%0D%0A%20%20%20%20%20%20%20%20this.elem.addEventListener('finish'%2C%20resolve%2C%20false)%3B%0D%0A%20%20%20%20%20%20%7D)%3B%0D%0A%20%20%20%20%7D%0D%0A%20%20%7D%0D%0A%0D%0A%20%20const%20anim%20%3D%20new%20Animate()%3B%0D%0A%20%20anim.start(performance.now())%3B%0D%0A%0D%0A%20%20console.log('FPS%20-%20test%20duration%3A'%2C%20maxDuration%20%2F%201000%2C%20'seconds')%3B%0D%0A%0D%0A%20%20anim.waitFinish()%0D%0A%20%20%20%20.then(()%20%3D%3E%20%7B%0D%0A%20%20%20%20%20%20return%20anim.fps%3B%0D%0A%20%20%20%20%7D)%0D%0A%20%20%20%20.then((fps)%20%3D%3E%20%7B%0D%0A%20%20%20%20%20%20const%20fpsBelowThreshold%20%3D%20fps.filter(v%20%3D%3E%20v%20%3C%205)%3B%0D%0A%20%20%20%20%20%20if%20(fpsBelowThreshold.length%20%3E%202)%20%7B%0D%0A%20%20%20%20%20%20%20%20console.error('FPS%20-%20failed%20%E2%9D%8C'%2C%20fpsBelowThreshold)%3B%0D%0A%20%20%20%20%20%20%7D%20else%20%7B%0D%0A%20%20%20%20%20%20%20%20console.log('FPS%20-%20success%20%E2%9C%85')%3B%0D%0A%20%20%20%20%20%20%7D%0D%0A%20%20%20%20%7D)%0D%0A%20%20%20%20.catch(console.error)%3B%0D%0A%7D)()%3B%0D%0A
Minified with: https://www.minifier.org/