一种网页页面性能的检测方法及装置与流程

1.本发明涉及网页开发领域，尤其涉及一种网页页面性能的检测方法及装置。


背景技术：

2.目前前端页面性能检测直接采用测试工具对页面进行笼统的检测，工具本身对页面进行测试的时候是根据内部设置好的全量测试指标进行性能检测，并且分数的判定也是根据内部固定的得分项权重来计算得出对于不同业务场景的分数计算也使用同一套规则，使得在不同业务场景下检测得分情况缺乏决策的参考性，测试指标缺乏定制化，分数权重固定；并且目前的工具得出的原始测试数据近百项指标，但是很多场景根本不关心其中一些指标，过多的测试指标会干扰使用者做出决策。


技术实现要素：

3.本发明提供了一种网页页面性能的检测方法及装置，用于解决现有技术中对于实际软件缺陷记录是否符合约定的规则，没有工具去进行检测的问题。
4.为了解决上述问题，本发明是这样实现的：第一方面，本发明提供一种网页页面性能的检测方法，包括：获取检测任务请求；所述检测任务请求中包括：待检测页面目标地址和待使用的目标性能指标模型的标识；根据所述检测任务请求构建浏览器测试环境，并进入所述待检测目标地址页面执行检测任务，得到检测数据；根据所述目标性能指标模型的标识，从多个性能指标模型中选择目标性能指标模型，其中，每个性能指标模型对应的检测项和/或检测项的权重不同；根据所述目标性能指标模型对应的检测项和/或检测项的权重，对所述检测数据进行处理生成检测分数；展示所述检测分数。
5.可选的，获取检测任务请求之前，还包括：配置所述性能指标模型中的检测项；对所述检测项设置最大分数，并保证所有检测项的最大分数的总和为100；所述最大分数为所述检测项的权重。
6.可选的，所述根据所述目标性能指标模型对应的检测项和/或检测项的权重，对所述检测数据进行处理生成检测分数，包括：获取所述目标性能指标模型对应的检测项；判断所述检测项的指标值是否大于或等于标准值；若所述检测项的指标值大于或等于标准值，则设置所述检测项为满分；若所述检测项的指标值未大于或等于标准值，则扣除所述检测项的相应分数，并计算得到最终分数，并判断所述最终分数是否小于零；
若所述最终分数小于零，则返回值为零；若所述最终分数不小于零，则将所述最终分数保存为预设格式，并输出所述最终分数作为检测分数。
7.可选的，所述根据所述检测任务请求构建浏览器测试环境包括：调用puppeteer工具的构建浏览器测试环境功能根据所述检测任务请求自动构建浏览器测试环境。
8.可选的，所述进入所述待检测目标地址执行检测任务包括：进入所述待检测目标地址，并将所述puppeteer工具启动好的浏览器进程端口发送至lighthouse工具，通过所述lighthouse服务接管浏览器开始执行检测任务。
9.可选的，所述目标性能指标模型对应时间维度和页面维度的检测项；其中，所述时间维度的检测项包括以下至少一项：dns耗时、tnp耗时、首次内容绘制时间、最大内容绘制时间、首次可交互时间、累计位移偏移量、加载时间和阻塞总时间；所述页面维度的检测项包括以下至少一项：图片优化、静态资源未使用缓存策略、重复请求告警项和横向滚动条告警项。
10.第二方面，本发明提供一种网页页面性能的检测装置，包括：获取模块，用于获取检测任务请求；所述检测任务请求中包括：待检测页面目标地址和待使用的目标性能指标模型的标识；处理模块，用于根据所述检测任务请求构建浏览器测试环境，并进入所述待检测目标地址页面执行检测任务，得到检测数据；选择模块，用于根据所述目标性能指标模型的标识，从多个性能指标模型中选择目标性能指标模型，其中，每个性能指标模型对应的检测项和/或检测项的权重不同；检测模块，用于根据所述目标性能指标模型对应的检测项和/或检测项的权重，对所述检测数据进行处理生成检测分数；展示模块，用于展示所述检测分数。
11.可选的，还包括：配置模块，用于配置所述性能指标模型中的检测项；对所述检测项设置最大分数，并保证所有检测项的最大分数的总和为100；所述最大分数为所述检测项的权重。
12.可选的，所述检测模块包括：获取子模块，用于获取所述目标性能指标模型对应的检测项；判断子模块，用于判断所述检测项的指标值是否大于或等于标准值；若所述检测项的指标值大于或等于标准值，则设置所述检测项为满分；若所述检测项的指标值未大于或等于标准值，则扣除所述检测项的相应分数，并计算得到最终分数，并判断所述最终分数是否小于零；若所述最终分数小于零，则返回值为零；若所述最终分数不小于零，则将所述最终分数保存为预设格式，并输出所述最终分数作为检测分数。
13.可选的，所述根据所述检测任务请求构建浏览器测试环境包括：调用puppeteer工具的构建浏览器测试环境功能根据所述检测任务请求自动构建浏览器测试环境。
14.可选的，所述进入所述待检测目标地址执行检测任务包括：进入所述待检测目标地址，并将所述puppeteer工具启动好的浏览器进程端口发送至lighthouse工具，通过所述lighthouse服务接管浏览器开始执行检测任务。
15.可选的，所述目标性能指标模型对应时间维度和页面维度的检测项；
其中，所述时间维度的检测项包括以下至少一项：dns耗时、tnp耗时、首次内容绘制时间、最大内容绘制时间、首次可交互时间、累计位移偏移量、加载时间和阻塞总时间；所述页面维度的检测项包括以下至少一项：图片优化、静态资源未使用缓存策略、重复请求告警项和横向滚动条告警项。
16.第三方面，本发明提供一种服务器，包括处理器，存储器及存储在所述存储器上并可在所述处理器上运行的程序或指令，所述程序或指令被所述处理器执行时实现如第一方面中任一项所述的网页页面性能的检测方法的步骤。
17.第四方面，本发明提供一种可读存储介质，所述可读存储介质上存储程序或指令，所述程序或指令被处理器执行时实现如第一方面中任一项所述的网页页面性能的检测方法的步骤。
18.本发明中，通过建立目标性能指标模型，支持检测指标的定制化，检测项权重自定义等精细化的定制功能，使得检测结果更加精准，数据参考性更高，并且提升了用户的使用体验。
附图说明
19.通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：图1为本发明实施例提供的一种网页页面性能的检测方法流程示意图；图2为本发明实施例提供的一种网页页面性能的检测方法的任务创建示意图；图3为本发明实施例提供的一种网页页面性能的检测方法的总体流程示意图；图4为本发明实施例提供的一种网页页面性能的检测装置的结构示意图图；图5为本发明实施例提供的一种服务器的结构示意图。
具体实施方式
20.下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
21.请参考图1，本发明实施例提供了一种网页页面性能的检测方法，包括：步骤11：获取检测任务请求；所述检测任务请求中包括：待检测页面目标地址和待使用的目标性能指标模型的标识；步骤12：根据所述检测任务请求构建浏览器测试环境，并进入所述待检测目标地址页面执行检测任务，得到检测数据；步骤13：根据所述目标性能指标模型的标识，从多个性能指标模型中选择目标性能指标模型，其中，每个性能指标模型对应的检测项和/或检测项的权重不同；步骤14：根据所述目标性能指标模型对应的检测项和/或检测项的权重，对所述检测数据进行处理生成检测分数；步骤15：展示所述检测分数。
22.本发明实施例中，在步骤11中，获取用户创建的检测任务请求，所述检测任务请求的创建，请参考图2，所述检测任务请求中包括：待检测页面目标地址和待使用的目标性能指标模型的标识；在步骤12中，根据所述检测任务请求，调用puppeteer工具的构建浏览器测试环境功能根据所述检测任务请求自动构建浏览器测试环境，并进入所述待检测目标地址页面，进入所述待检测目标地址，并将所述puppeteer工具启动好的浏览器进程端口发送至lighthouse工具，通过所述lighthouse服务接管浏览器开始执行检测任务，得到检测数据；在步骤13中，根据所述目标性能指标模型的标识，从多个性能指标模型中选择目标性能指标模型，其中，每个性能指标模型对应的检测项和/或检测项的权重不同；不同模型适合不同业务页面的检测打分且检测项打分权重不同：所述多个性能指标模型包括以下至少一项：tob管理端、tob平台端和应用软件端，其中，所述tob管理端主要会关注用户体验方面的检测项，例如：页面加载时间、搜索引擎收录程度、图片格式是否合理和图片大小检测；所述tob平台端关注基础的性能，例如：项目依赖是否有漏洞、页面有没有报错和影不影响正常使用；应用软件端会关注不同型号设备运行页面的时候会不会出现报错和兼容问题。
23.本发明实施例中，在步骤14中，根据所述目标性能指标模型对应的检测项和/或检测项的权重，对所述检测数据进行处理生成检测分数，包括：获取所述目标性能指标模型对应的检测项；判断所述检测项的指标值是否大于或等于标准值；若所述检测项的指标值大于或等于标准值，则设置所述检测项为满分；若所述检测项的指标值未大于或等于标准值，则扣除所述检测项的相应分数，并计算得到最终分数，并判断所述最终分数是否小于零；若所述最终分数小于零，则返回值为零；若所述最终分数不小于零，则将所述最终分数保存为预设格式，并输出所述最终分数作为检测分数；所述目标性能指标模型对应时间维度和页面维度的检测项；其中，所述时间维度的检测项包括以下至少一项：dns耗时、tnp耗时、首次内容绘制时间、最大内容绘制时间、首次可交互时间、累计位移偏移量、加载时间和阻塞总时间；所述页面维度的检测项包括以下至少一项：图片优化、静态资源未使用缓存策略、重复请求告警项和横向滚动条告警项。
24.本发明实施例中，改进传统的页面检测中检测结果数据庞杂，粗略且难以做到精细化，定制化的情况，使页面性能检测更精细，通过定制化使得检测结果更具有决策的参考性。
25.本发明实施例中，在步骤15中，展示所述检测分数并给出优化的参考建议。
26.本发明实施例中，通过建立目标性能指标模型，支持检测指标的定制化，检测项权重自定义等精细化的定制功能，使得检测结果更加精准，数据参考性更高，并且提升了用户的使用体验。
27.本发明实施中，请参考图3，用户首先进行登录，若登录成功，则输入检测目标网址；选择业务性能检测模型，即户创建检测任务，所述检测任务请求中包括：待检测页面目标地址和待使用的目标性能指标模型的标识；启动puppeteer开启目标页面，并返回端口号，即调用puppeteer工具的构建浏览器测试环境功能根据所述检测任务请求自动构建浏览器测试环境，并进入所述待检测目标地址页面，进入所述待检测目标地址；lighthouse通过端口号，接管headless浏览器，开始检测，即 将所述puppeteer工具启动好的浏览器进程端口发送至lighthouse工具，通过所述lighthouse服务接管浏览器开始执行检测任务，得到检测数据；调用指定的业务-性能指标模型，处理原始数据，即根据所述目标性能指标模
型的标识，从多个性能指标模型中选择目标性能指标模型；得到处理过的数据，计算性能得分并展示优化建议，即根据所述目标性能指标模型对应的检测项和/或检测项的权重，对所述检测数据进行处理生成检测分数；展示所述检测分数；最后结束进程。
28.本发明实施例中，通过建立目标性能指标模型，支持检测指标的定制化，检测项权重自定义等精细化的定制功能，使得检测结果更加精准，数据参考性更高，并且提升了用户的使用体验。
29.请参考图4，本发明提供一种网页页面性能的检测装置，包括：获取模块41，用于获取检测任务请求；所述检测任务请求中包括：待检测页面目标地址和待使用的目标性能指标模型的标识；处理模块42，用于根据所述检测任务请求构建浏览器测试环境，并进入所述待检测目标地址页面执行检测任务，得到检测数据；选择模块43，用于根据所述目标性能指标模型的标识，从多个性能指标模型中选择目标性能指标模型，其中，每个性能指标模型对应的检测项和/或检测项的权重不同；检测模块44，用于根据所述目标性能指标模型对应的检测项和/或检测项的权重，对所述检测数据进行处理生成检测分数；展示模块45，用于展示所述检测分数。
30.本发明实施例中，可选的，还包括：配置模块，用于配置所述性能指标模型中的检测项；对所述检测项设置最大分数，并保证所有检测项的最大分数的总和为100；所述最大分数为所述检测项的权重。
31.本发明实施例中，可选的，所述检测模块包括：获取子模块，用于获取所述目标性能指标模型对应的检测项；判断子模块，用于判断所述检测项的指标值是否大于或等于标准值；若所述检测项的指标值大于或等于标准值，则设置所述检测项为满分；若所述检测项的指标值未大于或等于标准值，则扣除所述检测项的相应分数，并计算得到最终分数，并判断所述最终分数是否小于零；若所述最终分数小于零，则返回值为零；若所述最终分数不小于零，则将所述最终分数保存为预设格式，并输出所述最终分数作为检测分数。
32.本发明实施例中，可选的，所述根据所述检测任务请求构建浏览器测试环境包括：调用puppeteer工具的构建浏览器测试环境功能根据所述检测任务请求自动构建浏览器测试环境。
33.可选的，所述进入所述待检测目标地址执行检测任务包括：进入所述待检测目标地址，并将所述puppeteer工具启动好的浏览器进程端口发送至lighthouse工具，通过所述lighthouse服务接管浏览器开始执行检测任务。
34.本发明实施例中，可选的，所述目标性能指标模型对应时间维度和页面维度的检测项；其中，所述时间维度的检测项包括以下至少一项：dns耗时、tnp耗时、首次内容绘制时间、最大内容绘制时间、首次可交互时间、累计位移偏移量、加载时间和阻塞总时间；所述页面维度的检测项包括以下至少一项：图片优化、静态资源未使用缓存策略、重复请求告警项和横向滚动条告警项。
35.本发明实施例提供的网页页面性能的检测装置能够实现图1的方法实施例中网页
页面性能的检测方法实现的各个过程，为避免重复，这里不再赘述。
36.请参考图5，本发明实施例还提供一种服务器50，包括处理器51，存储器52及存储在存储器52上并可在所述处理器51上运行的计算机程序，该计算机程序被处理器51执行时实现上述网页页面性能的检测方法实施例的各个过程，且能达到相同的技术效果，为避免重复，这里不再赘述。
37.本发明实施例还提供一种计算机可读存储介质，所述计算机可读存储介质上存储计算机程序，所述计算机程序被处理器执行时实现上述网页页面性能的检测方法实施例的各个过程，且能达到相同的技术效果，为避免重复，这里不再赘述。其中，所述的计算机可读存储介质，如只读存储器（read-only memory，rom）、随机存取存储器（random access memory，ram）、磁碟或者光盘等。
38.需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者装置不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者装置所固有的要素。在没有更多限制的情况下，由语句“包括一个
……”
限定的要素，并不排除在包括该要素的过程、方法、物品或者装置中还存在另外的相同要素。
39.通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质（如rom/ram、磁碟、光盘）中，包括若干指令用以使得一台终端（可以是手机，计算机，服务器，空调器，或者终端等）执行本发明各个实施例所述的方法。
40.上面结合附图对本发明的实施例进行了描述，但是本发明并不局限于上述的具体实施方式，上述的具体实施方式仅仅是示意性的，而不是限制性的，本领域的普通技术人员在本发明的启示下，在不脱离本发明宗旨和权利要求所保护的范围情况下，还可做出很多形式，均属于本发明的保护之内。