网页生成方法、装置、电子设备及存储介质与流程

1.本技术涉及互联网技术领域，具体涉及一种网页生成方法、装置、电子设备及存储介质。


背景技术：

2.目前在生成网页时，主要采用离线包方案提高网页生成速度，把各种静态资源提前打包并下载存储为离线包。这种方式在打开网页时，仍然花费大量时间处理离线包，从用户视角而言，生成网页的时间依旧很长，网页打开的速度慢。


技术实现要素：

3.本技术的一个目的在于提出一种网页生成方法、装置、电子设备及存储介质，旨在提高生成网页的速度。
4.根据本技术实施例的一方面，提供了一种网页生成方法，所述方法包括：
5.响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化所述进程池中网页视图组件的进程；
6.调用所述进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于所述离线资源数据，在缓存池中创建网页视图组件的共享实例；
7.从所述缓存池中取出所述共享实例，在所述共享实例中导入渲染所需的正文数据，并使用导入正文数据后的共享实例；
8.响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及所述动态资源数据，渲染生成目标网页。
9.根据本技术实施例的一方面，提供了一种网页生成装置，所述装置包括：
10.初始化模块，用于响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化所述进程池中网页视图组件的进程；
11.加载模块，用于调用所述进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于所述离线资源数据，在缓存池中创建网页视图组件的共享实例；
12.导入模块，用于从所述缓存池中取出所述共享实例，在所述共享实例中导入渲染所需的正文数据，得到导入正文数据后的共享实例；
13.网页生成模块，用于响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及所述动态资源数据，渲染生成目标网页。
14.在本技术的一些实施例中，基于以上技术方案，所述装置配置为：
15.将所述网页视图组件与所述客户端的原生组件进行同层渲染，生成所述目标网页。
16.在本技术的一些实施例中，基于以上技术方案，所述装置配置为：
17.响应于客户端的启动指令，获取所述客户端待打开的网页的数量；
18.根据所述网页的数量，计算网页视图组件的进程的数量；所述进程的数量大于所
述网页的数量；
19.按照所述进程的数量，在所述进程池中创建网页视图组件的进程。
20.在本技术的一些实施例中，基于以上技术方案，所述装置配置为：
21.响应于关闭所述目标网页的指令，销毁所述目标网页对应的网页视图组件的进程；
22.响应于打开新的网页的指令，重新从所述进程池中调用已初始化的进程，生成新的网页。
23.在本技术的一些实施例中，基于以上技术方案，所述装置配置为：
24.清空所述实例中的正文数据，并将清空所述正文数据后的实例重新添加至所述缓存池。
25.在本技术的一些实施例中，基于以上技术方案，所述装置配置为：
26.监测并拦截资源请求；
27.若所述共享缓存中不存在所述资源请求对应的离线资源数据，则从内容分发服务器下载所述缓存数据；
28.将所述缓存数据异步写入所述共享缓存。
29.在本技术的一些实施例中，基于以上技术方案，所述装置配置为：
30.响应于客户端的启动指令，检测所述离线资源数据是否需要更新；
31.若所述离线资源数据不需要更新，则调用所述进程池中的进程；
32.若所述离线资源数据需要更新，则从离线资源管理平台关联的内容分发服务器下载更新资源数据，根据更新资源数据对所述离线资源数据进行更新，并将更新后的所述离线资源数据添加至所述共享缓存中，并调用所述进程池中的进程。
33.根据本技术实施例的一方面，提供了一种电子设备，包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述电子设备实现上述各种可选实现方式中提供的方法。
34.根据本技术实施例的一方面，提供了一种计算机程序介质，其上存储有计算机可读指令，当所述计算机可读指令被计算机的处理器执行时，使计算机执行上述各种可选实现方式中提供的方法。
35.根据本技术实施例的一个方面，提供了一种计算机程序产品或计算机程序，该计算机程序产品或计算机程序包括计算机指令，该计算机指令存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机指令，处理器执行该计算机指令，使得该计算机设备执行上述各种可选实现方式中提供的方法。
36.在本技术提供的实施例中，通过响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化进程池中网页视图组件的进程，调用进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于离线资源数据，在缓存池中创建网页视图组件的共享实例，从缓存池中取出共享实例，在共享实例中导入渲染所需的正文数据，得到导入正文数据后的共享实例，响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及动态资源数据，渲染生成目标网页。从而能够在客户端启动后，且打开网页之间，就首先初始化进程池，并调用进程池中的进程，从本地内存的共享缓存中加载离线资源数据，在缓存池中创建网页视图组件的共享实例，从缓存池中取出共享实例，在共享实例中导
入渲染所需的正文数据，并得到导入正文数据后的共享实例，而在打开网页之后，则可以直接结合动态资源数据，进一步渲染生成目标网页。一方面，在打开网页之前，客户端就已经基于离线资源数据创建了网页视图组件的共享实例，并导入了正文数据，网页的基本内容已经预加载大部分，而在打开网页之后只需要结合动态资源数据进行渲染，省略了打开网页之后对离线包进行处理的过程，减少了打开网页之后的大量等待时间，另一方面，通过本地内存的共享缓存，实现了网页视图组件的实例之间的共享，持久化缓存各类离线资源数据，不需要重复进行本地文件的读写操作，提升了生成网页的性能，从而提高了生成网页的速度。
37.本技术的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本技术的实践而习得。
38.应当理解的是，以上的一般描述和后文的细节描述仅是示例性的，并不能限制本技术。
附图说明
39.通过参考附图详细描述其示例实施例，本技术的上述和其它目标、特征及优点将变得更加显而易见。
40.图1示出了根据本技术一个实施例的网页生成方法的流程示意图。
41.图2示出了根据本技术一个实施例中上传离线包至静态资源管理平台的方式的示意图。
42.图3示出了一个实施例中离线资源数据与客户端的版本的绑定关系示意图。
43.图4示出了根据本技术一个实施例的各类型资源与资源管理平台的关系示意图。
44.图5示出了根据本技术一个实施例中离线资源的下载和加载的示意图。
45.图6示出了根据本技术一个实施例的webview进程池与h5页面打开和关闭的关系示意图。
46.图7示出了根据本技术一个实施例的对webview进行复用的实现方式示意图。
47.图8示出了根据本技术一个实施例资源拦截的流程示意图。
48.图9示出了根据本技术一实施例的网页生成装置的结构示意图。
49.图10示出了根据本技术一个实施例的电子设备的结构示意图。
具体实施方式
50.现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些示例实施方式使得本技术的描述将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。附图仅为本技术的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。
51.此外，所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多示例实施方式中。在下面的描述中，提供许多具体细节从而给出对本技术的示例实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本技术的技术方案而省略特定细节中的一个或更多，或者可以采用其它的方法、组元、步骤等。在其它情况下，不详细示出或描述公
知结构、方法、实现或者操作以避免喧宾夺主而使得本技术的各方面变得模糊。
52.附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。
53.在当前的客户端app开发模式中，常采用hybird混合开发模式。在混合开发模式中，app内一部分页面以h5形式开发，另一部分页面通过原生代码开发。此方式能够最大效率利用开发资源，提升开发效率，但也随之带来了页面加载慢，app用户体验下降的问题。为了在一定程度上解决该问题，可以使用服务端渲染ssr、离线包等方式生成网页。
54.ssr方案的实现流程主要包括：浏览器发起请求时，请求会由原来的直接请求后端服务，改为先请求node服务，然后再由node服务请求后端，之后将后端服务返回的数据组装为一个html，然后将渲染好的html直接返回给浏览器，从而提升页面打开速度。对于服务端渲染方案，有以下缺点：与服务器端的数据通信容易直接受网络状态影响，在弱网情况下基本不可用；中间层node服务的状态也会直接影响到页面的打开速度，因为node服务需要请求对应业务后端获取数据然后进行html的组装，如果node服务出现问题或者处理速度不够快，就会影响到html的组装，降低网页的生成速度。
55.针对离线包方案，主要是将前端的项目资源以资源包的形式，分发、内置到app内，app在加载h5页面时通过webview的资源拦截策略，将h5发出的网络资源请求指向本地资源，从而达到减少网络请求消耗时间，提升页面加载速度的目的，由于app中存在大量功能页面是由h5实现的，从而h5的性能表现直接决定用户体验。
56.离线包方案具有以下缺点：会受到网络状态的影响，虽然js/css等资源已经内置到app内，但打开页面时仍需要向后端服务请求离线包服务，在弱网情况下表现也较差。webview拦截到资源请求后走的是本地文件i/o操作获取到的静态资源，在一些硬件配置比较低的电子设备机型上消耗时间稍长，降低页面打开速度。重复初始化webview浪费资源，对于app而言每次打开一个新的webview用于承载页面会消耗大量的性能，在不同配置的电子设备上需要40～700ms的时间，导致手机cpu、内存、能耗均有升高，不仅生成网页的速度慢，也会降低电子设备的使用体验。
57.综上，无论是服务端渲染还是离线包方案都存在如上的问题，所以亟需提供一种解决方案能够提升生成网页时的性能表现，提升生成网页的速度。
58.图1示出了根据本技术一个实施例的网页生成方法的流程示意图，该方法包括：
59.步骤s101：响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化进程池中网页视图组件的进程。
60.在本实施例中，执行主体为电子设备，电子设备比如智能手机、平板电脑等。客户端基于混合开发方式hybird构建，客户端包括原生程序以及网页。
61.在一实施例中，响应于客户端的启动指令，初始化网页视图组件的进程池，包括：响应于客户端的启动指令，获取客户端待打开的网页的数量；根据网页的数量，计算网页视图组件的进程的数量；进程的数量大于网页的数量；按照进程的数量，在进程池中创建网页视图组件的进程。采用此方式，能够使得进程池中包含多个已经初始化好的进程，在调用进程时，无需从头开始初始化，使得该客户端的每个网页都能够有进程得以调用，能够减少网
页视图组件webview初始化过程带来的时间消耗，提高响应速度，从而提高生成网页的速度。
62.在一实施例中，为了从本地内存的共享缓存中加载离线资源数据，需要在客户端打开后，从离线资源管理平台下载离线资源数据，离线资源数据包括配置型数据以及模板数据。
63.配置类型数据指的是数据量不大并且改动频次不多的数据，比如部分应用中的拍脸弹窗、运营活动配置数据等，可以将这部分数据静态化，作为配置文件通过内容分发服务器cdn分发到客户端内，客户端启动时进行下载和加载配置文件，从而达到减少打开网页之后频繁进行网络请求的目的。
64.模板类型数据也适用于静态化，模板类型数据例如一些相对固定的业务场景，比如年度报告等，其中的一些数据也是相对固定的，改动频次也不高，但由于数据量很大从而不适合采用配置型数据相同的方式获取，因此，这种数据可以提前预热生产放置到cdn内，这样在客户端需要获取这部分数据时，直接请求cdn获取，相对于直接请求api服务而言，节省了服务程序处理时间以及一部分网络传输时间，也能够提高网页生成速度。
65.在一实施例中，为了将配置文件等离线资源数据保存到服务器中，可以通过php配置页面改动配置文件，加载到服务器，发出改动的通知，同步配置文件，将配置文件拷贝到特定目录，计算文件的md5值后拷贝一份到cdn目录下，作为cdn源站，文件名字是md5值，重新加载所有配置，提供给客户端的预设接口使用，客户端通过预设接口下载配置文件等离线资源数据。
66.图2示出了根据本技术一个实施例中上传离线包至静态资源管理平台的方式的示意图，其中，离线资源数据可以打包成离线包，为了上传离线资源数据至资源管理平台，可以采用如下方式：使用webpack根据包更新策略，更新策略可以是增量更新或者全量更新，增量更新是只更新发生变化的部分，全量更新是更新全部内容；将前端h5项目构建打包生成zip包；校验判断zip包的完整性；使用webpack计算zip包的md5，并将文件名改为md5；根据package.json文件中的version生成对应的版本号；通过jenkins上传zip包至cdn；将离线包信息，例如cdn链接、版本、资源大小等信息发送至离线资源管理平台hermes serve平台。其中，离线资源管理平台保存cdn链接，而根据该cdn链接则可以从cdn下载离线包。采用此方式，可以便于后续结合离线资源管理平台的cdn链接，从cdn服务器快速地下载离线资源数据，进一步快速生成网页。
67.图3示出了一个实施例中离线资源数据与客户端的版本的绑定关系示意图。app版本包括app v1、app v2、app v3，h5页面的版本包括h5-1v1，h5-2 v2，h5-1 v2，h5-2 v2，app v1对应h5-1 v1和h5-2 v1，app v2对应h5-1 v1和h5-1 v2，app v3对应h5-1 v2和h5-2 v2。不同h5版本之间对应的离线资源数据可能不同，而不同客户版本之间对应的h5页面可能不同。在离线资源生产后，需要将离线资源与app进行绑定，因为根据业务的实际场景一个版本的app内是可能有多个版本的h5页面存在的，同时一个h5页面也是可以同时存在一个app的多个版本中，所以app与h5是多对多的关系。
68.在一实施例中，每个版本的客户端均可以对应一个或者多个版本的网页，每个版本的网页均可以对应一个或者多个版本客户端，从而不同版本的客户端与多个版本的网页之间可以实现互相兼容。
69.图4示出了根据本技术一个实施例的各类型资源与资源管理平台的关系示意图。其中，将资源分为三种类型与app进行关联，三种类型分别为项目类、活动类、转场类。项目类指的是指端内常驻的h5项目，承担app部分常用功能，例如社区、赛事等资源，同时其也包含部分关键页面的页面模板(html)。活动类指的是运营性质的活动，如投票、抽奖、问卷等活动，这部分业务的性质表现为独立，单次化。转场类指的是客户端由原生场景进入h5所需要的骨架屏、转场动画等。项目类和活动类的数据可以通过jenkins发送至hermes，转场类数据通过upload server上传到hermes。管理平台包括app v1～app vn多个版本，项目类、转场类以及活动类的数据分别与个版本的app进行关系绑定。
70.在一实施例中，初始化进程池中网页视图组件的进程之后，该方法还包括：响应于客户端的启动指令，检测离线资源数据是否需要更新；若离线资源数据不需要更新，则调用进程池中的进程；若离线资源数据需要更新，则从离线资源管理平台关联的内容分发服务器下载更新资源数据，根据更新资源数据对离线资源数据进行更新，并将更新后的离线资源数据添加至共享缓存中，并调用进程池中的进程。采用此方式，从而能够更新离线资源数据，保持离线资源数据最新，并且从离线资源管理平台关联的内容分发服务器下载更新资源数据，利用内容分发服务器cdn下载离线资源数据快的特性，提高了下载速度，进一步快速生成网页。
71.图5示出了根据本技术一个实施例中离线资源的下载和加载的示意图。在打开app之后，判断是否请求成功，如果没有请求成功，则app加载在线链接，如果请求成功，则判断是否存在新版本，如果不存在新版本，则判断是否存在本地缓存，如果存在本地缓存则app读取本地缓存，如果存在新版本，或者不存在本地缓存，则app下载离线包，判断下载及解压是否成功，如果没有成功，则app加载在线链接。如果成功，则app读取本地缓存。
72.其中，客户端app启动时初始化app sdk，请求离线资源管理平台hermes服务平台获取离线资源信息。如果请求失败，则直接访问提前内置好的h5在线资源链接。如果请求成功，通过hermes服务平台返回的数据判断是否需要更新，以及更新的方式为全量或者增量。如果通过接口的返回判断出不需要更新，则直接读取本地缓存。如果通过接口的返回判断出需要更新，则app去下载和解压离线资源。如果下载和解压离线资源失败，则直接访问提前内置好的h5在线资源链接。如果下载和解压离线资源成功，则删除原有旧的本地缓存，使用新的本地离线资源。采用此方式，使得离线资源数据保持更新，并且从离线资源管理平台获取离线资源信息，进一步从cdn下载离线资源数据的速度更快，有利于快速生成网页。
73.步骤s102：调用进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于离线资源数据，在缓存池中创建网页视图组件的共享实例。
74.图6示出了根据本技术一个实施例的webview进程池与h5页面打开和关闭的关系示意图。使用动态webview进程的预热能力加载h5页面的流程。在启动app后会提前初始化webview，并且会根据h5项目的数量初始好n+1个webview进程，保证每个h5项目都有webview承接，不会出现需要初始化新的webview进程的情况，减少webview初始化带来的时间消耗，提升页面打开速度。在此过程中，打开h5页面的时候，会从webview进程池里面调用webview加载url，并且在关闭h5页面的时候，会释放webview进程。采用此方式，提供网页的生成速度。
75.图7示出了根据本技术一个实施例的对webview进行复用的实现方式示意图。创建
webview之后，预热html，并加入缓存池，取出实例，并导入正文数据，在使用完毕后，清空正文数据，重入缓存池。其中，由于创建、销毁webview的性能消耗和时间成本，因此为了进一步降低性能消耗和时间成本，还可以对webview进行复用，并结合场景配以回收策略，最大化较少设备资源的使用，确保主场景的通畅。在缓存webview池的时候，虽然可以根据设备情况动态调整缓存数量，但是频繁创建和预热模板文件，也会带来一定性能开销，同时真正的资源回收和释放还依赖于系统回收机制，为了避免问题，因此可以通过复用缓存池中的实例，来减少性能开销。预热过程主要包括对于html的处理，css的执行等，目的在于提前生成模板文件。
76.步骤s103：从缓存池中取出共享实例，在共享实例中导入渲染所需的正文数据，得到导入正文数据后的共享实例。
77.在一实施例中，响应于网页的打开指令，获取动态资源数据之前，还包括：监测并拦截资源请求；若共享缓存中不存在资源请求对应的离线资源数据，则从内容分发服务器下载缓存数据；将缓存数据异步写入共享缓存。采用此方式，可以快速获取离线资源数据，提高生成网页速度。
78.在一实施例中，正文数据包括离线资源数据，比如图片视频等等。此外，正文数据还可以包括上下文数据。
79.图8示出了根据本技术一个实施例资源拦截的流程示意图。通过拦截资源请求，向interceptrequest通知拦截处理，从共享缓存中查询缓存，若存在所需的资源，返回webresourceresponse，返回webresourceresponse，并进一步进行后续的渲染过程；如果无相应缓存，则下载缓存，并返回带有输入信息inputstrem的webresourceresponse，通过下载器下载缓存，并异步写入缓存文件。
80.对于资源拦截，除了使用webview对于请求的拦截之外，也可以配置app的缓存策略，缓存策略由图片缓存和多实例缓存与内容共享组成。为了突破webview的最大缓存容量限制，并利用native的资源共享，优化图片类资源的缓存策略。
81.而对于多实例缓存与内容共享而言，h5页面的一些资源或数据缓存，可以利用webview自带的缓存机制。默认浏览器缓存机制，执行的是http缓存策略，会根据http协议(cache-control)来决定是否进行网络请求。dom storage缓存：采用持久性的localstorage进行缓存；app cache缓存：定义缓存路径、缓存大小；内容共享，为最大化利用系统资源，webview的页面加载以独立进程形式存在。android需要使用独立进程；ios wkwebview已是多进程模型，但contentprocess需要是同一个wkprocesspool，进行资源共享。
82.采用上述方式，通过图片缓存和多实例缓存与内容共享，能够提高资源加载速度，提高生成网页的速度。
83.步骤s104：响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及动态资源数据，渲染生成目标网页。
84.动态数据是相较于离线资源数据而言的，其不包含在离线资源数据内，动态数据主要是经常产生变化的不适合静态保存为离线资源数据的一部分数据。比如与使用者相关的数据、推荐数据、评论等，这类数据是无法作为离线数据分发的，需要在检测到打开网页的指令时，在线获取，并结合共享实例以及动态资源数据，渲染生成目标网页。
85.在一实施例中，渲染生成目标网页之后，展示该目标网页。
86.在一实施例中，当使用者打开某个app时，该app会自动检测可能需要生成的目标网页，并进行进程池的初始化，离线资源数据的加载，在缓存池中创建共享实例，并取出共享实例及导入正文数据，以完成webview的预热，在此过程中，使用者正在使用该app的原生界面，比如某个游戏类app，原生界面是游戏主画面，在使用者浏览和操作游戏主画面的过程中，该app就已经完成预热，得到导入正文数据的共享实例，此过程由于实例共享性能也较高，而在用户打开h5网页的时候，比如打开了年度报告的h5网页，该年度报告是总结使用者过去一段时间使用规律的h5网页，则可以获取动态数据，比如最近一段时间热衷游玩的游戏场景等资源数据，从而可以结合已经得到的导入正文数据的共享实例以及动态数据，来快速渲染生成最终的h5网页。该过程中，从使用者的角度而言，打开网页后很快就生成了h5网页，从而提高了网页生成速度。
87.在一实施例中，渲染生成目标网页之后，方法还包括：响应于关闭目标网页的指令，销毁目标网页对应的网页视图组件的进程；响应于打开新的网页的指令，重新从进程池中调用已初始化的进程，生成新的网页。采用此方式，不需要从头等待初始化网页视图组件的进程，可以快速生成新的网页。
88.在一实施例中，使用导入正文数据后的实例，渲染生成目标网页之后，方法还包括：清空实例中的正文数据，并将清空正文数据后的实例重新添加至缓存池。采用此方式，可以对实例进行复用，从而提高设备的性能，配以回收策略，最大化较少设备资源的使用，确保主场景的通畅，避免过分依赖系统回收机制，降低了性能开销，在提高网页生成速度的基础上，还使得系统性能维持比较高的水准。
89.在一实施例中，渲染生成目标网页的过程包括：将网页视图组件与客户端的原生组件进行同层渲染，生成目标网页。采用此方式，可以使用客户端的原生组件的强大渲染能力，快速渲染以生成目标网页。
90.在一实施例中，为了实现webview和原生组件的同层渲染，以ios举例，同层组件的目标是将原生组件渲染在与其他web组件同一层级中。在ios中，使用wkwebview来创建web视图，wkwebview在进行解析渲染时，会将web组件渲染到wkcompositingview上，这个view是一个原生的uiview子类，通常wkwebview内核会将多个组件共同渲染到同一个wkcompositingview上，但是如果某个html标签的style设置了overflow:scroll属性，并且内容超出容器的大小，wkwebview就会为其单独的创建一个wkchildscrollview，因此可以通过找到这个view，并和对应的web组件一一关联起来，以将原生的组件渲染到这个view中，从而实现同层渲染。
91.其中，为了实现同层渲染，可以通过定制完整的js与原生的交互命令协议，如组件插入，组件更新，组件删除，原生端的交互与更新行为等，基于该交互命令协议进行同层渲染。并且可以定义传递数据形式，例如要插入的组件类型，可能是视频，音频，地图等，各种组件在原生端的属性配置等映射，基于这种映射来进行同层渲染。原生端可以传创建一个容器池来维护被插入的同层组件，方便通过id寻找来进行更新等。对于某些无法针对同层组件生效的css属性，也可以通过js传递数据到原生端处理。采用上述方式，可以利用原生的强大能力，例如音视频播放，地图功能等，提高渲染速度，避免所有的元素和组件都是渲染在webview内部，从而避免由此导致的渲染速度慢而网页生成慢的问题。
92.采用上述方式，一方面，相较于此前的离线包加载方式，避免了生成页面之前所经历无反馈、白屏和加载三个阶段导致生成网页速度慢的情况，具体而言，避免了此前的离线包加载方式中，在打开页面之后，进行初始化的无反馈，接收html页面，下载脚本和执行，接收样式的白屏阶段，以及后端处理的加载阶段，节省了大量打开页面后所进行的无意义操作，提高了使用者角度的网页生成速度。
93.并且另一方面，采用上述方式通过初始化进程池，初始化多个进程，其通过初始化多个webview进程，经过实际采用安卓系统的环境进行实验测试可得，第二个webview初始化的时间大大的小于首次创建和初始化webview的时间，从而在创建和初始化多个webview的过程中，客观上减小了初始化的时间，提高了多个webview的初始化的速度，避免了每次打开app从头初始化的过程中，初始化速度较慢，导致生成网页较慢的问题；其中，从原理上而言，安卓系统中webview所有的逻辑处理都是通过webviewprovider来实现的，因为它要加载webview内核，这是一个重量级的操作，内核是以apk的形式存在。而内核加载后在同一页面是共享的，因此后续的初始化时间就很少了，从而使得在初始化进程池中的多个进程的情况下，能够有效提高初始化速度，进一步提高网页生成速度。
94.此外，采用上述方式通过在打开客户端的上级app页面，也就是原生的页面时，就能够得到导入正文数据的共享实例，下级的h5页面能够快速获取到导入正文数据的共享实例这一关键信息；这一方式将h5内关键请求由app代理前置，最大化减少对网络状态的依赖，只要能够打开上级app页面，下级的h5页面就可以获取到页面关键数据。
95.通过提供h5模板以离线包的形式内置到app内，由app侧组装数据放置到模板中，由native渲染生成html缓存到客户端中。提供webview进程池，并且根据配置策略实现webview的复用，最大程度上减少重复初始化webview资源造成的手机性能浪费。优化资源缓存策略，实现多webview实例间缓存与内容共享，将静态资源放入dom storage中，实现js/css等资源持久化缓存，不需要重复进行本地文件i/o操作，提升性能。从而从多方面提高生成网页的速度。
96.图9示出了根据本技术一实施例的网页生成装置的结构示意图，该装置包括：
97.初始化模块201，用于响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化进程池中网页视图组件的进程；
98.加载模块202，用于调用进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于离线资源数据，在缓存池中创建网页视图组件的共享实例；
99.导入模块203，用于从缓存池中取出共享实例，在共享实例中导入渲染所需的正文数据，并使用导入正文数据后的共享实例；
100.网页生成模块204，用于响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及动态资源数据，渲染生成目标网页。
101.在本技术的一些实施例中，基于以上技术方案，该装置配置为：
102.将网页视图组件与客户端的原生组件进行同层渲染，生成目标网页。
103.在本技术的一些实施例中，基于以上技术方案，该装置配置为：
104.响应于客户端的启动指令，获取客户端待打开的网页的数量；
105.根据网页的数量，计算网页视图组件的进程的数量；进程的数量大于网页的数量；
106.按照进程的数量，在进程池中创建网页视图组件的进程。
107.在本技术的一些实施例中，基于以上技术方案，该装置配置为：
108.响应于关闭目标网页的指令，销毁目标网页对应的网页视图组件的进程；
109.响应于打开新的网页的指令，重新从进程池中调用已初始化的进程，生成新的网页。
110.在本技术的一些实施例中，基于以上技术方案，该装置配置为：
111.清空实例中的正文数据，并将清空正文数据后的实例重新添加至缓存池。
112.在本技术的一些实施例中，基于以上技术方案，该装置配置为：
113.监测并拦截资源请求；
114.若共享缓存中不存在资源请求对应的离线资源数据，则从内容分发服务器下载缓存数据；
115.将缓存数据异步写入共享缓存。
116.在本技术的一些实施例中，基于以上技术方案，该装置配置为：
117.响应于客户端的启动指令，检测离线资源数据是否需要更新；
118.若离线资源数据不需要更新，则调用进程池中的进程；
119.若离线资源数据需要更新，则从离线资源管理平台关联的内容分发服务器下载更新资源数据，根据更新资源数据对离线资源数据进行更新，并将更新后的离线资源数据添加至共享缓存中，并调用进程池中的进程。
120.下面参考图10来描述根据本技术实施例的电子设备30。图10显示的电子设备30仅仅是一个示例，不应对本技术实施例的功能和使用范围带来任何限制。
121.如图10所示，电子设备30以通用计算设备的形式表现。电子设备30的组件可以包括但不限于：上述至少一个处理单元310、上述至少一个存储单元320、连接不同系统组件(包括存储单元320和处理单元310)的总线330。
122.其中，存储单元存储有程序代码，程序代码可以被处理单元310执行，使得处理单元310执行本说明书上述示例性方法的描述部分中描述的根据本技术各种示例性实施方式的步骤。例如，处理单元310可以执行如图1中所示的各个步骤。
123.存储单元320可以包括易失性存储单元形式的可读介质，例如随机存取存储单元(ram)3201和/或高速缓存存储单元3202，还可以进一步包括只读存储单元(rom)3203。
124.存储单元320还可以包括具有一组(至少一个)程序模块3205的程序/实用工具3204，这样的程序模块3205包括但不限于：操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。
125.总线330可以为表示几类总线结构中的一种或多种，包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。
126.电子设备30也可以与一个或多个外部设备400(例如键盘、指向设备、蓝牙设备等)通信，还可与一个或者多个使得用户能与该电子设备30交互的设备通信，和/或与使得该电子设备30能与一个或多个其它计算设备进行通信的任何设备(例如路由器、调制解调器等等)通信。这种通信可以通过输入/输出(i/o)接口350进行。输入/输出(i/o)接口350与显示单元340相连。并且，电子设备30还可以通过网络适配器360与一个或者多个网络(例如局域网(lan)，广域网(wan)和/或公共网络，例如因特网)通信。如图所示，网络适配器360通过总
线330与电子设备30的其它模块通信。应当明白，尽管图中未示出，可以结合电子设备30使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、raid系统、磁带驱动器以及数据备份存储系统等。
127.通过以上的实施方式的描述，本领域的技术人员易于理解，这里描述的示例实施方式可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本技术实施方式的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是cd-rom，u盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、终端装置等)执行根据本技术实施方式的方法。
128.在本技术的示例性实施例中，还提供了一种计算机可读存储介质，其上存储有计算机可读指令，当计算机可读指令被计算机的处理器执行时，使计算机执行上述方法实施例部分描述的方法。
129.根据本技术的一个实施例，还提供了一种用于实现上述方法实施例中的方法的程序产品，其可以采用便携式紧凑盘只读存储器(cd-rom)并包括程序代码，并可以在终端设备，例如个人电脑上运行。然而，本技术的程序产品不限于此，在本文件中，可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
130.程序产品可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(ram)、只读存储器(rom)、可擦式可编程只读存储器(eprom或闪存)、光纤、便携式紧凑盘只读存储器(cd-rom)、光存储器件、磁存储器件、或者上述的任意合适的组合。
131.计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了可读程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。可读信号介质还可以是可读存储介质以外的任何可读介质，该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。
132.可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于无线、有线、光缆、rf等等，或者上述的任意合适的组合。
133.可以以一种或多种程序设计语言的任意组合来编写用于执行本技术操作的程序代码，程序设计语言包括面向对象的程序设计语言—诸如java、c++等，还包括常规的过程式程序设计语言—诸如“c”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算设备的情形中，远程计算设备可以通过任意种类的网络，包括局域网(lan)或广域网(wan)，连接到用户计算设备，或者，可以连接到外部计算设备(例如利用因特网服务提供商来通过因特网连接)。
134.应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本技术的实施方式，上文描述的两个或更多
模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。
135.此外，尽管在附图中以特定顺序描述了本技术中方法的各个步骤，但是，这并非要求或者暗示必须按照该特定顺序来执行这些步骤，或是必须执行全部所示的步骤才能实现期望的结果。附加的或备选的，可以省略某些步骤，将多个步骤合并为一个步骤执行，以及/或者将一个步骤分解为多个步骤执行等。
136.通过以上的实施方式的描述，本领域的技术人员易于理解，这里描述的示例实施方式可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本技术实施方式的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是cd-rom，u盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、移动终端等)执行根据本技术实施方式的方法。
137.本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本技术的其它实施方案。本技术旨在涵盖本技术的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本技术的一般性原理并包括本技术未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本技术的真正范围和精神由所附的权利要求指出。

