本文涵盖内容
包括浏览器中的数据库、让首次加载感觉即时完成、同步引擎、为速度而设计、动画效果等方面。
浏览器中的数据库
多数Web应用遵循传统循环模式,会出现加载指示器等问题。Linear颠覆传统,其用户界面读取的数据库位于浏览器的IndexedDB中,数据变更先本地应用,再异步推送。构建快速Web应用要消除网络请求,Linear做到了。通过示例展示Linear请求操作的简单性,其联合创始人托马斯表示一开始就明确了同步引擎的重要性。大多数人可借助库通过乐观更新提升应用速度,乐观请求能让应用如原生应用般快速。还介绍了Linear的技术栈,其坚持使用客户端渲染也能实现即时加载。
让首次加载感觉即时完成
首次加载体验很关键,客户端应用初始加载变慢有诸多原因。Linear四次重写构建管道,减少JavaScript和CSS数量,带来代码传输量减少、压缩后体积缩小等改进。即便优化后仍传输约21MB压缩后的JavaScript,但代码按需获取。将JavaScript分割成小代码块后可预加载,Linear让浏览器并行发送请求,冷加载时间线变为并行批量加载。服务工作者缓存路由级代码块,让应用可离线使用。Linear每个包独立缓存,细化供应商缓存。其在字体加载、内联应用外壳、先渲染后认证等方面的设置也确保了快速加载。
同步引擎
Linear速度快源于将服务器作为同步目标,其同步引擎有三个支柱:数据已存在,从IndexedDB加载到内存对象池,数据分块使引擎可扩展;数据变更无需等待网络,本地变更后再与服务器同步;一次变更只更新一个单元格,避免级联更新。三个支柱协同工作使应用保持快速。
为速度而设计
速度也是设计问题,Linear将键盘作为主要工具,每个常见操作有快捷键,命令面板一键打开,这种设计和工程结合让应用使用快速。
动画效果
糟糕动画效果会影响前面的努力。Linear只对少数属性动画处理,如合成属性等,知道何时停止动画,且动画持续时间短而简洁,进入和退出采用不对称时间设置。