页面加载分析方法、设备及可读存储介质

摘要

本发明公开了一种页面加载分析方法、设备及可读存储介质，属于网页应用技术领域。本发明通过监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器，其中，第一监听器用于监听页面内容变化信息，第二监听器用于监听静态资源加载信息；获取页面内容变化信息发生改变引起的文档对象模型的变化率，当变化率小于变化阈值时，确定页面切换结束；判断第二监听器监听的静态资源是否加载完成；若是，则页面加载完成，输出加载完成的信息并暂停第一监听器和第二监听器；通过上述方式，控制第一监听器和第二监听器监听页面切换过程中的文档对象模型的变化情况，综合通页面切换状态和静态资源加载状态信息，准确的判断页面是否加载完成。

权利要求

1.一种页面加载分析方法，其特征在于，所述页面加载分析方法包括以下步骤：监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器，其中，所述第一监听器用于监听页面内容变化信息，所述第二监听器用于监听静态资源加载信息；

获取所述页面内容变化信息发生改变引起的文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束；

所述页面切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成；

若是，则所述页面加载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器；

所述文档对象模型的变化率包括第一变化率和第二变化率，所述获取所述页面内容变化信息发生改变引起的文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束的步骤，包括：

当所述页面发生切换时，控制所述第一监听器监听和记录所述文档对象模型的变化率，得到第一变化率；

控制所述第二监听器监听所述页面在资源加载时的所述文档对象模型的变化率，得到第二变化率；

当所述第一变化率和所述第二变化率均小于变化阈值时，则所述页面切换结束。

2.如权利要求1所述的页面加载分析方法，其特征在于，所述监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器的步骤之前，所述方法包括：判断所述第一监听器和所述第二监听器是否处于暂停状态；

若是，则执行所述监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器的步骤。

3.如权利要求1所述的页面加载分析方法，其特征在于，所述控制所述第二监听器监听所述页面在资源加载时的所述文档对象模型的变化率，得到第二变化率的步骤，包括：接收所述页面切换后的所述静态资源的加载请求；

响应所述加载请求，加载所述静态资源，控制所述第二监听器监听所述文档对象模型的变化率，得到第二变化率。

4.如权利要求1所述的页面加载分析方法，其特征在于，所述页面切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成的步骤之后，包括：若否，调整所述变化阈值，以使所述静态资源加载完成的时间处于所述页面切换结束的时间范围内。

5.如权利要求1所述的页面加载分析方法，其特征在于，所述若是，则所述页面加载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器的步骤之后，包括：获取所述页面加载完成过程中的所述第一监听器记录的文档对象模型变化列表，并获取所述第二监听器记录的静态资源列表；

对所述文档对象模型变化列表和所述静态资源列表进行分析计算，得到页面加载完成时间，以分析页面性能。

6.如权利要求5所述的页面加载分析方法，其特征在于，所述对所述文档对象模型变化列表和所述静态资源列表进行分析计算，得到页面加载完成时间，以分析页面性能的步骤，所述方法包括：

获取所述页面切换开始的时间，得到初始时间；

确定所述文档对象模型变化列表中所述文档对象模型的增量最大的变化时间，得到第一时间；

确定所述静态资源列表中所述静态资源加载完成时间，得到第二时间；

获取所述第一时间和所述第二时间之间的最大时间，则计算所述初始时间至所述最大时间的时间范围，得到所述页面加载完成时间；

基于所述页面加载完成时间，以分析所述页面性能。

7.如权利要求6所述的页面加载分析方法，其特征在于，所述基于所述页面加载完成时间，以分析所述页面性能的步骤，所述方法包括：获取预设加载时间；

比对所述页面加载完成时间和所述预设加载时间；

若所述页面加载完成时间大于所述预设加载时间，则输出提醒信息，以提升所述页面性能。

8.一种页面加载分析设备，其特征在于，所述设备包括：存储器、处理器及存储在所述存储器上并可在所述处理器上运行的页面加载分析程序，所述页面加载分析程序配置为实现如权利要求1至7中任一项所述的页面加载分析方法的步骤。

9.一种存储介质，其特征在于，所述存储介质上存储有页面加载分析程序，所述页面加载分析程序被处理器执行时实现如权利要求1至7任一项所述的页面加载分析方法的步骤。

