一种页面渲染方法、装置及终端制造方法及图纸

本发明专利技术提供了一种页面渲染方法、装置及终端，所述方法包括获取模板文件和目标数据填充文件，所述模板文件用于描述网页布局，所述目标数据填充文件用于描述在所述网页布局下的待显示的网页内容；根据所述模板文件和目标数据填充文件生成页面描述文件；基于所述页面描述文件渲染页面。本发明专利技术通过使用模板文件和目标数据填充文件描述页面元素，从而完成产品页面的在线热更新，满足了动态性的要求。通过自定义页面布局，再使用多进程渲染页面元素，脱离了现有技术中渲染只能够均集中在主线程的限制，提升了渲染效率。通过建立复用池，实现界面元素的回收和复用，从而进一步提升渲染速度。

【技术实现步骤摘要】
一种页面渲染方法、装置及终端
本专利技术涉及计算机领域，尤其涉及一种页面渲染方法、装置及终端。
技术介绍
现有技术中通常使用Storyboard、ReactNative和ComponentKit等工具进行页面渲染，下面分别进行介绍：Storyboard是苹果公司研发的IDE工具Xcode中集成的功能，是可视化的界面编辑工具，同时底层使用XML描述。具有所见即所得的优点，缺点是动态性和渲染性能比较差。ReactNative是Facebook主导的开源组件，优点是跨平台、动态性比较强、界面的表达能力也比较强，缺点是渲染性能比较差。ComponentKit也是Facebook主导的开源组件，是一个基于描述的界面排版渲染组件，渲染性能较好，缺点则是动态性比较差，开发效率也比较低。可见，现有技术中缺乏能够同时满足动态性、渲染性能和开发效率三方面要求的用于进行页面渲染的技术方案。
技术实现思路
为了解决上述技术问题，本专利技术提出了一种页面渲染方法、装置及终端。本专利技术具体是以如下技术方案实现的：第一方面，一种页面渲染方法，包括：获取模板文件和目标数据填充文件，所述模板文件用于描述网页布局，所述目标数据填充文件用于描述在所述网页布局下的待显示的网页内容；根据所述模板文件和目标数据填充文件生成页面描述文件；基于所述页面描述文件渲染页面。第二方面，一种页面渲染装置，包括：文件获取模块，用于获取模板文件和目标数据填充文件，所述模板文件用于描述网页布局，所述目标数据填充文件用于描述在所述网页布局下的待显示的网页内容；页面描述文件生成模块，用于根据所述模板文件和目标数据填充文件生成页面描述文件；渲染模块，用于基于所述页面描述文件渲染页面。第三方面，一种计算机可读存储介质，用于存储程序，所述程序用于实现所述页面渲染方法。第四方面，一种终端，所述终端用于运行所述页面渲染装置。本专利技术提供了一种页面渲染方法、装置及终端，具备下述有益效果：本专利技术通过使用模板文件和目标数据填充文件描述页面元素，从而完成产品页面的在线热更新，满足了动态性的要求。通过自定义页面布局，再使用多进程渲染页面元素，脱离了现有技术中渲染只能够均集中在主线程的限制，提升了渲染效率。通过建立复用池，实现界面元素的回收和复用，从而进一步提升渲染速度。本专利技术只通过修改模板文件和目标数据填充文件即可实现新的页面的研发，显然具备较好的开发效率。附图说明为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其它附图。图1是本专利技术实施例提供的一种页面渲染方法流程图；图2是本专利技术实施例提供的JSON模板文件示意图；图3是本专利技术实施例提供的目标数据填充文件示意图；图4是本专利技术实施例提供的页面描述文件示意图；图5是本专利技术实施例提供的一种基于多线程的页面渲染方法流程图；图6是本专利技术实施例提供的虚拟界面示意图；图7是本专利技术实施例提供的真实界面示意图；图8是本专利技术实施例提供的页面渲染逻辑示意图；图9是本专利技术实施例提供的视图树示意图；图10是本专利技术实施例提供的第一幅渲染页面示意图；图11是本专利技术实施例提供的第二幅渲染页面示意图；图12是本专利技术实施例提供的第三幅渲染页面示意图；图13是本专利技术实施例提供的一种页面渲染装置框图；图14是本专利技术实施例提供的渲染模块框图；图15是本专利技术实施例提供的终端示意图。具体实施方式为了使本
的人员更好地理解本专利技术方案，下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分的实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本专利技术保护的范围。需要说明的是，本专利技术的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本专利技术的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。在进行页面渲染时，可以从动态性、渲染性能和开发效率三方面对现有技术中的页面渲染方案进行评价。其中，动态性是指能够通过后台下发，动态执行的特性，这种特性能够降低终端发布版本的人力成本和时间成本，用户也可以很快获取到最新的版本的服务，是移动互联网时代比较重要的特性；渲染性能是指在界面的渲染流程中，能够实现界面快速渲染，提升界面流畅度从而提升用户体验的能力；开发效率是指开发速度，只有开发效率高才能应对日新月异的需求。为了能够同时满足动态性、渲染性能和开发效率三方面的要求，本专利技术实施例提供一种页面渲染方法，如图1所示，包括：S101.获取模板文件和目标数据填充文件，所述模板文件用于描述网页布局，所述目标数据填充文件用于描述在所述网页布局下的待显示的网页内容。具体地，模板文件和数据填充文件均可以有一个或多个。一个模板文件可以对应一个或多个数据填充文件。与模板文件对应的数据填充文件也可以被称为目标数据填充文件。具体地，所述网页布局包括网页控件的排列方式、类型、形状和位置信息；所述目标数据填充文件被用于向网页布局中填入具体内容；在模板文件相同的场景下，通过变换不同的目标数据填充文件能够得到不同的网页内容。在本专利技术实施例中模板文件通过JSON文件描述，数据填充文件通过JavaScript文件描述。JavaScript是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，JavaScript文件可以被浏览器引擎解释执行。在JavaScrip语言中，一切都是对象，任何支持的类型都可以通过JSON来表示，例如字符串、数字、对象、数组等。JSON是JavaScrip对象的字符串表示法，它使用文本表示一个JavaScrip对象的信息。JSON可以将JavaScript对象中表示的一组数据转换为字符串，然后就可以在网络或者程序之间轻松地传递这个字符串，并在需要的时候将它还原为各编程语言所支持的数据格式。在本专利技术一种可行的实施方式中，在JSON模板文件中通过对象来描述网页布局。具体地，如图2所示，对象表示为键值对，对象中的数据由逗号分隔，使用花括号保存对象。在JSON模板文件中键描述网页布局类型，值描述网页布局类型对应的取值。所述网页布局类型包括但不限于大小、颜色、字体、字号、标题和待匹配项。在JavaScript数据填充文件中通过对象来描述网页内容。如图3所示，其示出了图2中模板文件对应的目标数据填充文件，对象表示为键值对，键描述待匹配项，值描述待匹配项的值。S103.根据所述模板文件和目标数据填充文件生成页面描述文件。根据图2-3所示可知，模板文件和目标数据填充文件以待匹配项作为桥梁，通过用目标数据填充文件中待匹配项的本文档来自技高网...

