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

组件渲染方法、电子设备及存储介质技术

技术编号:40872846 阅读:2 留言:0更新日期:2024-04-08 16:40
本申请一种组件渲染方法、电子设备及存储介质,组件渲染方法包括:响应所述客户端加载目标页面的请求,确定所述目标页面对应的多个页面组件;确定每个页面组件对应的自定义指令,并根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板;组合所述参数信息与所述参数模板,得到所述每个页面组件对应的待渲染信息;根据多个待渲染信息生成文档对象模型Dom结构树;将所述Dom结构树输出至所述客户端,由所述客户端渲染所述多个页面组件。上述方法能够提高页面加载效率。

【技术实现步骤摘要】

本申请属于计算机,尤其涉及一种组件渲染方法、电子设备及存储介质


技术介绍

1、目前,随着互联网应用的普及,互联网应用成为人们生活中的必需品,当人们在使用互联网应用时,往往需要利用应用页面进行交互,在用户交互场景下,应用的页面通常包含用于展示状态或变更状态的组件,以供用户输入并相应地执行对应的操作。

2、然而,相关技术中,每加载一个应用页面,都会产生较多网络请求,因此,应用页面的资源加载缓慢,导致应用页面加载过程中白屏时间太长。


技术实现思路

1、本申请实施例提供了一种组件渲染方法、电子设备及存储介质,以解决页面加载效率低下的问题。

2、本申请实施例第一方面提供一种组件渲染方法,应用于电子设备,所述电子设备与客户端通信连接,所述组件渲染方法包括:响应所述客户端加载目标页面的请求,确定所述目标页面对应的多个页面组件;确定每个页面组件对应的自定义指令,并根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板;组合所述参数信息与所述参数模板,得到所述每个页面组件对应的待渲染信息;根据多个待渲染信息生成文档对象模型dom结构树;将所述dom结构树输出至所述客户端,由所述客户端渲染所述多个页面组件。

3、进一步地,在本申请实施例提供的上述组件渲染方法中,在所述根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板之前,所述方法还包括:确定每个页面组件对应的读取频率与写入频率;选取目标页面组件,所述目标页面组件的读取频率高于预设读取频率阈值,且所述目标页面组件的写入频率低于所述预设写入频率阈值;若第二预设数据库中存在所述目标页面组件对应的组件标识,则根据所述自定义指令从第二预设数据库中确定所述目标页面组件对应的目标参数信息与目标模板信息;若所述第二预设数据库中未存在所述目标页面组件对应的组件标识,则根据所述自定义指令从第一预设数据库中确定所述目标页面组件对应的目标参数信息与目标模板信息。

4、进一步地,在本申请实施例提供的上述组件渲染方法中,所述确定每个页面组件对应的自定义指令,并根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板,包括:根据预先设置的页面组件与自定义指令的第一对应关系,确定每个所述页面组件对应的自定义指令;解析所述自定义指令,得到每个所述页面组件对应的参数标识;获取预先设置的参数标识相对参数信息以及参数模板的第二关系,并将所述页面组件对应的参数标识与所述第二对应关系进行比对,确定每个所述页面组件对应的参数信息与参数模板。

5、进一步地,在本申请实施例提供的上述组件渲染方法中,所述组合所述参数信息与所述参数模板,得到所述每个页面组件对应的待渲染信息,包括:确定所述参数模板中的可编辑部分;填充所述参数信息至所述可编辑部分,得到所述待渲染信息。

6、进一步地,在本申请实施例提供的上述组件渲染方法中,所述填充所述参数信息至所述可编辑部分,得到所述目标参数信息,包括:确定所述可编辑部分对应的参数标识;获取预先设置的参数标识与参数信息的第三对应关系,并将所述参数信息与所述第三对应关系进行比对,将所述参数信息填充至所述参数标识对应的位置,得到所述待渲染信息。

7、进一步地,在本申请实施例提供的上述组件渲染方法中,所述根据多个所述待渲染信息生成dom结构树,包括:解析所述待渲染信息,得到所述多个页面组件间的层级信息与属性信息;根据所述层级信息与属性信息构建所述待渲染信息对应的所述dom结构树。

8、进一步地,在本申请实施例提供的上述组件渲染方法中,在所述确定所述目标页面对应的多个页面组件之后,所述方法还包括:确定页面组件的组件数量;根据所述组件数量构建预设数量的线程;根据预设的调度策略调用所述线程确定所述页面组件对应的所述待渲染信息。