说明书

页面加载分析方法、设备及可读存储介质

技术领域

[0001] 本发明涉及网页应用领域，尤其涉及页面加载分析方法、设备及可读存储介质。

背景技术

[0002] 针对单页应用框架而言，首次页面的加载是否完成一般是根据windows.onload事件的触发来判定，但是，对于页面跳转后的页面加载一般仅判断跳转动作，无法判断加载是
否完成，导致无法判断单页应用中非首次页面切换后的页面加载问题。

发明内容

[0003] 本发明的主要目的在于提供一种页面加载分析方法、设备及可读存储介质，旨在解决难以判断单页面应用非首次页面加载完成的技术问题。

[0004] 为实现上述目的，本发明提供一种页面加载分析方法，所述页面加载分析方法包括以下步骤：

[0005] 监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器，其中，所述第一监听器用于监听页面内容变化信息，所述第二监听器用于监听静态资源加载
信息；

[0006] 获取所述页面内容变化信息发生改变引起的文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束；

[0007] 所述页面切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成；

[0008] 若是，则所述页面加载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器。

[0009] 优选地，所述监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器的步骤之前，所述方法包括：

[0010] 判断所述第一监听器和所述第二监听器是否处于暂停状态；

[0011] 若是，则执行所述监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器的步骤。

[0012] 优选地，所述文档对象模型的变化率包括第一变化率和第二变化率，

[0013] 所述获取所述页面内容变化信息发生改变引起的文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束的步骤，包括：

[0014] 当所述页面发生切换时，控制所述第一监听器监听和记录所述文档对象模型的变化率，得到第一变化率；

[0015] 控制所述第二监听器监听所述页面在资源加载时的所述文档对象模型的变化率，得到第二变化率；

[0016] 当所述第一变化率和所述第二变化率均小于变化阈值时，则所述页面切换结束。

[0017] 优选地，所述控制所述第二监听器监听所述页面在资源加载时的所述文档对象模型的变化率，得到第二变化率的步骤，包括：

[0018] 接收所述页面切换后的所述静态资源的加载请求；

[0019] 响应所述加载请求，加载所述静态资源，控制所述第二监听器监听所述文档对象模型的变化率，得到第二变化率。

[0020] 优选地，所述页面切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成的步骤之后，包括：

[0021] 若否，调整所述变化阈值，以使所述静态资源加载完成的时间处于所述页面切换结束的时间范围内。

[0022] 优选地，所述若是，则所述页面加载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器的步骤之后，包括：

[0023] 获取所述页面加载完成过程中的所述第一监听器记录的文档对象模型变化列表，并获取所述第二监听器记录的静态资源列表；

[0024] 对所述文档对象模型变化列表和所述静态资源列表进行分析计算，得到页面加载完成时间，以分析页面性能。

[0025] 优选地，所述对所述文档对象模型变化列表和所述静态资源列表进行分析计算，得到页面加载完成时间，以分析页面性能的步骤，所述方法包括：

[0026] 获取所述页面切换开始的时间，得到初始时间；

[0027] 确定所述文档对象模型变化列表中所述文档对象模型的增量最大的变化时间，得到第一时间；

[0028] 确定所述静态资源列表中所述静态资源加载完成时间，得到第二时间；

[0029] 获取所述第一时间和所述第二时间之间的最大时间，则计算所述初始时间至所述最大时间的时间范围，得到所述页面加载完成时间；

[0030] 基于所述页面加载完成时间，以分析所述页面性能。

[0031] 优选地，所述基于所述页面加载完成时间，以分析所述页面性能的步骤，所述方法包括：

[0032] 获取预设加载时间；

[0033] 比对所述页面加载完成时间和所述预设加载时间；

[0034] 若所述页面加载完成时间大于所述预设加载时间，则输出提醒信息，以提升所述页面性能。

[0035] 此外，为实现上述目的，本发明还提供一种页面加载分析设备，所述页面加载分析设备包括存储器、处理器和存储在所述存储器上并可在所述处理器上运行的页面加载分析
程序，所述页面加载分析程序被所述处理器执行时实现如上所述的页面加载分析方法的步
骤。

