Estimate browser JS engine speed to conditionally disable animations

 ̄綄美尐妖づ 提交于 2019-12-20 14:36:02

问题


Is there a standard (accepted/easy/performant) way to determine how fast a client machine renders javascript?

When I'm running web apps (videos, etc) on my other tabs my JS animations slow to a crawl.

If I could detect slowness from my JS, I would use simpler animations to provide a better user experience.

Update:

Removing animations for everyone is not the answer. I am talking about the simplest of animations which will stutter depending on browser / computer. If I could detect the level of slowness, I would simply disable them.

This is the same as video games with dynamic graphics quality: you want to please people with old computers without penalizing those who have the extra processing power.


回答1:


One tip is to disable those hidden animations. if they are on another tab that is not in focus, what's the use of keeping them animated?

Another is to keep animations to a minimum. I assume you are on the DOM, and DOM operations are expensive. keep them to a minimum as well.

One tip I got somewhere is if you are using image animation manipulation, consider using canvas instead so that you are not operating on the DOM.

Also, consider progressive enhancement. Keep your features simple and work your way up to complicated things. Use the simple features as a baseline every time you add something new. That way, you can easily determine what causes the problem and fix it accordingly.


The main problem you should first address is why it is slow, not when it is slow.




回答2:


I know this question is old, but I've just stumbled across it. The simplest way is to execute a long loop and measure the start and end time. This should give you some idea of the machine's Javascript performance.

Please bear in mind, this may delay page loading, so you may want to store the result in a cookie, so it's not measured on every visit to the page.

Something like:

var starttime = new Date();
for( var i=0; i<1000000; i++ ) ;
var dt = new Date() - starttime;

Hope this helps.



来源:https://stackoverflow.com/questions/10325821/estimate-browser-js-engine-speed-to-conditionally-disable-animations

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!