技术特征：
1.一种网页生成方法，其特征在于，所述方法包括：响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化所述进程池中网页视图组件的进程；调用所述进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于所述离线资源数据，在缓存池中创建网页视图组件的共享实例；从所述缓存池中取出所述共享实例，在所述共享实例中导入渲染所需的正文数据，得到导入正文数据后的共享实例；响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及所述动态资源数据，渲染生成目标网页。2.根据权利要求1所述的方法，其特征在于，渲染生成目标网页，包括：将所述网页视图组件与所述客户端的原生组件进行同层渲染，生成所述目标网页。3.根据权利要求1所述的方法，其特征在于，响应于客户端的启动指令，初始化网页视图组件的进程池，包括：响应于客户端的启动指令，获取所述客户端待打开的网页的数量；根据所述网页的数量，计算网页视图组件的进程的数量；所述进程的数量大于所述网页的数量；按照所述进程的数量，在所述进程池中创建网页视图组件的进程。4.根据权利要求1所述的方法，其特征在于，渲染生成目标网页之后，所述方法还包括：响应于关闭所述目标网页的指令，销毁所述目标网页对应的网页视图组件的进程；响应于打开新的网页的指令，重新从所述进程池中调用已初始化的进程，生成新的网页。5.根据权利要求1所述的方法，其特征在于，渲染生成目标网页之后，所述方法还包括：清空所述实例中的正文数据，并将清空所述正文数据后的实例重新添加至所述缓存池。6.根据权利要求1所述的方法，其特征在于，响应于网页的打开指令，获取动态资源数据之前，所述方法还包括：监测并拦截资源请求；若所述共享缓存中不存在所述资源请求对应的离线资源数据，则从内容分发服务器下载所述缓存数据；将所述缓存数据异步写入所述共享缓存。7.根据权利要求1所述的方法，其特征在于，初始化所述进程池中网页视图组件的进程之后，所述方法还包括：响应于客户端的启动指令，检测所述离线资源数据是否需要更新；若所述离线资源数据不需要更新，则调用所述进程池中的进程；若所述离线资源数据需要更新，则从离线资源管理平台关联的内容分发服务器下载更新资源数据，根据更新资源数据对所述离线资源数据进行更新，并将更新后的所述离线资源数据添加至所述共享缓存中，并调用所述进程池中的进程。8.一种网页生成装置，其特征在于，所述装置包括：初始化模块，用于响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化
所述进程池中网页视图组件的进程；加载模块，用于调用所述进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于所述离线资源数据，在缓存池中创建网页视图组件的共享实例；导入模块，用于从所述缓存池中取出所述共享实例，在所述共享实例中导入渲染所需的正文数据，得到导入正文数据后的共享实例；网页生成模块，用于响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及所述动态资源数据，渲染生成目标网页。9.一种电子设备，其特征在于，包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述电子设备实现如权利要求1至7中任一项所述的方法。10.一种计算机可读存储介质，其特征在于，其上存储有计算机可读指令，当所述计算机可读指令被计算机的处理器执行时，使计算机执行权利要求1至7中任一项所述的方法。

技术总结
本申请提供了一种网页生成方法、装置、电子设备及存储介质。该方法包括：响应于客户端的启动指令，初始化网页视图组件的进程池，并初始化所述进程池中网页视图组件的进程；调用所述进程池中的进程，从本地内存的共享缓存中加载离线资源数据，并基于所述离线资源数据，在缓存池中创建网页视图组件的共享实例；从所述缓存池中取出所述共享实例，在所述共享实例中导入渲染所需的正文数据，并使用导入正文数据后的共享实例；响应于网页的打开指令，获取动态资源数据，根据导入正文数据后的共享实例以及所述动态资源数据，渲染生成目标网页。本申请能够提高生成网页的速度。申请能够提高生成网页的速度。申请能够提高生成网页的速度。


技术研发人员：孙乾程
受保护的技术使用者：迷你创想科技（深圳）有限公司
技术研发日：2023.04.25
技术公布日：2023/9/14