[0036] 此外，为实现上述目的，本申请还提供一种计算机可读存储介质，所述计算机可读存储介质上存储有页面加载分析程序，所述页面加载分析程序被处理器执行时实现如上所
述的页面加载分析方法的步骤。

[0037] 本发明页面加载分析方法，包括以下步骤：监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器，其中，所述第一监听器用于监听页面内容变化信息，
所述第二监听器用于监听静态资源加载信息；获取所述页面内容变化信息发生改变引起的
文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束；所述页面
切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成；若是，则所述页面加
载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器；通过上述方式，控
制第一监听器和第二监听器监听页面切换过程中的文档对象模型的变化情况，综合通页面
切换状态和静态资源加载状态信息，准确的判断页面是否加载完成。

附图说明

[0038] 图1是本发明实施例方案涉及的硬件运行环境的页面加载分析设备的结构示意图；

[0039] 图2为本发明页面加载分析方法第一实施例的流程示意图；

[0040] 图3为本发明页面加载分析装置的细化功能模块示意图。

[0041] 本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

[0042] 应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

[0043] 参照图1，图1为本发明实施例方案涉及的硬件运行环境的页面加载分析设备结构示意图。

[0044] 如图1所示，该页面加载分析设备可以包括：处理器1001，例如中央处理器（Central Processing Unit，CPU），通信总线1002、用户接口1003，网络接口1004，存储器
1005。其中，通信总线1002用于实现这些组件之间的连接通信。用户接口1003可以包括显示
屏（Display）、输入单元比如键盘（Keyboard），可选用户接口1003还可以包括标准的有线接
口、无线接口。网络接口1004可选的可以包括标准的有线接口、无线接口（如无线保真
（WIreless‑FIdelity，WI‑FI）接口）。存储器1005可以是高速的随机存取存储器（Random 
Access Memory，RAM）存储器，也可以是稳定的非易失性存储器（Non‑Volatile Memory，
NVM），例如磁盘存储器。存储器1005可选的还可以是独立于前述处理器1001的存储装置。

[0045] 本领域技术人员可以理解，图1中示出的结构并不构成对页面加载分析设备的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。

[0046] 如图1所示，作为一种存储介质的存储器1005中可以包括操作系统、数据存储模块、网络通信模块、用户接口模块以及页面加载分析程序。

[0047] 在图1所示的页面加载分析设备中，网络接口1004主要用于与其他设备进行数据通信；用户接口1003主要用于与用户进行数据交互；本发明页面加载分析设备中的处理器
1001、存储器1005可以设置在页面加载分析设备中，所述页面加载分析设备通过处理器
1001调用存储器1005中存储的页面加载分析程序，并执行本发明实施例提供的页面加载分
析方法。

[0048] 本发明实施例提供了一种页面加载分析方法，参照图2，图2为本发明一种页面加载分析方法第一实施例的流程示意图。

[0049] 本申请实施例提供了页面加载分析方法的实施例，需要说明的是，虽然在流程图中示出了逻辑顺序，但是在某些情况下，可以以不同于此处的顺序执行所示出或描述的步
骤。本申请页面加载分析方法各个实施例的执行主体是页面加载分析系统。需要说明的是，
页面加载分析方法应用于页面加载分析装置，该页面加载分析装置属于页面加载分析系
统，也即系统，该页面加载分析系统属于页面加载分析设备。

[0050] 本实施例中，所述页面加载分析方法包括：

[0051] 步骤S10，监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器，其中，所述第一监听器用于监听页面内容变化信息，所述第二监听器用于监听静态资
源加载信息；

[0052] 单页应用在刷新页面时，会请求一个HTML（Hyper Text Markup Language，超文本标记语言）文件，切换页面的时候，浏览器不会发起新的请求一个HTML文件，只是页面内容
发生了变化。具体地，JS（JavaScript，编程语言）感知URL（uniform resource locator，统
一资源定位系统）变化，当URL发生变化后，使用JS动态把当前的页面内容清除掉，再把下一
个页面的内容挂载到页面上，此时的路由就不是后端来做了，而是前端来做，判断页面到底
显示哪一个组件，再把以前的组件清除掉使用新的组件，就不会每一次跳转都请求HTML文
件，从而节约HTTP（Hyper Text Transfer Protocol，超文本传输协议）请求发送的时延，以
使页面切换加快。

