[发明专利]一种流式加载网页模板的方法及设备

说明书

本申请的目的是提供一种流式加载网页模板的方法及设备，本申请通过设定模板工具，通过所述模板工具将当前项目的目标网页分割成多个模块，并对多个模块进行唯一标识；通过服务器与所述浏览器之间建立的管道，将进行唯一标识的多个模块分段输出至浏览器；通过所述服务器与所述浏览器并发执行所述多个模块，在所述浏览器上异步加载出所述目标网页的多个模块。从而自动生成分段传输的页面，使得页面传输以二进制流的模式传输、模块分步加载，减小页面体积，加载速度更快。

技术领域

本申请涉及计算机领域，尤其涉及一种流式加载网页模板的方法及设备。

背景技术

在大型项目开发中，由于项目文件随着业务需求发展越来越庞大，导致页面加载速度越来越慢，多个文件阻塞页面的渲染内容，用户体验差、等待时间长。而传统页面交互模型是按照一定顺序的，即，当服务器端获取数据并生成页面的时候，客户端被闲置，等待服务器端生成数据；当客户端接收到服务器端返回的页面并开始下载资源，解析页面的时候，服务器又在等待来自客户端的下一次请求。空闲时间造成资源的浪费。异步加载defer虽然能达到异步请求，但要等dom文档全部解析完才会被执行；async异步加载只能异步加载外部js；该两种方式的异步加载文件大小仍然会很大，请求时间也相对较长。

发明内容

本申请的一个目的是提供一种流式加载网页模板的方法及设备，解决现有技术中异步加载方式的文件很大、请求时间也相对较长的问题。

根据本申请的一个方面，提供了一种流式加载网页模板的方法，该方法包括：

设定模板工具，通过所述模板工具将当前项目的目标网页分割成多个模块，并对多个模块进行唯一标识；

通过服务器与所述浏览器之间建立的管道，将进行唯一标识的多个模块分段输出至浏览器；

通过所述服务器与所述浏览器并发执行所述多个模块，在所述浏览器上异步加载出所述目标网页的多个模块。

可选地，设定模板工具，包括：

配置node环境以及目标数据格式的打包文件，其中，所述目标数据格式的打包文件包括当前项目的描述文件。

可选地，所述目标数据格式的打包文件由在当前项目的根目录下使用包管理工具的文件生成命令生成的，其中，所述文件生成命令用于初始化生成一个新的目标数据格式的打包文件。

可选地，在所述目标数据格式的打包文件中安装npm的依赖项，其中，所述依赖项包括网页框架、node内置的文件系统模块以及动态路由获取参数。

可选地，所述方法包括：

基于当前项目的根目录下的npm安装指令查询项目依赖的第三方模块中的数据包，根据所述数据包生成依赖包文件。

可选地，所述方法包括：

根据所述依赖包文件、当前项目中执行在node环境下的主文件、用于浏览器访问的入口文件以及用于安装依赖配置的文件确定当前项目的目录结构。

可选地，所述目标数据格式的打包文件包括JSON打包文件，所述描述文件包括当前项目的名称、版本、作者、当前项目依赖的第三方模块以及所述第三方模块的依赖包管理的地址。

可选地，通过所述服务器与所述浏览器并发执行所述多个模块，在所述浏览器上异步加载出所述目标网页的多个模块，包括：

在所述浏览器分段接收到多个模块的同时向所述服务器发送分段加载请求，与所述服务器并发执行所述多个模块，并在浏览器上异步加载出所述服务器基于所述分段加载请求反馈的所述目标网页的多个模块。

根据本申请另一个方面，还提供了一种流式加载网页模板的设备，该设备包括：