一种页面白屏检测方法技术

本申请公开一种页面白屏检测方法

【技术实现步骤摘要】
一种页面白屏检测方法、装置、计算机设备及存储介质


[0001]本申请属于人工智能
和金融科技领域，具体涉及一种页面白屏检测方法
、
装置
、
计算机设备及存储介质
。

技术介绍

[0002]当用户访问一个网站或应用时，浏览器会开始下载页面的各种资源，例如
HTML、CSS、JavaScript、
图像等，如果在这个过程中，浏览器还未能展示页面内容，用户就会看到白色的空白页面，这被称为“白屏”。
前端页面白屏检查的主要思想是在页面加载过程中尽早地展示一些内容，以减少用户看到白屏的时间，例如，在保险公司的网站或应用程序中，用户可能会访问保险公司的网站或应用程序来了解产品信息
、
购买保险
、
提交理赔申请等，对于保险公司来说，提供一个良好的用户体验非常重要，其中就包括页面加载速度以及减少白屏时间
。
[0003]目前在业内，检测前端页面白屏问题基本有如下几个方式：
[0004]1.
页面元素加载状态：通过
document.readyState
属性可以获取页面元素的加载状态，如果页面元素加载状态一直处于
loading
状态，可以判断页面处于白屏状态；
[0005]2.
页面可见性：通过
document.visibilityState
属性可以获取页面的可见性状态，如果页面一直处于不可见状态，可以判断页面处于白屏状态；r/>[0006]3.
监听错误事件：通过
window.onerror
事件可以监听页面中的错误，如果页面中存在错误，可以判断页面处于白屏状态
。
[0007]但是使用如上几种方式会存在以下问题：
[0008]1.
前端的页面加载经常会采用异步加载的方案，所以页面元素的加载状态和页面可见性无法准确识别页面是否白屏；
[0009]2.
使用监听错误事件的方案可能会被浏览器的插件所干扰，因此也无法准确判定页面是否白屏
。

技术实现思路