[0053] 在本实施例中，当用户打开浏览器，输入网址或者点击网址链接时，将触发浏览器HTTP连接请求，系统响应连接请求而进行页面切换行为，系统监听页面切换接口，当发生页
面切换行为时，系统控制第一监听器和第二监听器，其中，第一监听器是MutationObserver
（突变监听器），第二监听器是PerformanceObserver（性能监听器），在页面首次进入后，系
统启动第一监听器和第二监听器，第一监听器主要用于监听DOM（Document Object Model，
文档对象模型）的具体变化，当页面切换时，页面内容发生变化时，会引起DOM变化，因此，第
一监听器可用于监听页面内容变化信息，通过页面内容变化信息引起的DOM变化状态，判断
页面是否切换结束。第二监听器主要用于监听resource（静态资源）的加载，也即静态资源
加载信息，在静态资源加载的过程中，也会引起DOM变化。

[0054] 进一步地，监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器之前，包括以下步骤S11‑S12：

[0055] 步骤S11，判断所述第一监听器和所述第二监听器是否处于暂停状态；

[0056] 步骤S12，若是，则执行所述监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器的步骤。

[0057] 在本实施例中，在页面切换的过程中，第一监听器和第二监听器会启动会切换过程中的数据进行监听和记录，监听器的启动会占用页面性能。当页面切换较快，上一个切换
请求还未执行完毕，而用户发出了新的切换请求时，则会导致第一监听器和第二监听器即
时启动，第一监听器和第二监听器的运行占用页面性能，会造成页面卡顿，因此，在本次页
面切换启动两个监听器时，需判断第一监听器和第二监听器是否处于暂停状态，也即将上
一个页面切换的过程结束，系统响应新的HTTP连接请求执行页面切换动作。若是，则执行所
述监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器的步骤。若
否，则需要先暂停第一监听器和第二监听器，再启动第一监听器和第二监听器。

[0058] 需要说明的是，开始前执行依次暂停的目的是为了防止上一次启动的监听器在结束前发生页面切换，由此，也可以在每一次页面切换时，页面加载完成后系统自动暂停第一
监听器和第二监听器。

[0059] 步骤S20，获取所述页面内容变化信息发生改变引起的文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束；

[0060] 在本实施例中，页面切换过程中会发生页面内容变化和静态资源加载过程，页面内容变化和静态资源的加载均会引起DOM变化，也即，在页面切换过程，DOM会发生巨变，其
波动浮动突增，因此，在DOM变化趋于平稳时或恢复平稳时，以确定页面切换结束。

[0061] 进一步地，获取所述页面内容变化信息发生改变引起的文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束，包括以下步骤S21‑S23：

[0062] 步骤S21，当所述页面发生切换时，控制所述第一监听器监听和记录所述文档对象模型的变化率，得到第一变化率；

[0063] 步骤S22，控制所述第二监听器监听所述页面在资源加载时的所述文档对象模型的变化率，得到第二变化率；

[0064] 步骤S23，当所述第一变化率和所述第二变化率均小于变化阈值时，则所述页面切换结束。

[0065] 在本实施例中，页面内容变化和静态资源的加载均会引起DOM变化，也即文档对象模型变化，因此，文档对象模型的变化率包括第一变化率和第二变化率，其中，第一变化率
为页面内容变化引起的DOM变化，第二变化率为静态资源的加载引起的DOM变化。具体地，由
于MutationObserver的回调函数中返回的是每次的DOM变化集合，此处需要判断DOM的变化
是否趋于稳定。因为在页面中，即使页面处于无操作状态下，页面中的DOM也可能发生一些
细微的变化（如页面元素的位置或形状等的变化）而被MutationObserver（第一监听器）捕
获到，引起DOM变化。而在页面切换时，由于元素的改变带来的DOM变化通常是非常巨大的，
因此，只需要判断DOM的变化趋于稳定并变化极少即可基本断定整个页面的切换已结束。

