Web开发

首页 » 常识 » 问答 » Lath纯前端容器打造页面间的无缝平
TUhjnbcbe - 2025/5/13 17:56:00
北京白癜风医院 http://www.jk100f.com/

前端性能现状

提到前端你最先想到什么?前端工程?web?JavaScript、CSS、HTML?

如果站在用户的视角那是他们距离信息最近的地方,无论前端在生产技术上如何演变,最终服务于信息表达的根本不会变。在互联网诞生的初期就已经存在前端技术了,起初它就和传真没有什么区别,只能表达一些简单的基础信息,但随着浏览器不断的技术演变,如今的前端领域已是拥有超级复杂的信息表达系统了。

如今的前端除了可轻松构建起丰富的信息表达形式,更具有可共享、易更新、多平台运行等等的优点,随着生态体量的不断壮大,前端技术也逐渐慢慢渗透到了其它终端领域。比如在移动应用中使用Hybrid混合技术,通过结合前端技术与原生技术来同时兼顾与获得两者的优势,以及在另外的领域通过削减复杂度和实现支持部分API来使前端达到更高性能的方案,比如RN、miniApp等。

数据统计约70%的移动App中都内置了webview/混合的技术方案,主要进行能力供给与Web页面的管理。恰如其名、web页面以单位“页面”进行度量,可见其在构建大型应用时的局限性,就如纸张一般,可以肆意的书画其内容,但是脱离纸张之外就无能无力了,因而才需要一个“导航器”将纸张进行串联成册以进行管理,浏览器的基础功能也恰是如此了。

与原生技术的性能差异是什么?

使用混合或转换技术来替代纯前端技术产品是有违于互联网开放与共享本质的,而究其原因,为什么而不得不采用混合技术?原因主要有两个:1是可提供系统级的能力,比如修改系统信息等,这在Web上是完全做不到的(但这也并非Web领域内所专注的事情)。2是对页面间连接的管理,包括转场效果、加载性能、内存回收等等。问题1是NativeApps领域里本身就需要解决的问题,而“问题2”正是当前Web能力不足的关键之处。

当前我们大部分真正需要以“信息形式”共享到外部的页面基本上都是符合“问题2”的状况,对于这一部分页面存在两个态:一个是在混合技术内呈现的态,一个是在混合技术外呈现的态。由于技术的差异性,必然造成后者的整体使用体验比前者要差距甚大。

现在为了弥补这种体验上的差距,我们需要一个纯前端的技术来抹平因这种技术差异所造成的体验缺陷。

我们可以进行具体一点的思考,这些所谓的体验差距到底是什么呢?

我觉得可以从心理感受上总结为“快”和“稳”,快首先体现在加载速度,首次见面可不能慢了,另外则是在动画效果上的帧率要足够顺滑,不可出现卡、闪的现象,再一个就是在手指交互的一些行为上能做到及时的响应,不能出现延迟响应和不响应的状况。

如果说快是物理现象,那么在稳的层面则更倾向于“心理感受”,这也是人们自动区分事物属性所具有的本能,比如web页面更容易出现结构异变,比如在加载的初期呈现不完整的结构信息,以及更容易出现加载时白屏,甚至是出现错误导致不得不强制刷新,这都令Web感觉更加的“脆弱”,(比如很多人会遇到表单填写失败刷新后被清空也是脆弱感的体现)并且它实际上还很“单薄”,因为Web应用往往功能和结构都相对简单,在Web中页面关系是串联的,要么向前要么向后是一个二维的线形的结构,而原生App则可以是网状的,能够产生跳跃的,因此这些印象都深刻的为Web带来了偏见。

除此以外Web还有一些天生的缺陷或是说从来就不是很普遍被解决的问题,例如离线访问、与其他应用的共享和交互、推送通知、键盘与文本编辑、后台更新、文件系统等等,但乐观的是这些在一些最新的浏览器中已被得到了支持。

性能问题该从哪个角度来解呢?

我们再来回顾来看一下SPA+PWA的组合为什么没能普遍流行就很好得到解释了。

虽然SPA增加了应用的“厚度感”,PWA也提供了上面提到的诸如离线缓存,消息推送等能力,但这都没能让Web看起来能像一个原生应用,它仅仅是一个更好的Web而已,在体验问题上并没有得到巨大的进步。

当然交互的体验问题,也是多年来前端容易忽视的问题,因为人们常常认为前端的“所谓性能”主要指的就是“首屏加载”的时间,而非真实的使用感受,因为真实世界里我们常常归咎于用户手机性能的好坏,在这一点上所有人对Web的包容性明显比原生应用的包容性高的多,只要页面不出错就是可被接受的,对于Web性能本就如此早就产生了一些不必说的共识。

以“首屏加载”作为“性能”的主要指标的另一个重要原因是该指标能够被进行可直观的可量化的衡量,不仅可作为技术纬度的衡量,更重要的是在业务数据方面也是一个重要的衡量指标。

相比一些硬指标,体验性能则就较为抽象了,就拿Android和IOS相比,我们都知道两者在交互体验上存在着明显的差异,但在功能性方面对比两者则可能是仲伯之间,很难在一个单一维度中对比某一体验设计对整体的影响,因为体验设计本身是一个整体性的东西,因此体验感的缺失也是整体性的,站在一个单点来看细节体验在一些功能性面前简直不值一提,但站在一个系统来看,一个整体的体验感却是胜过不痛不痒的功能点的。

因而当功能性与同类产品相佐时就更需要提升整体的体验感来获得忠实的用户。

在一件事情达到瓶颈时人们往往就会寻求新的发展方向,比如发展替代产物或提升工程效率或甚至于覆盖到其他领域,都是从实际效能比出发去驱动工作内容的,就如芯片领域是一样,这都是很容易理解的事物发展规律。

让我们回归到互联网的本质,用第一性原理来拨析Web发展的方向,若我们从一个信息共享的未来俯瞰观测,那么打开与开放一定会是趋势而一定不会是走向一个封闭领域,所以一切的“变种”一定都是短暂的洪流。重回正题,我们要面向未来地解决前端体验问题,就必须用前端来解决前端问题。注意我说的是体验问题,而没有归纳为性能问题,因为Web的普遍性体验并非都是因为受限于性能,而绝大部分是开发思维的问题。

纯前端容器Lath是什么?

既然我们明确了必须由前端解决前端体验问题,那么我们到底要解决哪一些具体的问题呢?嗯,很棒的是我们已经这样做了,并且诞生了很棒的产品,就是我们今天要讲的主角“Lath”,抱歉主题来的有点晚,因为我必须交代以上背景。

Lath是一个纯前端的容器,它能够把任何一个普通的Web页面变为可丝滑连接与其关联页面的集合,也就是可以将任何页面变为一个SPA单页Web应用。Lath所带来了一些交互效果,但要注意的是它并非是一个库或框架,准确来说Lath并不参与到你页面内部的逻辑,比如你组件自己的动画效果和逻辑,它主要

1
查看完整版本: Lath纯前端容器打造页面间的无缝平