关于loading显示的优化

在使用一些 APP 的时候,我们经常能够遇到 APP 中数据在请求时的 loading 效果,关于这个 loading 的出现时机,有很多可优化的地方,本文主要讨论一下怎样控制这个 loading 出现的时机,让其体验更加舒服。

设置动画最少执行时间

举个例子,如果你在 App Store 下载过应用的话,可能有所体会。在你点击下载一个 APP 的时候,下载按钮会先 loading 一段时间,然后再显示下载中。可能有的时候你的网速很快,但是这个 loading 还是会显示一段时间,比如 700ms(我估计的,起码这个时间不会特别短),难道是苹果的服务器不行?这里就是给动画设置了最少执行时间的一种体现。

如果网速够好,服务器和用户机器的性能都够好,为什么不立即返回呢?

假如,一个请求的响应非常快,只需要 100ms 就可以返回。那么对于动画执行来说,就只有 100ms,可能动画刚开始,就已经结束了,你会看到一个 loading 一闪而过,这种交互反而会让用户觉得是不是功能坏了,带来不适的体验。

设置动画出现最多等待时间

如果一个请求非常快的话,还有一种优化方式,就是给动画设置出现最多等待时间。

什么意思?就是让动画在请求开始时不立即出现,先等待一段时间,比如 500ms,如果 500ms 还没有结束再出现。

再举个栗子 🌰。

如果,一个请求只需要 100ms 就可以响应,这个请求是很快的,我们可以设置动画出现最多等待 300ms,这里 100ms 小于 300ms,所以就看不到 loading 效果了,给用户的感觉好像是在操作本地数据一样。

如果请求有点慢,可能要 1s 才响应,那么,在等待 300ms 时,请求还没有结束,这时候 loading 再显示出来,直到请求结束。

总结

小小的 loading 在用户体验上也可以做很多文章,本文主要介绍了这两种常见的优化方式,当然还有很多,选择适当的方式才会更加增强你的用户体验效果。

如果您觉得本文对您有用,欢迎捐赠或留言~
微信支付
支付宝

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注