关于web:页面加载性能之LieFi

53次阅读

共计 1187 个字符,预计需要花费 3 分钟才能阅读完成。

当你的设施处于有网络的状况下,拜访网页、关上 App 都很顺畅,能够随时获取到你想要的信息。

但有时候你还是会处于断网的状态,为了让 App 或者网站能在离线状态下应用,咱们常常会把一些数据存在设施本地,这样用户仍然能够体验良好。

介于 onlineoffline 之间,有这么一种状态: Lie-Fi

Lie-Fi 中文能够翻译成欺骗性网络,你的设施的确连上了无线网,但你仍然不能关上网页,置信不少开发者被本人的领导这样吐槽过:” 咱们网站怎么打不开了,我 wifi 都连着呢 ”。试想一下你的领导当初处于办公室的关闭环境、或者其余关闭环境,wifi 的热点信号弱、或者的确是宽带网络出了问题,你会进入这样的一种状态,一张图就能了解:

的确有一些办法能够来应答这种状况

一些提醒

1. 检测 Lie-Fi

你的设施坑骗了你,尽管连上了网,但却上不了网。你会如何去检测?又会如何告知你的用户呢?

如果你在开发混合式 App,能够尝试一下 Offline.js。为了检测断网的状况,它会定时的去 ping 服务器,检测连贯是否失常。

2. 设置短的超时工夫

向服务器发送申请的时候,你不必设置 10 秒或者更长的超时工夫,个别用户期待 3 秒,就可能会来到页面了,依据本身业务状况,尽可能的设置短的超时工夫。如果超时了,也要给用户展现一些有意义的信息。 不要 像上面这样:

3. 设置好空状态

在你的设施与服务器交互的过程中,用户会看到什么?你要思考是让他看 0 或者空的列表,就太蹩脚了。

如果一个手机银行的 App,此时遇到了 Lie-Fi, 可能会展现成如下图所示:

我钱哪去了?钱并没有清空,只是被 Lie-Fi 坑骗了。尝试一下去掉 0,展现空的信息,用户的体验会更好:

宁愿留空,也不要展现错的信息

一些教训

1. 检测 Lie-Fi 节约钱

服务器的带宽是无限的,如果破费大量的带宽让用户来 ping 服务器,只为了做检测,对服务器的带宽耗费是有点太大了。

思考下针对有钱人提供这样的服务,比方 vip 用户,或者某些带宽便宜的的地区,或者不做检测。

2. 给申请做优先级排序毫无意义

有时候 Lie-Fi 的确是十分慢的连贯。如果你一个屏幕上展现了很多种信息,你可能会思考按信息的重要性来给发动的申请做排序,如下图:

看上去很不错,但实际上是没成果的。

扭转申请收回去的程序,并不意味着你收到响应的程序也是这样。

三种可能的起因:

  • 申请到达服务器的程序不肯定是同样的排序
  • 每个申请的解决工夫不一样
  • 响应的数据大小也不一样

如何在咱们的站点测试 Lie-Fi 的环境呢?

chrome 开发者工具提供了这个性能,容许你去模仿不同的网络环境,能够使低带宽,也能够是离线。

总结

无效的利用工具,再联合咱们的站点进行多种网络的测试,确保给用户提供了最佳的体验,即便是这种很差的网络状况下。

参考

  • https://www.outsystems.com/bl…
  • https://developers.google.com…
正文完
 0