[0010]本申请实施例的目的在于提出一种页面白屏检测方法
、
装置
、
计算机设备及存储介质，以解决现有页面白屏检测方案存在的识别准确度较低，影响用户使用体验的技术问题
。
[0011]为了解决上述技术问题，本申请实施例提供一种页面白屏检测方法，采用了如下所述的技术方案：
[0012]一种页面白屏检测方法，包括：
[0013]接收白屏检测指令，对页面加载时间进行监控，得到页面加载时间，其中，页面加载时间包括页面加载的总计耗时和页面加载各个阶段的阶段耗时；
[0014]对页面元素的加载情况进行监控，获取页面元素加载信息；
[0015]对页面元素状态进行监控，获取页面元素状态信息；
[0016]将总计耗时
、
阶段耗时
、
页面元素加载信息和页面元素状态信息作为模型输入数据；
[0017]将模型输入数据输入到预先训练好的页面白屏检测模型，得到页面白屏检测结果，其中，页面白屏检测模型基于有监督学习算法训练得到
。
[0018]进一步地，接收白屏检测指令，对页面加载时间进行监控，得到页面加载时间，具体包括：
[0019]接收白屏检测指令，启动预设的计时程序，并通过计时程序对页面加载时间进行监控，得到页面加载的总计耗时；
[0020]对页面加载过程进行解析，确定页面加载的各个阶段，其中，页面加载包括
DNS
解析阶段
、TCP
连接阶段
、HTTP
请求阶段
、
服务器响应阶段
、HTML
解析阶段
、
资源下载阶段
、DOM
树和
CSSOM
树构建阶段
、JavaScript
处理阶段和页面渲染阶段；
[0021]在页面加载的总计耗时中查找页面加载的各个阶段的耗时，得到页面加载各个阶段的阶段耗时
。
[0022]进一步地，在页面加载的总计耗时中查找页面加载的各个阶段的耗时，得到页面加载各个阶段的阶段耗时，具体包括：
[0023]为页面加载的各个阶段配置匹配的时间标识，其中，时间标签包括开始标签和结束标签；
[0024]在页面加载的总计耗时中添加页面加载各个阶段对应的时间标识；
[0025]基于页面加载各个阶段对应的开始标签和结束标签计算页面加载各个阶段的阶段耗时
。
[0026]进一步地，对页面元素的加载情况进行监控，获取页面元素加载信息，具体包括：
[0027]调用预设的元素监控接口工具对页面元素的加载情况进行监控，获取页面元素加载信息；
[0028]对页面元素状态进行监控，获取页面元素状态信息，具体包括：
[0029]创建一个接口实例，并通过接口实例监测
DOM
树的变化事件；
[0030]调用预设的回调函数，并基于回调函数和变化事件生成页面元素状态信息
。
[0031]进一步地，页面白屏检测模型基于决策树模型训练得到，在将模型输入数据输入到预先训练好的页面白屏检测模型，得到页面白屏检测结果之前，还包括：
[0032]获取历史页面加载数据以及历史页面加载数据对应的历史页面白屏检测结果；
[0033]基于历史页面白屏检测结果对历史页面加载数据进行标注，得到标注标签；
[0034]基于预设的决策树算法和标注标签构建初始决策树模型；
[0035]将历史页面加载数据导入初始决策树模型，并调整初始决策树模型的参数，得到页面白屏检测模型
。
[0036]进一步地，将历史页面加载数据导入初始决策树模型，并调整初始决策树模型的参数，得到页面白屏检测模型，具体包括：
[0037]基于历史页面加载数据构建数据集；
[0038]对数据集进行划分，得到数据子集；
[0039]针对每一个数据子集和初始决策树模型递归构建决策子树；
[0040]组合决策子树得到页面白屏检测模型，并对页面白屏检测模型进行参数调整
。
[0041]进一步地，针对每一个数据子集和初始决策树模型递归构建决策子树，具体包括：
[0042]将数据子集导入初始决策树模型中；
[0043]提取数据子集对应的数据特征；
[0044]基于预设的递归算法从初始决策树模型的根节点开始对数据子集的数据特征进行特征归类，并将数据特征划入匹配的树节点中；
[0045]判断特征归类是否满足预设的停止条件；
[0046]若特征归类满足停止条件，则停止特征归类，得到决策子树
。
[0047]为了解决上述技术问题，本申请实本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.
一种页面白屏检测方法，其特征在于，包括：接收白屏检测指令，对页面加载时间进行监控，得到页面加载时间，其中，所述页面加载时间包括页面加载的总计耗时和页面加载各个阶段的阶段耗时；对页面元素的加载情况进行监控，获取页面元素加载信息；对页面元素状态进行监控，获取页面元素状态信息；将所述总计耗时
、
所述阶段耗时
、
所述页面元素加载信息和所述页面元素状态信息作为模型输入数据；将所述模型输入数据输入到预先训练好的页面白屏检测模型，得到页面白屏检测结果，其中，所述页面白屏检测模型基于有监督学习算法训练得到
。2.
如权利要求1所述的页面白屏检测方法，其特征在于，所述接收白屏检测指令，对页面加载时间进行监控，得到页面加载时间，具体包括：接收白屏检测指令，启动预设的计时程序，并通过所述计时程序对所述页面加载时间进行监控，得到页面加载的总计耗时；对页面加载过程进行解析，确定页面加载的各个阶段，其中，所述页面加载包括
DNS
解析阶段
、TCP
连接阶段
、HTTP
请求阶段
、
服务器响应阶段
、HTML
解析阶段
、
资源下载阶段
、DOM
树和
CSSOM
树构建阶段
、JavaScript
处理阶段和页面渲染阶段；在所述页面加载的总计耗时中查找所述页面加载的各个阶段的耗时，得到所述页面加载各个阶段的阶段耗时
。3.
如权利要求2所述的页面白屏检测方法，其特征在于，所述在所述页面加载的总计耗时中查找所述页面加载的各个阶段的耗时，得到所述页面加载各个阶段的阶段耗时，具体包括：为所述页面加载的各个阶段配置匹配的时间标识，其中，所述时间标签包括开始标签和结束标签；在所述页面加载的总计耗时中添加所述页面加载各个阶段对应的时间标识；基于所述页面加载各个阶段对应的开始标签和结束标签计算所述页面加载各个阶段的阶段耗时
。4.
如权利要求2所述的页面白屏检测方法，其特征在于，所述对页面元素的加载情况进行监控，获取页面元素加载信息，具体包括：调用预设的元素监控接口工具对所述页面元素的加载情况进行监控，获取所述页面元素加载信息；所述对页面元素状态进行监控，获取页面元素状态信息，具体包括：创建一个接口实例，并通过所述接口实例监测
DOM
树的变化事件；调用预设的回调函数，并基于所述回调函数和所述变化事件生成所述页面元素状态信息
。5.
如权利要求1所述的页面白屏检测方法，其特征在于，所述页面白屏检测模型基于决策树模型训...

【专利技术属性】
技术研发人员：林纯弟，
申请(专利权)人：中国平安财产保险股份有限公司，
类型：发明
国别省市：