离线优先:下一个渐进增强技术

简介: 原生应用速度比较快。如果你要创造下一个愤怒的小鸟,这当然很重要。然而,罕有应用需要达到游戏级别的响应度。也就是说,多一点关注度,利用HTML5技术创建一个快速反应的游戏是有可能的。但这能否在一系列的设备中良好运行就是另外一个事情了。客户部不知道哪个更好:“这应用如此酷!我们的对头就有了——我们也需要一个”。其实这需要一点说服力就可以解决这个问题的。手机应用能够离线运行。但是webapp也可以——就是这技术比较前沿而且我们很少用到的缘故

你的客户需要原生手机应用而非webapp有三条基本缘由:


  1. 原生应用速度比较快。如果你要创造下一个愤怒的小鸟,这当然很重要。然而,罕有应用需要达到游戏级别的响应度。也就是说,多一点关注度,利用HTML5技术创建一个快速反应的游戏是有可能的。但这能否在一系列的设备中良好运行就是另外一个事情了。
  2. 客户部不知道哪个更好:“这应用如此酷!我们的对头就有了——我们也需要一个”。其实这需要一点说服力就可以解决这个问题的。
  3. 手机应用能够离线运行。但是webapp也可以——就是这技术比较前沿而且我们很少用到的缘故


采用应用缓存来做一个web应用,离线应用已经实现好几个年头了。过程是这样定义的:静态文件应该被缓存以便于在网络连接丢失的情况下浏览器能运行应用。描述简洁明了,但是:


  • web开发者在想到网络连接失败的情况是很害怕的。我在火车上写这篇文章就仿佛感觉到魂不守舍。即使连接速度在提高,但对于生活在偏远地区与发展中国家数以百万计的人们来说这仍旧是一个问题。
  • 为已经存在的应用增加离线功能是不容易的。你需要重构ajax调用与网络请求,然后考虑网络连接状态的变化。但是,我们为什么不能够刚开始就考虑好呢。

移动优先(mobile-first)被认为是不错的开发技术。你从一个简单的可能是你的网站在不管年代或者设备上的所有浏览器运行的线性视图开始。更多的现代浏览器运用媒体查询(media queries)来应用样式扩展,在比较典型的桌面大屏幕设备上表现样式。换而言之,更优秀的浏览器采用大屏幕展示的布局就是渐进增强的。


离线应用的技术能否更易用些?应用应该推测到它的离线模式适时响应。当连接恢复,应用能够渐进增强地检索到增加的数据或者保存到云服务器。


离线优先(offline-first)成为被一些开发者探讨的概念,虽然还没有广泛应用。这里有些能够利用的主要概念。


1. 可信赖的远程机器

开发应用的逻辑重点要从服务端转向客户端。服务端本质上要变为轻量级的数据存储角色——重要的是——客户端应用应该运行在任何的网络连接状态下。


2. 创建客户端数据代理

你不能依赖ajax调用。一个数据代理要管理所有路由,例如:

  1. 如果连接可用,一个ajax调用请求到服务端(假设有必要)
  2. 如果连接不可用——或者ajax调用失败——localStorage、IndexDB 或其他合适的客户端存储机制被采纳。 记住,HTML5服务线程(HTML5 Service Workers)通过命名的javascript文件发送数据请求。虽然现在没什么浏览器支持该特性,也没实现标准,这种技术正在为这个目标进行设计。


3. 尽可能快地同步

当连接正常的时候你需要一个处理客户端到服务端的同步机制。采用web worker(线程)后台处理与在空闲期批量上传下载会更加有效率。

4. 考虑设备存储因素


移动设备比较复杂。比如:

  1. 切换到另一个应用的行为可能会关闭浏览器。理想情况下,你的web 应用应该总要保存应用状态以便于用户返回到他们上次离开的地方
  2. 当你的应用没有运行在被打开的浏览器标签里(最小化或者后台运行),Page Visibility API可以被用来减少处理过程与带宽
  3. 理想情况下,你的应用应该运用Battery Status API。当电池电量低于正常水平的时候,它可以把数据存储在localStorage,即使连接可用的情况下。


5. 测试,再测试