9、进一步地,在本申请实施例提供的上述组件渲染方法中,若所述第二预设数据库中未存在所述目标页面组件对应的组件标识,所述方法还包括:根据所述第一预设数据库中的所述目标参数信息与所述目标参数模板,生成所述目标页面组件对应的目标待渲染信息;存储所述目标待渲染信息至所述第二预设数据库中。

10、本申请实施例第二方面还提供一种组件渲染装置,应用于电子设备,所述电子设备与客户端通信连接,所述组件渲染装置包括:页面组件确定模块,用于响应所述客户端加载目标页面的请求,确定所述目标页面对应的多个页面组件;自定义指令确定模块,用于确定每个页面组件对应的自定义指令,并根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板;渲染信息确定模块,用于组合所述参数信息与所述参数模板,得到所述每个页面组件对应的待渲染信息;dom结构树生成模块,用于根据多个待渲染信息生成文档对象模型dom结构树;页面组件渲染模块,用于将所述dom结构树输出至所述客户端,由所述客户端渲染所述多个页面组件。

11、本申请实施例第三方面还提供一种电子设备,所述电子设备包括控制器与存储器,所述控制器用于执行所述存储器中存储的计算机程序时实现上述任意一项所述的组件渲染方法。

12、本申请实施例第四方面还提供一种计算机可读存储介质,计算机可读存储介质上存储有计算机程序,计算机程序被控制器执行时实现上述任意一项所述的组件渲染方法。

13、本申请实施例提供的组件渲染方法,响应所述客户端加载目标页面的请求,确定所述目标页面对应的多个页面组件;确定每个页面组件对应的自定义指令,并根据自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板;组合参数信息与参数模板,得到每个页面组件对应的待渲染信息;根据多个所述待渲染信息生成dom结构树;将所述dom结构树输出至所述客户端,由所述客户端渲染所述多个页面组件。上述方法通过在电子设备端生成页面组件的dom结构树,并将dom结构树输出至客户端,由所述客户端直接渲染所述多个页面组件,减少客户端的反应时间,且客户端中页面组件的渲染不会相互影响,提高组件的渲染效率,从而提高页面的加载效率。

本文档来自技高网...

【技术保护点】

1.一种组件渲染方法,应用于电子设备,其特征在于,所述电子设备与客户端通信连接,所述组件渲染方法包括:

2.如权利要求1所述的组件渲染方法,其特征在于,在所述根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板之前,所述组件渲染方法还包括:

3.如权利要求1所述的组件渲染方法,其特征在于,所述确定每个页面组件对应的自定义指令,并根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板,包括:

4.如权利要求1所述的组件渲染方法,其特征在于,所述组合所述参数信息与所述参数模板,得到所述每个页面组件对应的待渲染信息,包括:

5.如权利要求4所述的组件渲染方法,其特征在于,所述填充所述参数信息至所述可编辑部分,得到所述待渲染信息,包括:

6.如权利要求1所述的组件渲染方法,其特征在于,所述根据多个所述待渲染信息生成Dom结构树,包括:

7.如权利要求6所述的组件渲染方法,其特征在于,在所述确定所述目标页面对应的多个页面组件之后,所述组件渲染方法还包括:

8.如权利要求2所述的组件渲染方法,其特征在于,若所述第二预设数据库中未存在所述目标页面组件对应的组件标识,所述组件渲染方法还包括:

9.一种电子设备,其特征在于,所述电子设备包括控制器与存储器,所述控制器用于执行所述存储器中存储的计算机程序时实现如权利要求1至8中任意一项所述的组件渲染方法。

10.一种计算机可读存储介质,其特征在于,计算机可读存储介质上存储有计算机程序,计算机程序被控制器执行时实现如权利要求1至8中任意一项所述的组件渲染方法。

...

【技术特征摘要】

1.一种组件渲染方法,应用于电子设备,其特征在于,所述电子设备与客户端通信连接,所述组件渲染方法包括:

2.如权利要求1所述的组件渲染方法,其特征在于,在所述根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板之前,所述组件渲染方法还包括:

3.如权利要求1所述的组件渲染方法,其特征在于,所述确定每个页面组件对应的自定义指令,并根据所述自定义指令从第一预设数据库中确定每个页面组件对应的参数信息与参数模板,包括:

4.如权利要求1所述的组件渲染方法,其特征在于,所述组合所述参数信息与所述参数模板,得到所述每个页面组件对应的待渲染信息,包括:

5.如权利要求4所述的组件渲染方法,其特征在于,所述填充所述参数信息至所述可编辑部分,得到所述待渲染信息,包括:<...

【专利技术属性】
技术研发人员:单寒宇张纪静祁文幻卢静好孙迎辉
申请(专利权)人:富联精密电子郑州有限公司
类型:发明
国别省市:

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

1