[发明专利]一种Web浏览器下的大数据量树形结构渲染系统及方法

权利要求书

1.一种Web浏览器下的大数据量树形结构渲染方法，其特征在于，该方法基于一种Web浏览器下的大数据量树形结构渲染系统，系统包括相互连接的客户端和服务端；

所述客户端包括渲染模块、数据模块、缓存模块和中央处理模块，所述中央处理模块分别与所述渲染模块、数据模块和缓存模块连接；所述服务端设置有服务端系统；所述服务端系统与所述数据模块连接；

所述数据模块用于发送http请求，还用于将获取服务端的数据处理成所需数据格式的数据；所述缓存模块用于生成缓存数据；所述中央处理模块用于获取数据模块的真实数据和缓存模块的缓存数据，调用比对算法获取比对结果，根据比对结果的差异化数据构建虚拟DOM树数据；所述渲染模块用于接收虚拟DOM树数据，构建真实DOM树结构；所述服务端系统用于传输客户端所需数据；

所述渲染模块包括相互连接的面包屑组件和分页表格组件；所述面包屑组件用于构建真实DOM树结构，所述分页表格组件用于进行分页查询虚拟DOM树数据生成分页表格；

方法包括以下步骤：

S1、通过数据模块调用服务端系统接口获取服务端系统数据，得到真实数据；

S2、通过中央处理模块获取真实数据和缓存模块的缓存数据，调用比对算法获取比对结果构建虚拟DOM树数据；

S3、根据虚拟DOM树数据调用渲染模块构建真实DOM树结构，完成渲染Web浏览器界面；

所述步骤S2中，缓存模块生成缓存数据的方法具体为：

当数据模块发送真实数据时，控制缓存模块通过indexedDB数据库获取所述真实数据，并根据所述真实数据更新当前的缓存数据，生成新的缓存数据；

所述步骤S2包括以下分步骤：

S21、通过中央处理模块调用缓存模块获取缓存数据，再调用数据模块获取真实数据；

S22、基于缓存数据和真实数据，通过比较方法得到比较一致结果或差异化数据；

S23、当比较方法得到差异化数据时，根据差异化数据构建虚拟DOM树数据；

所述步骤S22具体为：

将缓存数据和真实数据通过Unicode编码生成字符串数组格式的缓存数据和字符串数组格式的真实数据，并建立字符串数组格式的差异化数据；所述比较方法具体为：

查询字符串数组格式的真实数据中的每条字符串数据是否存在字符串数组格式的缓存数据中；若否，则将所述字符串数据保存至差异化数据，并其保存上一条字符串数据的主键ID；若是，则得到所述字符串数据的比较一致结果。

2.根据权利要求1所述的Web浏览器下的大数据量树形结构渲染方法，其特征在于，所述步骤S23具体为：

当比较方法得到差异化数据时，将其上一条主键ID插入所述缓存数据中的指定数据后，得到更新的缓存数据，根据更新的缓存数据构建虚拟DOM树数据。

3.根据权利要求2所述的Web浏览器下的大数据量树形结构渲染方法，其特征在于，所述步骤S3包括以下分步骤：

S31、基于输入渲染模块的虚拟DOM树数据，通过分页表格组件进行分页查询得到分页表格；

S32、根据分页表格构建真实DOM树结构，并渲染Web浏览器界面。

4.根据权利要求3所述的Web浏览器下的大数据量树形结构渲染方法，其特征在于，所述步骤S32具体为：

将分页表格的行数据推送至面包屑组件，进而新增面包屑组件中的节点路径，根据面包屑组件中的节点路径构建真实DOM树结构，并渲染Web浏览器界面；

其中，新增面包屑组件中的节点路径的方法具体为：

根据分页表格组件的行数据查询面包屑组件中的父节点ID下的子节点ID，判断是否存在对应的子节点ID；

若是，则根据所述分页表格组件的行数据更新所述子节点ID数据；若否，则新增面包屑组件中的节点路径。