[0066] 具体地，获取在页面无操作也即平稳时的DOM变化率，也即变化阈值，该变化阈值是通过历史数据情况得到的经验值。获取在页面切换时，DOM的变化率，也即第一变化率，当
第一变化率小于变化阈值时，表示整个页面的切换已结束。 PerformanceObserver（第二监
听器）会监听静态资源的加载，静态资源的加载会带来DOM的变化，因此，只需要以DOM的变
化趋于稳定即可判定不再有影响页面的资源开始加载。具体地，获取邸监听器监听静态资
源加载时的DOM变化率，得到第二变化率，当第二变化率小于变化阈值时，表示影响页面的
静态资源基本加载完成，由此确定页面切换结束。

[0067] 需要说明的是，静态资源加载时判定DOM变化趋于平稳的变化阈值可以根据经验数据重新设置，也即，用于判定第一监听器所监听的DOM变化趋于平稳的变化阈值和用于判
定第二监听器所监听的DOM变化趋于平稳的变化阈值可以一致也可以不一致。

[0068] 进一步地，控制所述第二监听器监听所述页面在资源加载时的所述文档对象模型的变化率，得到第二变化率的步骤，包括以下步骤S221‑S222：

[0069] 步骤S221，接收所述页面切换后的所述静态资源的加载请求；

[0070] 步骤S222，响应所述加载请求，加载所述静态资源，控制所述第二监听器监听所述文档对象模型的变化率，得到第二变化率。

[0071] 在本实施例中，页面切换时，PerformanceObserver会监听静态资源的加载，而需要监听的静态资源加载在页面切换阶段，通常只有页面切换后短暂的一瞬间内开始加载资
源（也可能没有），在加载前，系统发起间隔不超过某一时间的加载请求，其中，某一时间是
经验值，可根据历史数据计算得到，某一时间可以是500ms，也即，连续静态资源的加载请求
发起间隔不超过500ms，需要说明的是，这里的静态资源基本都是因页面切换而发起的，成
为关键资源。

[0072] 由于页面切换时的资源包括文字、图片、文件等，加载文件时，有JS脚本文件加载，脚本中包括资源的请求，只有页面切换后短暂的一段时间有资源的加载，该一段时间通常
是1‑2秒内，也即在页面切换后的瞬间便有静态资源的加载。系统接收页面切换后的静态资
源加载请求，响应加载请求，加载关键资源，由于资源加载的技术监听没有很好的判断依
据，而一旦有资源的加载发生，必定带来DOM的变化，因此只需要以DOM变化趋于稳定即可判
定不再有影响页面的资源开始加载，也即获取第二监听器记录的数据，得到DOM变化的第二
变化率，用于后续判断该页面是否切换结束。

[0073] 步骤S30，所述页面切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成；

[0074] 在本实施例中，页面切换结束后，通过浏览器的内置程序判断第二监听器监听的静态资源是否加载完成，其中，静态资源是否加载完成主要考虑JS脚本的资源，也即关键资
源的加载情况。

[0075] 步骤S40，若是，则所述页面加载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器。

[0076] 在本实施例中，若静态资源加载完成，则确定该页面加载完成，也即非首次页面切换已完成，包括页面切换和页面资源加载，则输出加载完成的信息，并暂停第一监听器和第
二监听器，保证本次非首次页面切换结束，监听器监听结束。

[0077] 若否，调整所述变化阈值，以使所述静态资源加载完成的时间处于所述页面切换结束的时间范围内。具体地，若存在未完成加载的静态资源，则略微延长DOM变化是否趋于
平稳的计算范围，直至静态资源中的关键资源全部加载完成后，DOM变化趋于平稳，也即，静
态资源加载完成的时间处于页面切换结束的时间范围内，此时判定该页面加载完成，暂停
第一监听器和第二监听器。避免了DOM变化趋于平稳但资源未加载完，而导致的监听停止的
问题。

[0078] 本发明页面加载分析方法，包括以下步骤：监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器，其中，所述第一监听器用于监听页面内容变化信息，
所述第二监听器用于监听静态资源加载信息；获取所述页面内容变化信息发生改变引起的
文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束；所述页面
切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成；若是，则所述页面加
载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器；通过上述方式，控
制第一监听器和第二监听器监听页面切换过程中的文档对象模型的变化情况，综合通页面
切换状态和静态资源加载状态信息，准确的判断页面是否加载完成。

[0079] 进一步地，基于上述第一实施例，提出本申请页面加载分析方法的第二实施例。在本实施例中，所述页面加载分析方法还包括：

