页面组件的运行监测方法、装置、设备和存储介质制造方法及图纸

本申请实施例公开了一种页面组件的运行监测方法、装置、设备和存储介质，涉及页面组件监测和云计算技术领域。具体实现方案为：对页面组件的多个生命周期函数进行调用监测；每当监测到调用，则对调用的生命周期函数，确定调用时刻；根据所述页面组件的所述多个生命周期函数的调用时刻，监测所述页面组件的运行。本申请实施例能够提高异常处理效率。

【技术实现步骤摘要】
页面组件的运行监测方法、装置、设备和存储介质
本申请涉及计算机
，尤其涉及页面组件监测和云计算
，具体涉及一种页面组件的运行监测方法、装置、设备和存储介质。
技术介绍
San是一个MVVM(Model-View-ViewModel)组件框架。它体积小巧(11K)，兼容性好(IE6)，性能卓越，是一个可靠、可依赖的实现响应式用户界面的解决方案。通常，San中定义的数据会被封装，使得当数据发生有效变更时通知San组件(页面组件)，页面组件依赖模板编译阶段生成的节点关系树，确定需要变更的最小视图，进而完成视图的异步更新，保证了视图更新的高效性。然而，页面组件运行过程中会出现异常，因此亟需一种监测页面组件运行过程的方案。
技术实现思路
本申请提供了一种页面组件的运行监测方法、装置、设备和存储介质，提供了一种对页面组件的运行监测方案，从而页面组件运行过程中发生异常时，能够还原发生异常时的场景及用户操作行为，为定位问题、解决问题提供了条件，提高了异常处理效率。第一方面，本申请实施例提供了一种页面组件的运行监测方法，包括：对页面组件的多个生命周期函数进行调用监测；每当监测到调用，则对调用的生命周期函数，确定调用时刻；根据所述页面组件的所述多个生命周期函数的调用时刻，监测所述页面组件的运行。第二方面，本申请实施例提供了一种页面组件的运行监测装置，包括：第一监测模块，用于对页面组件的多个生命周期函数进行调用监测；确定模块，用于每当监测到调用，则对调用的生命周期函数，确定调用时刻；第二监测模块，用于根据所述页面组件的所述多个生命周期函数的调用时刻，监测所述页面组件的运行。第三方面，本申请实施例提供了一种电子设备，该电子设备包括：至少一个处理器；以及与所述至少一个处理器通信连接的存储器；其中，所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行如本申请实施例中任一项所述的页面组件的运行监测方法。第四方面，本申请实施例提供了一种存储有计算机指令的非瞬时计算机可读存储介质，所述计算机指令用于使所述计算机执行如本申请实施例中任一项所述的页面组件的运行监测方法。本申请实施例能够提高异常处理效率。应当理解，本部分所描述的内容并非旨在标识本申请的实施例的关键或重要特征，也不用于限制本申请的范围。本申请的其它特征将通过以下的说明书而变得容易理解。附图说明附图用于更好地理解本方案，不构成对本申请的限定。其中：图1是本申请实施例提供的一种页面组件的运行监测方法的流程示意图；图2是根据本申请实施例提供的另一种页面组件的运行监测方法的流程示意图；图3是根据本申请实施例提供的一种生成运行监测数据的流程示意图；图4是根据本申请实施例提供的一种页面组件的整个运行过程的示意图；图5是根据本申请实施例提供的一种页面组件的运行监测装置的结构示意图；图6是用来实现本申请实施例的页面组件的运行监测方法的电子设备的框图。具体实施方式以下结合附图对本申请的示范性实施例做出说明，其中包括本申请实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本申请的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。下面具体参照附图描述本申请实施例提供的一种页面组件的运行监测方法、装置、设备和存储介质，首先参照附图1描述本申请实施例提供的一种页面组件的运行监测方法。图1是本申请实施例提供的一种页面组件的运行监测方法的流程示意图，参见图1，该方法包括以下步骤：S101，对页面组件的多个生命周期函数进行调用监测。其中，本实施例提供的页面组件的运行监测方法，可以由本申请实施例提供的页面组件的运行监测装置执行，该装置可以配置于电子设备中，以对页面组件的运行过程进行监测。在本专利技术实施例中，页面组件是指san框架中的san组件。san组件的多个生命周期函数可包括：compiled函数、inited函数、created函数、attached函数、detached函数、disposed函数和updated函数，总共7个生命周期函数。其中，compiled表示组件视图模板编译完成；inited表示组件实例初始化完成；created表示组件元素创建完成；attached表示组件已被附加到页面中；updated表示组件数据更新；detached表示组件从页面中移除；disposed表示组件卸载完成。例如，当组件编译完成后会调用compiled函数；组件挂载到页面中会调用attached函数；组件从页面卸载会调用disposed函数。可选的，可通过预设的生命周期函数监测器，对页面组件的多个生命周期函数进行调用监测；或者，监测页面组件的多个生命周期函数是否被使用，对页面组件的多个生命周期函数进行调用监测等，此处对其不作具体限定。S102，每当监测到调用，则对调用的生命周期函数，确定调用时刻。可选的，页面组件中多个生命周期函数可随时被调用，且被调用对应存在一时刻，因此当检测到任意生命周期函数被调用时，可确定调用的生命周期函数的调用时刻。作为一种可选的实现方式，可确定生命周期函数被调用时的调用时刻，可通过使用浏览器提供的应用程序接口(performanceApi)来记录调用生命周期函数调用时刻。例如，当监测到生命周期函数compiled函数和attached函数调用时，可基于浏览器提供的performanceApi，分别记录调用生命周期函数调用时刻。进一步的，为了方便确定生命周期函数的调用时刻，本申请实施例基于浏览器提供的应用接口记录调用生命周期函数的调用时刻时，还可使用标记函数标记生命周期函数的调用时刻。在本实施例中，标记函数可为performance.mark()。也就是说，本实施例中对调用的生命周期函数，确定调用时刻，包括：调用浏览器提供的应用程序接口，采用所述应用程序接口内的标记函数标记对所述生命周期函数的调用时刻，以基于标记函数能够快速且准确的确定生命周期的调用时刻。S103，根据所述页面组件的所述多个生命周期函数的调用时刻，监测所述页面组件的运行。可选的，确定出页面组件中多个生命周期函数的调用时刻之后，本实施例可通过使用JavaScript语言的新标准(ES6)提供的装饰器(decorator)重写页面组件生命周期函数，在每个生命周期函数调用时都会记录生命周期函数调用时刻，进而根据生命周期的调用时刻，分析页面组件的运行性能，进而确定页面组件运行过程中是否出现异常。本申请实施例的技术方案，通过对页面组件的多个生命周期函数进行调用监测，每当监测到调用，则对调用的生命周期函数，确定调用时刻，然后根据页面组件的多个生命周期本文档来自技高网...

