页面的预渲染方法、装置及电子设备制造方法及图纸

本发明专利技术提供了一种页面的预渲染方法、装置及电子设备，涉及计算机应用的技术领域，该方法包括：获取客户端的目标页面的组件列表；基于组件列表对目标页面进行预渲染，得到每个组件的属性文件；以及，提取每个组件的目标函数，执行目标函数，以将每个组件的属性文件存储到组件对应的数据仓库，使客户端能够基于数据仓库中的属性文件对目标页面进行渲染。本发明专利技术提供的页面的预渲染方法、装置及电子设备，能够使客户端能够基于数据仓库中的属性文件对目标页面进行渲染，以使客户端在渲染目标页面时能够保证首屏有内容进行显示，进而提高了渲染速度，极大地缩短了首页白屏时间，有效提升了用户的体验度。用户的体验度。用户的体验度。

【技术实现步骤摘要】
页面的预渲染方法、装置及电子设备


[0001]本专利技术涉及计算机应用的
，尤其是涉及一种页面的预渲染方法、装置及电子设备。

技术介绍

[0002]微前端是一种类似微服务的架构，微前端可以将微服务的理念应用于浏览器端，即将Web应用由单一的单体应用转变为多个小型前端微组件聚合为一的应用，目前市面上微组件绝大部分只实现了在客户端渲染，因页面初始化和加载的页面组件为并行执行关系，难以做到在服务端的预渲染，并且，客户端在渲染时，需要依赖服务器返回的数据，而服务器返回数据也需要一定的时间，就会导致在客户端渲染页面时由于拿不到服务器返回的数据而显示页面的首屏为白屏，降低了用户的体验度。

技术实现思路

[0003]有鉴于此，本专利技术的目的在于提供一种页面的预渲染方法、装置及电子设备，以缓解上述技术问题。
[0004]第一方面，本专利技术实施例提供了一种页面的预渲染方法，应用于服务端，所述方法包括：获取客户端的目标页面的组件列表，其中，所述组件列表包括所述目标页面的所有组件，以及每个所述组件的排列顺序和嵌套关系，且，每个所述组本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种页面的预渲染方法，其特征在于，应用于服务端，所述方法包括：获取客户端的目标页面的组件列表，其中，所述组件列表包括所述目标页面的所有组件，以及每个所述组件的排列顺序和嵌套关系，且，每个所述组件预先定义有目标函数，所述目标函数用于提供所述组件的调用接口供所述服务端调用，以及，接收所述服务端传入的属性文件；基于所述组件列表对所述目标页面进行预渲染，得到每个所述组件的属性文件；以及，提取每个所述组件的所述目标函数，执行所述目标函数，以将每个所述组件的属性文件存储到所述组件对应的数据仓库，使客户端能够基于所述数据仓库中的所述属性文件对所述目标页面进行渲染。2.根据权利要求1所述的方法，其特征在于，所述目标函数为asyncData()函数，所述目标函数通过promise对象供所述服务端调用。3.根据权利要求2所述的方法，其特征在于，提取每个所述组件的所述目标函数，执行所述目标函数，以将每个所述组件的属性文件存储到所述组件对应的数据仓库的步骤，包括：提取所述组件列表包括的每个所述组件的排列顺序和嵌套关系；根据所述排列顺序和嵌套关系执行所述目标函数返回的promise对象，以获取每个所述组件的所述属性文件；将所述属性文件存储到所述组件的对应的数据仓库。4.根据权利要求1所述的方法，其特征在于，获取客户端的目标页面的组件列表的步骤，包括：响应所述客户端发送的目标页面加载请求，基于所述目标页面加载请求获取所述目标页面的组件列表；或者，按照预设的时间间隔获取所述客户端的目标页面的组件列表。5.一种页面的预渲染方法，其特征在于，应用于客户端，所述方法包括：响应目标页面的加载请求，从数据仓库中调用所述目标页面的组件列表中每个组件的属性文件；基于所述属性文件对所述目标页面进行渲染。6...

【专利技术属性】
技术研发人员：吴景致，
申请(专利权)人：平安银行股份有限公司，
类型：发明
国别省市：