[0080] 步骤S50，获取所述页面加载完成过程中的所述第一监听器记录的文档对象模型变化列表，并获取所述第二监听器记录的静态资源列表；

[0081] 步骤S60，对所述文档对象模型变化列表和所述静态资源列表进行分析计算，得到页面加载完成时间，以分析页面性能。

[0082] 在本实施例中，页面切换过程中，页面对元素的增删改查，会引起DOM变化，并被第一监听器记录DOM的变化，得到DOM（文档对象模型）变化列表，在静态资源加载时，加载了哪
些资源、开始加载的时间等有关信息被第二监听器记录，得到resource（静态资源）加载的
静态资源列表，通过对的DOM变化列表和静态资源列表中的数据进行分析和计算，得到页面
加载完成时间，根据页面加载完成时间可分析页面的性能。

[0083] 进一步地，对所述文档对象模型变化列表和所述静态资源列表进行分析计算，得到页面加载完成时间，以分析页面性能，包括以下步骤S61‑S65：

[0084] 步骤S61，获取所述页面切换开始的时间，得到初始时间；

[0085] 步骤S62，确定所述文档对象模型变化列表中所述文档对象模型的增量最大的变化时间，得到第一时间；

[0086] 步骤S63，确定所述静态资源列表中所述静态资源加载完成时间，得到第二时间；

[0087] 步骤S64，获取所述第一时间和所述第二时间之间的最大时间，则计算所述初始时间至所述最大时间的时间范围，得到所述页面加载完成时间；

[0088] 步骤S65，基于所述页面加载完成时间，以分析所述页面性能。

[0089] 在本实施例中，在页面切换发生时系统会记录一个时间戳，用于记录页面切换的初始时间，具体地，获取页面切换的开始的系统时间，得到初始时间。分析DOM变化列表，得
到DOM变化量最大的的一次时间点，具体地，基于DOM变化列表，计算DOM变化列表中每一项
新增的DOM数量，得到至少一个增量，其中，DOM数量为页面中加载的页面元素的内容数量，
其后，在至少一个增量中，获取DOM增量最大的值对应的一次DOM变化时间点，记录一个时间
戳，该时间戳对应的是DOM变化的最大时间点，也即，第一时间。

[0090] 基于静态资源列表，取距离页面切换发生最近的连续静态资源，这里的连续静态资源指加载请求发起间隔不超过500ms的静态资源，这样的静态资源基本都是因页面切换
而发起的，由此得到静态资源集合中最晚加载完成的时间点，得到第二时间。将第一时间和
第二时间汇总后，取最大的时间点作为页面加载完成的时间点，计算初始时间中页面加载
完成的时间点之间的时间，得到页面加载完成时间。可以理解，当第一时间小于第二时间
时，则第二时间作为页面加载完成时间点，也即静态资源加载完的时间点为页面加载完成
时间点；当第一时间大于第二时间时，则第一时间作为页面加载完成时间点，也即DOM便阿
虎最大的时间点为页面加载完成时间点。

[0091] 进一步地，基于所述页面加载完成时间，以分析所述页面性能，包括以下步骤S651‑S653：

[0092] 步骤S651，获取预设加载时间；

[0093] 步骤S652，比对所述页面加载完成时间和所述预设加载时间；

[0094] 步骤S653，若所述页面加载完成时间大于所述预设加载时间，则输出提醒信息，以提升所述页面性能。

[0095] 在本实施例中，获取预设加载时间，其中，预设加载时间是指用户需求的加载时间，也可以是最优的页面加载所需时间，比对页面加载完成时间和预设加载时间，分析页面
性能，页面加载完成时间越短，则表示加载越快，页面性能越好。具体地，若页面加载完成时
间大于预设加载时间，表示本次页面在切换时的加载时间比预设加载时间长，初步判定页
面性能差，输出提醒信息，需要开发者或其他人员调整页面内容或资源加载内容，以提升页
面性能。需要说明的是，通过一次页面切换得到的页面加载完成时间的大小，不足以说明页
面性能差，因此，记录多次页面切换时的页面加载完成时间，综合多组数据，分析页面性能。

[0096] 在本实施例中，通过对第一监听器记录的文档对象模型变化列表，和第二监听器记录的静态资源列表进行数据分析和计算，得到页面加载完成时间，基于预设加载时间和
页面加载完成时间，初步分析页面性能，在得到页面性能较差的信息时，系统输出提醒信
息，以供人员调整页面切换时响应数据，以提升页面性能。

