【AICon】探索RAG 技术在实际应用中遇到的挑战及应对策略!AICon精华内容已上线73%>>> 了解详情
写点什么

无需后台接入?带你玩转 VasSonic 2.0 里的 Local Server

  • 2019-08-20
  • 本文字数:3283 字

    阅读完需:约 11 分钟

无需后台接入?带你玩转VasSonic 2.0里的Local Server

腾讯手 Q 增值团队于今年 8 月份正式开源了 VasSonic,一个轻量级高性能的 Hybrid 框架。VasSonic 框架使用并行加载、动态缓存、增量更新等手段,实现了终端 H5 页面的秒开,对用户体验的优化做的非常极致。时隔三个月,在业务需求的驱动和开源社区的共同努力下,VasSonic 迎来了开源后的第一次重大更新:VasSonic 2.0。

VasSonic 2.0 新特性介绍

VasSonic 2.0 新增了以下几个特性:


  • 支持 Local Server 模式,在该模式下无需后台配合亦可完成秒开,大大降低接入门槛

  • 支持自定义请求头和自定义响应头

  • 支持 Cache-Control 来控制缓存生命周期

  • 支持非 utf-8 编码


其中 Local Server 模式是 2.0 版本最大更新,也是本文重点介绍的一个特性。

玩转 Local Server 模式

Local Server 模式介绍

一般情况下,一个项目要接入 VasSonic,需要前端、终端、后台三端配合使用这个框架,才能达到预期的效果,这样有一定的接入成本。为了使开发者更加方便地使用 VasSonic,Local Server 模式应运而生。Local Server,顾名思义,相比于一般情况下终端、前端、后台全部接入,它允许在业务后台无法及时支持时,通过终端模拟 server,提供本该后台支持的能力,从而降低接入成本。


开启 Local Server 模式后,对于从非 Sonic 后台返回的页面数据,终端会在收到数据的第一时间执行本该 Sonic 后台完成的处理逻辑:对页面进行模板和数据的拆分,对比本地的模板和数据缓存,根据两者的对比结果,添加 Sonic 响应头(eTag、template-change、template-tag),将此次请求返回伪装成正常情况下的 Sonic 后台返回。终端逻辑层面上对返回的数据是来自真正的 Server 还是 Local Server 并无感知,终端只需按照正常逻辑进行处理即可。因此在 Local Server 模式下,后台无需接入 Sonic。

Local Server 接入方式

在 Android 端使用 Local Server,首先需要引用最新的 VasSonic 依赖,在 build.gradle 中添加:


compile 'com.tencent.sonic:sdk:2.0.0-beta'
复制代码


Local Server 功能默认是关闭的,需要初始化 SonicSession 配置时打开 Local Server,Android 端代码如下:


SonicSessionConfig.Builder sessionConfigBuilder = new SonicSessionConfig.Builder();sessionConfigBuilder.setSupportLocalServer(true);sessionConfigBuilder.build();
复制代码


在 iOS 端使用 Local Server,需要在 Podfile 中指定引入:


source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'


target 'TargetName' do
pod 'VasSonic', '2.0.0-beta'
end
复制代码


然后在代码中通过 SonicSessionConfiguration 打开 Local Server


SonicSessionConfiguration *configuration = [SonicSessionConfiguration new];
configuration.enableLocalServer = YES;
[[SonicEngine sharedEngine] createSessionWithUrl:self.url withWebDelegate:self withConfiguration:configuration];
复制代码


