System.ArgumentOutOfRangeException: 索引和长度必须引用该字符串内的位置。 参数名: length 在 System.String.Substring(Int32 startIndex, Int32 length) 在 zhuanliShow.Bind() 机器渲染页面的方法、系统、电子设备及存储介质技术方案_技高网

机器渲染页面的方法、系统、电子设备及存储介质技术方案

技术编号:40390781 阅读:8 留言:0更新日期:2024-02-20 22:22
本发明专利技术提供一种机器渲染页面的方法、系统、电子设备及存储介质,属于计算机技术领域。所述方法包括:解析模板,生成AST实例;对所述AST实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分;将各节点的标识符记录至节点分数表,各节点在所述节点分数表中被按照统计得分的高低排序;从所述节点分数表中选择指定比例的节点,在所述AST实例中标记与选择的节点对应的节点,被选择的节点的统计得分高于未被选择的节点的统计得分;在与所述模板绑定的数据发生变化之后,通过与被标记的节点对应的新虚拟DOM中虚拟节点直接更新真实DOM中相应真实节点。本发明专利技术用于响应式前端页面渲染。

【技术实现步骤摘要】

本专利技术涉及计算机,具体地涉及一种机器渲染页面的方法、一种渲染页面的系统、一种电子设备和一种机器可读存储介质。


技术介绍

1、文档对象模型(document object model,dom)是html文档和xml文档的应用程序编程接口,能将web页面与脚本或编程语言连接起来,提供了文档的结构化描述,典型地将文档解析为由节点以及包含属性和方法的对象组成的结构化描述的集合。每个dom对象都具有许多个属性,由浏览器渲染线程提供的每个属性所需的资源,需要绑定和占用大量系统资源,同时,javascript(js)线程之间存在线程通信,在事件触发时,线程间需要进行交互信息以完成dom更新,因此,直接频繁的操作dom是不高效的。目前,采用javascript对象对dom进行模拟,构建与系统资源脱离关系的虚拟dom,以寻找差异(diff)算法在原(旧)虚拟dom和新虚拟dom寻找差异,在虚拟dom处理完成之后,然后依据处理后的虚拟dom,只对差异内容进行渲染,更新真实dom,完成渲染。然而,在寻找差异过程中需要逐一比对各个节点,算法时间复杂度很高,时间复杂度为o(n),更新效率很低,系统资源锁定时间长、占用较多,很难实现规模化渲染应用。


技术实现思路

1、本专利技术的目的是提供一种机器渲染页面的方法、系统、电子设备及存储介质,避免了新旧虚拟dom的差异需要遍历而导致的时间复杂度过高、限制渲染规模,进而改善了系统内存的使用、渲染速度和页面更新时间。

2、为了实现上述目的,本专利技术实施例提供一种机器渲染页面的方法,该方法包括:

3、解析模板,生成ast实例;

4、对所述ast实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分;

5、将各节点的标识符记录至节点分数表,各节点在所述节点分数表中被按照统计得分的高低排序;

6、从所述节点分数表中选择指定比例的节点,在所述ast实例中标记与选择的节点对应的节点,被选择的节点的统计得分高于未被选择的节点的统计得分;

7、在与所述模板绑定的数据发生变化之后,通过与被标记的节点对应的新虚拟dom中虚拟节点直接更新真实dom中相应真实节点。

8、具体的,该方法还包括:

9、在与所述模板绑定的数据发生变化之后,将所述新虚拟dom中虚拟节点与旧虚拟dom中虚拟节点进行协调,选择地更新所述真实dom中相应真实节点,其中,

10、进行协调的虚拟节点包括所述新虚拟dom和所述旧虚拟dom两者中与所述未被选择的节点对应的虚拟节点。

11、具体的,该方法还包括:

12、在所述ast实例中标记静态节点。

13、具体的,在协调过程中,忽略所述两者中与被标记的节点对应的虚拟节点。

14、具体的,所述对所述ast实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分,包括:

15、递归遍历所述ast实例中的节点,若确定该节点的表达式是赋值表达式且确定该赋值表达式的变量与所述模板绑定,则记录并统计该节点的变量出现次数。