[0097] 本申请还提供一种页面加载分析装置，参照图3，所述页面加载分析装置包括：

[0098] 监听模块10，监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器，其中，所述第一监听器用于监听页面内容变化信息，所述第二监听器用于监听静态
资源加载信息；

[0099] 第一获取模块20，获取所述页面内容变化信息发生改变引起的文档对象模型的变化率，当所述变化率小于变化阈值时，确定所述页面切换结束；

[0100] 第一判断模块30，所述页面切换结束后，判断所述第二监听器监听的所述静态资源是否加载完成；

[0101] 输出模块40，若是，则所述页面加载完成，输出加载完成的信息并暂停所述第一监听器和所述第二监听器。

[0102] 可选的，所述页面加载分析装置包括：

[0103] 第二判断模块，判断所述第一监听器和所述第二监听器是否处于暂停状态；

[0104] 启动模块，若是，则执行所述监听页面切换接口，当发生页面切换行为时，启动第一监听器和第二监听器的步骤。

[0105] 可选的，所述获取模块20包括：

[0106] 第一控制子模块，当所述页面发生切换时，控制所述第一监听器监听和记录所述文档对象模型的变化率，得到第一变化率；

[0107] 第二控制子模块，控制所述第二监听器监听所述页面在资源加载时的所述文档对象模型的变化率，得到第二变化率；

[0108] 比对子模块，当所述第一变化率和所述第二变化率均小于变化阈值时，则所述页面切换结束。

[0109] 可选的，所述第二控制子模块包括：

[0110] 接收子单元，接收所述页面切换后的所述静态资源的加载请求；

[0111] 响应子单元，响应所述加载请求，加载所述静态资源，控制所述第二监听器监听所述文档对象模型的变化率，得到第二变化率。

[0112] 可选的，所述页面加载分析装置包括：

[0113] 调整模块，若否，调整所述变化阈值，以使所述静态资源加载完成的时间处于所述页面切换结束的时间范围内。

[0114] 可选的，所述页面加载分析装置包括：

[0115] 第二获取模块，获取所述页面加载完成过程中的所述第一监听器记录的文档对象模型变化列表，并获取所述第二监听器记录的静态资源列表；

[0116] 分析模块，对所述文档对象模型变化列表和所述静态资源列表进行分析计算，得到页面加载完成时间，以分析页面性能。

[0117] 可选的，所述分析模块包括：

[0118] 获取所述页面切换开始的时间，得到初始时间；

[0119] 第一确定子模块，确定所述文档对象模型变化列表中所述文档对象模型的增量最大的变化时间，得到第一时间；

[0120] 第二确定子模块，确定所述静态资源列表中所述静态资源加载完成时间，得到第二时间；

[0121] 计算子模块，获取所述第一时间和所述第二时间之间的最大时间，则计算所述初始时间至所述最大时间的时间范围，得到所述页面加载完成时间；

[0122] 分析子模块，基于所述页面加载完成时间，以分析所述页面性能。

[0123] 可选的，所述分析子模块包括：

[0124] 获取子单元，获取预设加载时间；

[0125] 比对子单元，比对所述页面加载完成时间和所述预设加载时间；

[0126] 输出子单元，若所述页面加载完成时间大于所述预设加载时间，则输出提醒信息，以提升所述页面性能。

[0127] 此外，本申请实施例还提出一种计算机可读存储介质，所述计算机可读存储介质上存储有页面加载分析程序，所述页面加载分析程序被处理器执行时实现如上所述的页面
加载分析方法的步骤。

[0128] 本申请计算机可读存储介质具体实施方式与上述页面加载分析方法各实施例基本相同，在此不再赘述。

[0129] 需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者系统不仅包括那些要素，而
且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者系统所固有
的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该
要素的过程、方法、物品或者系统中还存在另外的相同要素。

[0130] 上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。

[0131] 通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下
前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做
出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在如上所述的一个
存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，
计算机，服务器，或者网络设备等)执行本发明各个实施例所述的方法。

[0132] 以上仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技
术领域，均同理包括在本发明的专利保护范围内。