Right now I only know about Scientiamobile's WURFL and a few others. Those libraries or databases tell you quite a lot of things about the device but none of them can clearly indicate that you shouldn't use CSS transitions or other sorts of animation because even if the device supports it, its a complete different story that those features will run smoothly and this is my major concern when building mobile web apps.
现在我只知道Scientiamobile的WURFL和其他几个。这些库或数据库告诉你相当多的关于设备的事情,但没有人能清楚地表明,因为即使该设备支持的话,它完全不同的故事,你不应该使用CSS过渡或其他类型的动画,这些特点这将是我在构建移动网络应用程序时的主要关注点。
Is it technically possible to 'classify' devices in this direction, using the 'WURF' database ? And which device capabilities I should use to 'group' devices as 'fast' in terms of graphic power ?
在技术上是否可以使用'WURF'数据库在这个方向上“分类”设备?我应该使用哪些设备功能将设备“分组”为图形功率方面的“快速”?
Finally, I just need a rating of the device from 1-5 in order to decide which gfx operations I can use.
最后,我只需要从1-5开始对设备进行评级,以便决定我可以使用哪些gfx操作。
well, any thought is welcome. It turns out as real brainer and the researches on internet didn't bring up anything useful except lots of data about device caps.
好吧,任何想法都是受欢迎的。事实证明,除了大量关于设备上限的数据之外,互联网上的研究并没有带来任何有用的东西。
Update-1 : I just got a response from ScientiaMobile : "we have been playing around with the idea of some form of Javascript performance index (possibly based on one of the existing benchmarks) that could give some indication of that, but we are still not there yet. The problem is complex."
Update-1:我刚收到ScientiaMobile的回复:“我们一直在尝试某种形式的Javascript性能指标(可能基于现有基准测试之一)的想法,可以给出一些指示,但我们仍然还没有。问题很复杂。“
Update-2 : The biggest bottlenecks we discovered in mobile web apps
Update-2:我们在移动网络应用中发现的最大瓶颈
- animation power
- 动画力量
- PNG transparency
- PNG透明度
- text and box shadows
- 文字和框阴影
- image resizing
- 图像大小调整
For us its really enough to figure out that we need to disable those features as they can bring any application to its knees. Possibly, there are also other approaches.
对我们来说,它足以弄明白我们需要禁用这些功能,因为它们可以让任何应用程序瘫痪。可能还有其他方法。
Thank you.
谢谢。
3 个解决方案
#1
10
Unfortunately, I do not believe this is possible today for the general case.
不幸的是,我认为一般情况下今天不可能。
If you are only interested in a limited number of devices, of course you could test each and target those specifically via user agent or JavaScript-based detection.
如果您只对有限数量的设备感兴趣,当然您可以测试每个设备,并通过用户代理或基于JavaScript的检测专门针对这些设备。
Within the context of a thick app (e.g., you "wrap" your web site with something like Apache Cordova), it would be possible to provide JavaScript access to some of the device internals (e.g., amount of total memory, amount of free memory, processor speed), but otherwise, this information is not available from the browser. As you've hinted at, having access to this type of device information may still be insufficient (e.g., seemingly "high spec" devices that perform poorly).
在厚应用程序的上下文中(例如,您用Apache Cordova“封装”您的网站),可以提供对某些设备内部的JavaScript访问(例如,总内存量,可用内存量) ,处理器速度),但除此之外,浏览器无法提供此信息。正如您所暗示的那样,访问此类设备信息可能仍然不足(例如,表现不佳的看似“高规格”设备)。
JavaScript feature detection libraries like Modernizr can answer whether something such as box-shadow and text-shadow is supported by the user's current browser, but does not provide information about how well or how quickly supported features will be rendered.
像Modernizr这样的JavaScript特征检测库可以回答用户当前浏览器是否支持box-shadow和text-shadow等内容,但不提供有关支持的功能的呈现效果和速度的信息。
Likewise, the datasets from Browserscope and related project ringmark (somewhat of a JavaScript analog to WURFL) answer these browser support questions on a per-browser-version basis through crowdsourced benchmarking tests (e.g., does the iPhone support CSS3 transitions?), and for the general case, this is what would be necessary. You would need to run a benchmark test for the various features in question and assess real-time performance. However, even this has its limitations:
同样,来自Browserscope和相关项目ringmark(有点像JavaScript模拟WURFL)的数据集通过众包基准测试(例如,iPhone是否支持CSS3过渡?)以及每个浏览器版本来回答这些浏览器支持问题。一般情况下,这是必要的。您需要针对相关的各种功能运行基准测试并评估实时性能。然而,即使这有其局限性:
- Because the necessary conditions for speed (available memory, processor, battery, network connection, etc.) are constantly in flux as mobile users move around, receive calls, change hardware settings, launch background applications, etc., the result of the benchmark is likely to be unreliable/unrepeatable.
- 由于移动用户四处移动,接听电话,更改硬件设置,启动后台应用程序等,因此速度的必要条件(可用内存,处理器,电池,网络连接等)不断变化,基准测试的结果是可能不可靠/不可重复。
- Benchmarking takes time and will invariable add a (hopefully unnoticable) delay.
- 基准测试需要时间并且会不变地增加(希望是不可察觉的)延迟。
- Depending on the feature, benchmarking may not be practical.
- 根据功能,基准测试可能不实用。
- Features may behave differently in combination (e.g., animating transparent PNGs with shadows) or at scale (e.g., every image on the page is animating) than individually in the benchmarking test.
- 在基准测试中,特征在组合(例如,使阴影具有动画的透明PNG)或大规模(例如,页面上的每个图像是动画)方面可以表现得不同。
- If you rely on benchmarking datasets instead of performing your own real-time benchmarking, the sample size, scope, and age of the dataset greatly limits its usefulness.
- 如果您依赖基准测试数据集而不是执行自己的实时基准测试,则数据集的样本大小,范围和年龄会极大地限制其有用性。
A final point is that I haven't even addressed is the fact that performance is rather subjective. Say it were somehow possible to assess/predict the speed of an animation. If the animation will run at 15 fps, should the user see that animation? What about 5 fps? Who gets to be the ultimate arbiter that decides the threshold for whether or not a given feature performs well enough?
最后一点是我甚至没有解决的问题是表现是相当主观的。说以某种方式可以评估/预测动画的速度。如果动画将以15 fps运行,用户是否应该看到该动画? 5 fps怎么样?谁成为最终仲裁者,决定某个特定功能是否表现良好的门槛?
The best advice I can offer today is to reduce (or eliminate) your reliance on the troublesome features for the time being. It may seem terrible to suggest going back to "the old way" of using images with precomposed shadows or making background gradients without CSS3, but at the end of the day the user experience should take precedence over using the shiney new technology. Many mobile devices are simply not there yet, and neither are the detection methods. If you must use these features, perhaps consider a simple but unobtrusive way for users to opt-in/opt-out like Gmail's "standard" vs. "basic HTML" view options, or consider automatically doing the opt-in for known good browsers.
我今天提供的最佳建议是减少(或消除)您暂时对麻烦功能的依赖。建议回到使用具有预组合阴影的图像或在没有CSS3的情况下制作背景渐变的“旧方法”可能看起来很糟糕,但在一天结束时,用户体验应该优先于使用闪亮的新技术。许多移动设备根本就不存在,检测方法也不存在。如果您必须使用这些功能,可以考虑使用简单但不显眼的方式让用户选择加入/退出,例如Gmail的“标准”与“基本HTML”视图选项,或考虑自动为已知良好的浏览器选择加入。
#2
2
I can't add much more than 'user113215' already said. Also its not an answer to the actual question but rather to the actual problem :
我不能添加比'user113215'已经说过的更多。它也不是实际问题的答案,而是实际问题的答案:
I did experiment with a few users and we were using a simple welcome popup menu, asking the user to turn off special effects such shadows and animations. The most of the test users did appreciate the choice and clearly understood the means of such menu. We do integrate this now more advanced and in conjunction with a hidden benchmark for auto pre-selection of GFX effects.
我尝试了几个用户,我们使用了一个简单的欢迎弹出菜单,要求用户关闭特殊效果,如阴影和动画。大多数测试用户都很欣赏这种选择,并清楚地理解了这种菜单的方法。我们现在将此更高级集成,并与用于自动预选GFX效果的隐藏基准相结合。
Thank you. g
谢谢。 G
#3
0
In short, no. How we define the smoothness of animations and graphics is solely depend on the FPS(frame-per-second). And in this question we are talking about "web-app"s, which are making use of HTML and JS on the client-side. Since none of the client side provide interface for the programs to get the FPS by HTML or JS, it is impossible to tell if the client is smooth or not.
总之,没有。我们如何定义动画和图形的平滑度完全取决于FPS(每秒帧数)。在这个问题中,我们讨论的是“web-app”,它们在客户端使用HTML和JS。由于客户端都没有为程序提供通过HTML或JS获取FPS的接口,因此无法判断客户端是否平滑。
However, if you really want a benchmark on the performance of web-app. You can make use of stats.js to monitor the change of stat and have a benchmark for you to suggest your client activating or disabling any sort of effects on runtime. This method even working with most FXs of Javascript libraries like jquery too. But this will take sometime for you to get enough data before applying changes and the stat may differ from the status of the device, such as memory usage, concurrent applications, etc.
但是,如果你真的想要一个关于web-app性能的基准测试。您可以使用stats.js来监控stat的变化,并为您建议客户激活或禁用任何类型的运行时效果的基准。这种方法甚至可以与Jquery等Javascript库的大多数FX一起使用。但是,在应用更改之前,您需要一段时间才能获得足够的数据,并且统计信息可能与设备状态不同,例如内存使用情况,并发应用程序等。
#1
10
Unfortunately, I do not believe this is possible today for the general case.
不幸的是,我认为一般情况下今天不可能。
If you are only interested in a limited number of devices, of course you could test each and target those specifically via user agent or JavaScript-based detection.
如果您只对有限数量的设备感兴趣,当然您可以测试每个设备,并通过用户代理或基于JavaScript的检测专门针对这些设备。
Within the context of a thick app (e.g., you "wrap" your web site with something like Apache Cordova), it would be possible to provide JavaScript access to some of the device internals (e.g., amount of total memory, amount of free memory, processor speed), but otherwise, this information is not available from the browser. As you've hinted at, having access to this type of device information may still be insufficient (e.g., seemingly "high spec" devices that perform poorly).
在厚应用程序的上下文中(例如,您用Apache Cordova“封装”您的网站),可以提供对某些设备内部的JavaScript访问(例如,总内存量,可用内存量) ,处理器速度),但除此之外,浏览器无法提供此信息。正如您所暗示的那样,访问此类设备信息可能仍然不足(例如,表现不佳的看似“高规格”设备)。
JavaScript feature detection libraries like Modernizr can answer whether something such as box-shadow and text-shadow is supported by the user's current browser, but does not provide information about how well or how quickly supported features will be rendered.
像Modernizr这样的JavaScript特征检测库可以回答用户当前浏览器是否支持box-shadow和text-shadow等内容,但不提供有关支持的功能的呈现效果和速度的信息。
Likewise, the datasets from Browserscope and related project ringmark (somewhat of a JavaScript analog to WURFL) answer these browser support questions on a per-browser-version basis through crowdsourced benchmarking tests (e.g., does the iPhone support CSS3 transitions?), and for the general case, this is what would be necessary. You would need to run a benchmark test for the various features in question and assess real-time performance. However, even this has its limitations:
同样,来自Browserscope和相关项目ringmark(有点像JavaScript模拟WURFL)的数据集通过众包基准测试(例如,iPhone是否支持CSS3过渡?)以及每个浏览器版本来回答这些浏览器支持问题。一般情况下,这是必要的。您需要针对相关的各种功能运行基准测试并评估实时性能。然而,即使这有其局限性:
- Because the necessary conditions for speed (available memory, processor, battery, network connection, etc.) are constantly in flux as mobile users move around, receive calls, change hardware settings, launch background applications, etc., the result of the benchmark is likely to be unreliable/unrepeatable.
- 由于移动用户四处移动,接听电话,更改硬件设置,启动后台应用程序等,因此速度的必要条件(可用内存,处理器,电池,网络连接等)不断变化,基准测试的结果是可能不可靠/不可重复。
- Benchmarking takes time and will invariable add a (hopefully unnoticable) delay.
- 基准测试需要时间并且会不变地增加(希望是不可察觉的)延迟。
- Depending on the feature, benchmarking may not be practical.
- 根据功能,基准测试可能不实用。
- Features may behave differently in combination (e.g., animating transparent PNGs with shadows) or at scale (e.g., every image on the page is animating) than individually in the benchmarking test.
- 在基准测试中,特征在组合(例如,使阴影具有动画的透明PNG)或大规模(例如,页面上的每个图像是动画)方面可以表现得不同。
- If you rely on benchmarking datasets instead of performing your own real-time benchmarking, the sample size, scope, and age of the dataset greatly limits its usefulness.
- 如果您依赖基准测试数据集而不是执行自己的实时基准测试,则数据集的样本大小,范围和年龄会极大地限制其有用性。
A final point is that I haven't even addressed is the fact that performance is rather subjective. Say it were somehow possible to assess/predict the speed of an animation. If the animation will run at 15 fps, should the user see that animation? What about 5 fps? Who gets to be the ultimate arbiter that decides the threshold for whether or not a given feature performs well enough?
最后一点是我甚至没有解决的问题是表现是相当主观的。说以某种方式可以评估/预测动画的速度。如果动画将以15 fps运行,用户是否应该看到该动画? 5 fps怎么样?谁成为最终仲裁者,决定某个特定功能是否表现良好的门槛?
The best advice I can offer today is to reduce (or eliminate) your reliance on the troublesome features for the time being. It may seem terrible to suggest going back to "the old way" of using images with precomposed shadows or making background gradients without CSS3, but at the end of the day the user experience should take precedence over using the shiney new technology. Many mobile devices are simply not there yet, and neither are the detection methods. If you must use these features, perhaps consider a simple but unobtrusive way for users to opt-in/opt-out like Gmail's "standard" vs. "basic HTML" view options, or consider automatically doing the opt-in for known good browsers.
我今天提供的最佳建议是减少(或消除)您暂时对麻烦功能的依赖。建议回到使用具有预组合阴影的图像或在没有CSS3的情况下制作背景渐变的“旧方法”可能看起来很糟糕,但在一天结束时,用户体验应该优先于使用闪亮的新技术。许多移动设备根本就不存在,检测方法也不存在。如果您必须使用这些功能,可以考虑使用简单但不显眼的方式让用户选择加入/退出,例如Gmail的“标准”与“基本HTML”视图选项,或考虑自动为已知良好的浏览器选择加入。
#2
2
I can't add much more than 'user113215' already said. Also its not an answer to the actual question but rather to the actual problem :
我不能添加比'user113215'已经说过的更多。它也不是实际问题的答案,而是实际问题的答案:
I did experiment with a few users and we were using a simple welcome popup menu, asking the user to turn off special effects such shadows and animations. The most of the test users did appreciate the choice and clearly understood the means of such menu. We do integrate this now more advanced and in conjunction with a hidden benchmark for auto pre-selection of GFX effects.
我尝试了几个用户,我们使用了一个简单的欢迎弹出菜单,要求用户关闭特殊效果,如阴影和动画。大多数测试用户都很欣赏这种选择,并清楚地理解了这种菜单的方法。我们现在将此更高级集成,并与用于自动预选GFX效果的隐藏基准相结合。
Thank you. g
谢谢。 G
#3
0
In short, no. How we define the smoothness of animations and graphics is solely depend on the FPS(frame-per-second). And in this question we are talking about "web-app"s, which are making use of HTML and JS on the client-side. Since none of the client side provide interface for the programs to get the FPS by HTML or JS, it is impossible to tell if the client is smooth or not.
总之,没有。我们如何定义动画和图形的平滑度完全取决于FPS(每秒帧数)。在这个问题中,我们讨论的是“web-app”,它们在客户端使用HTML和JS。由于客户端都没有为程序提供通过HTML或JS获取FPS的接口,因此无法判断客户端是否平滑。
However, if you really want a benchmark on the performance of web-app. You can make use of stats.js to monitor the change of stat and have a benchmark for you to suggest your client activating or disabling any sort of effects on runtime. This method even working with most FXs of Javascript libraries like jquery too. But this will take sometime for you to get enough data before applying changes and the stat may differ from the status of the device, such as memory usage, concurrent applications, etc.
但是,如果你真的想要一个关于web-app性能的基准测试。您可以使用stats.js来监控stat的变化,并为您建议客户激活或禁用任何类型的运行时效果的基准。这种方法甚至可以与Jquery等Javascript库的大多数FX一起使用。但是,在应用更改之前,您需要一段时间才能获得足够的数据,并且统计信息可能与设备状态不同,例如内存使用情况,并发应用程序等。