【技术保护点】
1.一种页面组件的运行监测方法，包括：/n对页面组件的多个生命周期函数进行调用监测；/n每当监测到调用，则对调用的生命周期函数，确定调用时刻；/n根据所述页面组件的所述多个生命周期函数的调用时刻，监测所述页面组件的运行。/n

【技术特征摘要】
1.一种页面组件的运行监测方法，包括：
对页面组件的多个生命周期函数进行调用监测；
每当监测到调用，则对调用的生命周期函数，确定调用时刻；
根据所述页面组件的所述多个生命周期函数的调用时刻，监测所述页面组件的运行。


2.根据权利要求1所述的运行监测方法，其中，所述多个生命周期函数中包括用于对所述页面组件进行卸载的卸载函数；所述根据所述页面组件的所述多个生命周期函数的调用时刻，监测所述页面组件的运行，包括：
当监测到对所述卸载函数的调用，则根据已监测到的各所述生命周期函数的调用时刻，生成运行监测数据；
向服务器端发送所述运行监测数据。


3.根据权利要求2所述的运行监测方法，其中，所述根据已监测到的各所述生命周期函数的调用时刻，生成运行监测数据，包括：
根据已监测到的各所述生命周期函数的调用时刻，确定设定两生命周期函数之间的调用时刻间隔；
将所述设定两生命周期函数之间的调用时刻间隔，作为所述运行监测数据。


4.根据权利要求3所述的运行监测方法，其中，所述根据已监测到的各所述生命周期函数的调用时刻，确定设定两生命周期函数之间的调用时刻间隔，包括：
调用浏览器提供的应用程序接口，采用所述应用程序接口内的统计函数对所述设定两生命周期函数的调用时刻进行统计，以得到所述设定两生命周期函数之间的调用时刻间隔。


5.根据权利要求3所述的运行监测方法，其中，所述设定两生命周期函数为多组，其中一组所述设定两生命周期函数分别用于将所述页面组件加载到页面中，以及对所述页面组件的视图模板编译。


6.根据权利要求1-5任一项所述的运行监测方法，其中，所述对调用的生命周期函数，确定调用时刻，包括：
调用浏览器提供的应用程序接口，采用所述应用程序接口内的标记函数标记对所述生命周期函数的调用时刻。


7.一种页面组件的运行监测装置，包括：
第一监测模块，用于对页面组件的多个生命周期函数进行调用监测；
确定模块，用于每当监测到调用，则对调用的生命周期函数，确定调用时刻；

【专利技术属性】
技术研发人员：谷云龙，
申请(专利权)人：北京百度网讯科技有限公司，
类型：发明
国别省市：北京;11