【技术保护点】
1.一种页面渲染方法，其特征在于，包括：获取模板文件和目标数据填充文件，所述模板文件用于描述网页布局，所述目标数据填充文件用于描述在所述网页布局下的待显示的网页内容；根据所述模板文件和目标数据填充文件生成页面描述文件；基于所述页面描述文件渲染页面。

【技术特征摘要】
1.一种页面渲染方法，其特征在于，包括：获取模板文件和目标数据填充文件，所述模板文件用于描述网页布局，所述目标数据填充文件用于描述在所述网页布局下的待显示的网页内容；根据所述模板文件和目标数据填充文件生成页面描述文件；基于所述页面描述文件渲染页面。2.根据权利要求1所述的方法，其特征在于：所述网页布局包括网页控件的排列方式、类型、形状和位置信息；所述目标数据填充文件被用于向网页布局中填入具体内容；在模板文件相同的场景下，通过变换不同的目标数据填充文件得到不同的网页内容。3.根据权利要求1所述的方法，其特征在于：模板文件通过JSON文件描述，目标数据填充文件通过JavaScript文件描述。4.根据权利要求3所述的方法，其特征在于：在模板文件中，键描述网页布局类型，值描述网页布局类型对应的取值；所述网页布局类型包括待匹配项；在目标数据填充文件中，键描述待匹配项，值描述待匹配项的值；通过用目标数据填充文件中待匹配项的值替换模板文件中的待匹配项的值得到页面描述文件。5.根据权利要求1所述的方法，其特征在于，所述基于所述页面描述文件渲染页面包括：开启第一线程，所述第一线程用于基于所述页面描述文件渲染虚拟界面；基于所述页面描述文件渲染真实的界面控件，并根据所述真实的界面控件和所述虚拟界面生成真实界面。6.根据权利要求5所述的方法，其特征在于，所述虚拟界面与网页布局一一对应，所述虚拟...

【专利技术属性】
技术研发人员：林伟勋，冯绪，
申请(专利权)人：腾讯科技深圳有限公司，
类型：发明
国别省市：广东,44