具体接入方法请详细参考官方 Demo (https://github.com/Tencent/VasSonic)。

LI’m ocal Server 执行流程

VasSonic 根据本地是否有缓存以及本地缓存数据与服务器数据的差异情况分为首次加载、完全缓存、数据更新、模板更新四种模式。除首次加载外,其他三种模式在 Local Server 下的执行流程与正常模式均有所差异。

首次加载

Local Server 的首次加载与正常的首次加载流程一致。具体细节可参考快速模式或者标准模式的首次加载流程。

非首次加载·完全缓存

完全缓存是指本地数据与服务器数据相比,没有任何变更。以快速模式为例,Local Server 的执行流程如下:



上图主要展示了两条并行线,左边是在主线程执行的 Webview 流程,右边是在子线程执行 Sonic 流程。


Sonic 线程:

Sonic 会话创建完成后,首先获取 url 对应的本地缓存数据,并通知主线程 Webview 加载该数据。接着 Sonic 会与 Server 建立连接,如果 Server 返回 304,则 Server 数据没有变更,直接使用本地缓存,Sonic 流程结束;否则,Sonic 拉取到完整的 Server 数据,计算其 SHA1 作为 eTag,如果与请求头中的 eTag 相同,就确定本次请求是完全缓存模式,Sonic 流程结束。

主线程:

主线程在收到 Sonic 通知后,加载本地缓存数据,交给 Webview 渲染。

非首次加载·数据更新

数据更新就是本地的数据跟服务器的数据相比,只有 data 部分有变化,模板与服务器一样。以快速模式为例,Local Server 的执行流程如下:



Sonic 线程:

Sonic 会话创建完成后,首先获取 url 对应的本地缓存数据,并通知主线程 Webview 加载该数据。接着 Sonic 与 Server 建立连接,读取到完整的 Server 数据,计算其 SHA1 作为 eTag,如果与请求头中的 eTag 不同,Sonic 将 Server 数据拆分为 template 和 data,计算 template 的 SHA1 作为 template-tag,如果与请求头中的 template-tag 相同,则说明模板没有变更,此时确定本次请求是数据更新,将拆分得到的 data 与本地保存的 data 做对比计算,得到增量数据。最后通知 Webview 进行数据更新,并更新本地缓存。

主线程:

数据更新模式下主线程会先收到加载本地缓存数据的通知,而 Sonic 线程通知主线程刷新 data 时,主线程可能还未开始加载本地缓存,也可能已经开始渲染本地缓存。如果 WebView 还未开始加载本地缓存,就会直接加载最新的数据(拆分得到的 data 跟本地模版合成的数据);如果主线程已经加载本地缓存,就会直接通过 Js 接口让 WebView 用增量数据刷新页面。

非首次加载·模板更新

模板更新是本地的模板跟服务器的模板不一致。以快速模式为例,Local Server 的执行流程如下:



Sonic 线程:

Sonic 会话创建完成后,首先获取 url 对应的本地缓存数据,并通知主线程 Webview 加载该数据。接着 Sonic 与 Server 建立连接,读取到完整的 Server 数据,计算其 SHA1 作为 eTag,如果与请求头中的 eTag 不同,Sonic 将 Server 数据拆分为 template 和 data,计算 template 的 SHA1 作为 template-tag,如果与请求头中的 template-tag 不同则说明模板发生了变更,此时确定本次请求是模板刷新模式,通知主线程 Webview 进行模板刷新,并更新本地缓存。

主线程:

主线程会先收到加载本地缓存数据的通知,之后 Sonic 线程通知主线程进行模板刷新时,无论 WebView 是否已经开始加载本地缓存数据,都会直接重新加载最新的 Server 数据,完成模板刷新。

小结:Local Server 模式的优缺点

优点: Local Server 模式下,简化了终端执行逻辑;而且无需后台接入 Sonic,大大减少了接入成本。


缺点: Local Server 模式相比后台接入,损失了一定的性能。因为终端模拟后台的话,非首次加载场景需要等 Server 数据全部返回才能计算 eTag,template-tag,template-change,从而判断是哪种模式(完全缓存、局部刷新还是模板更新)。

其他新增特性

1. 支持自定义请求头和自定义响应头

VasSonic 2.0 支持添加自定义请求头和自定义响应头,方式如下:


SonicSessionConfig.Builder sessionConfigBuilder = new SonicSessionConfig.Builder();
sessionConfigBuilder.setCustomRequestHeaders(requestHeaderMap);
sessionConfigBuilder.setCustomResponseHeaders(responseHeaderMap);
sessionConfigBuilder.build();
复制代码

2. 支持 Cache-Control 来控制缓存生命周期

VasSonic 2.0 支持在 Http 响应头部添加 Cache-Control 字段来控制缓存生命周期,目前支持 max-age、private、public 三个可选值。

3. 支持非 UTF-8 编码

VasSonic 2.0 优化了字符编码的使用。如果 http 响应头中包含"Content-Type"字段,则优先使用该字段的值作为字符编码,否则默认使用 UTF-8 编码。

结语

2.0 版本是 VasSonic 开源后的第一次重大更新,这个版本汇集了开源社区各位热心开发者的想法与建议,非常感谢大家的关注与参与。 我们的愿景是成为业界最好的 H5 加速框架!开发者在使用过程遇到问题或者有好的建议,欢迎在 Github 上给我们提 Issues。


Talk is cheap,read the code. If you are interested in VasSonic, just start to use it. Thank you for reading ~


点击阅读原文直接访问 VasSonic 源码:


https://github.com/Tencent/VasSonic


本文转载自公众号小时光茶舍(ID:gh_7322a0f167b5)。


原文链接:


https://mp.weixin.qq.com/s/ASRzAFJ5Q_Su72rSiFSPbQ


2019-08-20 14:148199

评论

发布
暂无评论
发现更多内容

第五周作业 (作业二)

Geek_83908e

极客大学架构师训练营

week-5-part2 学习总结

陈龙

第5周作业

paul

【架构师训练营 1 期】第五周学习总结

诺乐

5. Bean Validation声明式验证四大级别:字段、属性、容器元素、类

YourBatman

Hibernate-Validator Bean Validation 数据校验

2期架构师训练营 - 食堂就餐卡系统设计

云飞扬

极客大学架构师训练营

一致性hash

袭望

【架构师训练营 1 期】第五周作业

诺乐

作业-2020年10月25日

芝麻酱

week-5-part1 java实现一致性 hash 算法

陈龙

Week 5 作业02

Croesus

SpringBoot整合原生OpenFegin的坑(非SpringCloud)

冰河

微服务 高并发 远程调用 springboot OpenFegin

Consistent Hashing算法实现 - JavaScript

5.4 消息队列:如何避免系统故障传递?

orchid9

间隔重排序链表Reorder List,iOS架构RxSwift, VIPER,MVVM,MVP, 机器学习,SageMaker,John 易筋 ARTS 打卡 Week 23

John(易筋)

学习 ARTS 打卡计划 重新排列链表算法 iOS 架构RxSwift SageMaker

第五周学习心得

熊桂平

极客大学架构师训练营

阿里云盘线下交流会

兔2🐰🍃

阿里云网盘 Teambition 线下体验

5.2 分布式缓存架构:常见的缓存实现形式

orchid9

5.3 分布式缓存架构:一致性 hash 算法

orchid9

5.5 负载均衡架构

orchid9

架构师训练营 - 第 5 周课后作业(1 期)

Pudding

第五周作业(作业一)

Geek_83908e

极客大学架构师训练营

架构师训练营Week01总结

「架构师训练营」第 1 周作业 - 食堂就餐卡系统设计

xiaomao

第五周作业

熊桂平

极客大学架构师训练营

5.1 分布式缓存架构:架构原理与注意事项

orchid9

架构师训练营第五周学习笔记

一马行千里

极客大学架构师训练营

极客大学 - 架构师训练营第一期 - 第五周作业

Black Eyed Peter

极客大学架构师训练营

作业一:食堂就餐卡系统设计

伊灵

架构一期第五周作业

Airs

架构师训练营第 1 期第 5 周作业

owl

极客大学架构师训练营

无需后台接入?带你玩转VasSonic 2.0里的Local Server_语言 & 开发_腾讯手Q增值团队_InfoQ精选文章