16、具体的,所述对所述ast实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分,还包括:

17、根据与该节点绑定的原生dom事件的属性,分配与该节点对应的权重值;

18、将该节点的变量出现次数和所述权重值的乘积结果作为该节点的统计得分。

19、具体的,该方法还包括:

20、在协调之后,在所述节点分数表中确定与差异节点对应的节点标识符,对应该节点标识符记录与该节点标识符对应的节点的修改次数,并基于该修改次数,调整与该节点标识符对应的统计分数。

21、本专利技术实施例提供一种渲染页面的系统,该系统包括:

22、解析模块,用于解析模板,生成ast实例;

23、统计模块,用于对所述ast实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分;

24、记录模块,用于将各节点的标识符记录至节点分数表,各节点在所述节点分数表中被按照统计得分的高低排序;

25、标记模块,用于从所述节点分数表中选择指定比例的节点,在所述ast实例中标记与选择的节点对应的节点,被选择的节点的统计得分高于未被选择的节点的统计得分;

26、渲染模块,用于在与所述模板绑定的数据发生变化之后,通过与被标记的节点对应的新虚拟dom中虚拟节点直接更新真实dom中相应真实节点。

27、再一方面,本专利技术实施例提供一种电子设备,该电子设备包括:

28、至少一个处理器;

29、存储器,与所述至少一个处理器连接;

30、其中,所述存储器存储有能被所述至少一个处理器执行的指令,所述至少一个处理器通过执行所述存储器存储的指令,所述至少一个处理器通过执行所述存储器存储的指令实现前述的方法。

31、又一方面,本专利技术实施例提供一种机器可读存储介质,存储有机器指令,当所述机器指令在机器上运行时,使得机器执行前述的方法。

32、本专利技术中通过模板生成的ast(abstract yntax tree,抽象语法树,记ast)实例,标记出有表达式的节点,以分数表中的排序将容易变化的节点直接绑定真实dom,从而增加了容易变化的节点在已占用的系统资源中的节点的比例,突破了同等内存空间占用条件下的系统响应渲染时间限制,改善了渲染的时间复杂度。

33、本专利技术实施例的其它特征和优点将在随后的具体实施方式部分予以详细说明。

本文档来自技高网...

【技术保护点】

1.一种机器渲染页面的方法,其特征在于,该方法包括:

2.根据权利要求1所述的机器渲染页面的方法,其特征在于,该方法还包括:

3.根据权利要求2所述的机器渲染页面的方法,其特征在于,该方法还包括:

4.根据权利要求3所述的机器渲染页面的方法,其特征在于,在协调过程中,忽略所述两者中与被标记的节点对应的虚拟节点。

5.根据权利要求1所述的机器渲染页面的方法,其特征在于,所述对所述AST实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分,包括:

6.根据权利要求5所述的机器渲染页面的方法,其特征在于,所述对所述AST实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分,还包括:

7.根据权利要求1所述的机器渲染页面的方法,其特征在于,该方法还包括:

8.一种渲染页面的系统,其特征在于,该系统包括:

9.一种电子设备,其特征在于,该电子设备包括:

10.一种机器可读存储介质,存储有机器指令,当所述机器指令在机器上运行时,使得机器执行权利要求1至7中任意一项权利要求所述的方法。

...

【技术特征摘要】

1.一种机器渲染页面的方法,其特征在于,该方法包括:

2.根据权利要求1所述的机器渲染页面的方法,其特征在于,该方法还包括:

3.根据权利要求2所述的机器渲染页面的方法,其特征在于,该方法还包括:

4.根据权利要求3所述的机器渲染页面的方法,其特征在于,在协调过程中,忽略所述两者中与被标记的节点对应的虚拟节点。

5.根据权利要求1所述的机器渲染页面的方法,其特征在于,所述对所述ast实例中具有指定表达式的节点进行变量出现次数统计,确定各节点的统计得分,包括:<...

【专利技术属性】
技术研发人员:刘佩智
申请(专利权)人:北京国双科技有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1