如果你的应用需要在无连接或者有连接的情况下可操作,测试是比较困难的,下面是一些情况:

  1. 应用被安装在不支持localstorage或者不支持其他必要技术的设备上
  2. 网络连接丢失与重连发生在随机的时间间隔内(不稳定)
  3. 在与服务端第一次通信之前网络丢失应用却被缓存
  4. 应用同时运行在两个或更多的设备上
    在一系列的设备上进行严格的测试看起来只是可选项。


并非所有应用都适合采取离线优先的原则;一个多角色动作游戏运用离线优先的原则是没有意义的。但是,这种技术是否采纳应该被许多web应用在开发伊始首先考虑的。我喜欢这样,虽然我担心在已经存在的系统中开发这种技术所需要的成本。

相关文章
|
4月前
|
移动开发 前端开发 UED
渐进式增强和优雅降级是两种互补的策略
【6月更文挑战第14天】前端开发中的渐进式增强与优雅降级是确保跨浏览器、跨设备良好体验的关键策略。渐进式增强从基础功能开始,逐步增加高级特性,保证所有用户能访问基本内容;而优雅降级则是从完整版开始,逐步降级功能以适应老旧浏览器。实践包括遵循HTML5/CSS3规范,使用流式布局,检测浏览器特性及提供备选方案。这两种方法旨在创建适应性强、兼容性好的网站,提升用户体验。
33 1
|
1月前
|
数据采集 存储 关系型数据库
选择合适的数据收集方式,需要考虑多个因素,
选择合适的数据收集方式,需要考虑多个因素,
50 5
|
2月前
|
Web App开发 缓存 Shell
PWA离线优先策略:提升用户体验的关键步骤
Progressive Web Apps (PWA) 采用Service Worker与Cache API实现离线优先策略,确保无网时仍可访问网站内容。通过注册Service Worker、配置缓存策略及manifest文件,结合App Shell架构和WebSocket支持,创建出即便在离线或弱网环境中也能提供流畅体验的高度可用应用。测试和持续优化对于保证PWA性能至关重要。
53 6
|
3月前
|
存储 缓存 监控
通用研发提效问题之动态调整干预能力,如何解决
通用研发提效问题之动态调整干预能力,如何解决
|
3月前
|
存储 SQL 运维
MSSQL性能调优精要:索引深度优化、查询高效重构与并发精细控制
在MSSQL数据库的运维与优化领域,性能调优是一项复杂而细致的工作,直接关系到数据库的稳定性和响应速度
|
3月前
|
机器学习/深度学习 自然语言处理 数据挖掘
RouteLLM:高效LLM路由框架,可以动态选择优化成本与响应质量的平衡
新框架提出智能路由选择在强弱语言模型间,利用用户偏好的学习来预测强模型胜率,基于成本阈值做决策。在大规模LLMs部署中,该方法显著降低成本而不牺牲响应质量。研究显示,经过矩阵分解和BERT等技术训练的路由器在多个基准上提升性能,降低强模型调用,提高APGR。通过数据增强,如MMLU和GPT-4评审数据,路由器在GSM8K、MMLU等测试中展现出色的性能提升和成本效率。未来将测试更多模型组合以验证迁移学习能力。该框架为LLMs部署提供了成本-性能优化的解决方案。
85 2
|
5月前
|
存储 缓存 安全
【C/C++ 项目优化实战】 分享几种基础且高效的策略优化和提升代码性能
【C/C++ 项目优化实战】 分享几种基础且高效的策略优化和提升代码性能
299 0
|
5月前
|
编解码 前端开发 JavaScript
渐进增强与优雅降级:提升用户体验的双重策略
渐进增强与优雅降级:提升用户体验的双重策略
渐进增强与优雅降级:提升用户体验的双重策略
|
5月前
|
前端开发 UED
渐进增强和优雅降级之间的不同
渐进增强和优雅降级之间的不同
57 0
|
负载均衡 并行计算 算法
BWA序列比对方法丨针对较大基因组的并行计算和性能优化方式,利用多线程和负载均衡策略提高效率
BWA序列比对方法丨针对较大基因组的并行计算和性能优化方式,利用多线程和负载均衡策略提高效率