实现快速定位和差量渲染更新的新型diff算法制造技术

技术编号:33432984 阅读:32 留言:0更新日期:2022-05-19 00:22
本发明专利技术属于计算机操作系统和软件开发技术领域,尤其涉及一种针对前端框架视图层实现快速定位和差量渲染更新的新型diff算法及其用途。本diff算法通过给解析渲染的文本内容中的所有文本节点和该文本节点经渲染后生成的能够被浏览器识别的对应的整体标签添加一个相同的唯一标识,当所述文本节点或标签发生更改时,利用该唯一标识快速定位需要差量渲染更新的对应标签或对应文本节点,并对其进行差量渲染更新进而生成新的视图界面。本diff算法可快速定位需要进行差量渲染更新的文本节点或标签,相比现有diff算法计算量大大减少,避免了大量的内存占用,定位和渲染更新效率得到了很大提升。很大提升。很大提升。

【技术实现步骤摘要】
实现快速定位和差量渲染更新的新型diff算法


[0001]本专利技术属于计算机操作系统和软件开发
,尤其涉及一种针对前端框架视图层实现快速定位和差量渲染更新的新型diff算法及其用途。

技术介绍

[0002]通常,在对文档对象模型(Document Object Model,简称DOM,是W3C组织推荐的处理可扩展置标语言的标准编程接口,是网页的结构部分,当网页被加载时,DOM就是由文本内容渲染出的真实画面的源代码,DOM的结构为倒置的树结构,有且仅有一个树顶点)进行渲染操作过程中,用户大多会遇到这样一个问题,即有时候我们修改了某个数据,如果直接渲染到真实DOM上会引起整个DOM树的重绘和重排,导致渲染的时间、人力和计算成本都大幅增加。
[0003]diff算法的出现为解决上述问题提供了可能,diff算法采取比较新旧节点的方法,仅更新用户修改的那一小块DOM而非更新整个DOM,从而不会引起整个DOM树的重绘和重排。然而,当前主流diff算法均是通过递归遍历对比新旧文本或所有节点元素进行差量渲染,在运行过程中,出于维护堆栈结构和性能本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种实现快速定位和差量渲染更新的新型diff算法,其特征在于,所述diff算法通过给解析渲染的文本内容中的所有文本节点和该文本节点经渲染后生成的能够被浏览器识别的对应的整体标签添加一个相同的唯一标识,当所述文本节点或标签发生更改时,利用该唯一标识快速定位需要差量渲染更新的对应标签或对应文本节点,并对其进行差量渲染更新进而生成新的视图界面。2.根据权利要求1所述的实现快速定位和差量渲染更新的新型diff算法,其特征在于,所述diff算法包括下述步骤:(1)获取需要解析渲染的文本内容;(2)遍历(1)步获取到的文本内容;(3)将(2)步中每个遍历的文本节点渲染成浏览器能够识别的标签;(4)给(2)步中每个遍历的文本节点和该文本节点经(3)步渲染后生成的对应的整体标签添加一个唯一标识;(5)更改文本节点或标签;(6)通过唯一标识直接定位与(5)步所更改的文本节点或标签相对应的标签或文本节点;(7)对(6)步定位获得的标签或文本节点进行差量渲染更新。3.根据权利要求2所述的实现快速定位和差量渲染更新的新型diff算法,其特征在于,步骤(1)中所述的文本内容由具体使用的前端框架语言来确定,在vue框架语言中获取template部分,在react框架...

【专利技术属性】
技术研发人员:牟清宇王磊徐凌
申请(专利权)人:赞同科技股份有限公司
类型:发明
国别省市:

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

1