【page-monitor 前端自動(dòng)化下篇】實(shí)踐應(yīng)用

PAMPANG 發(fā)布于2019-08-20 10:11 / 2018人閱讀

摘要：貼一個(gè)細(xì)節(jié)圖其他分析小拽通過(guò)上面的舉例，旨在拋磚引玉，希望或者結(jié)構(gòu)在前端的自動(dòng)化測(cè)試有一定應(yīng)用，提升產(chǎn)品質(zhì)量。最終再上一張流程圖，便于分析相關(guān)文章前端自動(dòng)化上篇初步調(diào)研前端自動(dòng)化中篇源碼分析

通過(guò)page-diff的初步調(diào)研和源碼分析，確定page-diff在前端自動(dòng)化測(cè)試和監(jiān)控方面做一些事情。本篇主要介紹下，page-diff在具體的實(shí)踐中的一些應(yīng)用

核心dom校驗(yàn)

前端的快速發(fā)展，造成前端dom無(wú)論結(jié)構(gòu)還是命名經(jīng)常變化，每次都盡可能關(guān)注每個(gè)dom的變化，不可能也沒(méi)有必要。但是核心dom是相對(duì)變化較小，但是比較重要，因此可以利用page-monitor 修改關(guān)注結(jié)構(gòu)中的核心代碼，核心架構(gòu)的變化。

上圖是未修改的代碼，下圖是忽略footer內(nèi)部變化

實(shí)踐中可以針對(duì)自身的核心dom進(jìn)行進(jìn)一步優(yōu)化

局部dom校驗(yàn)

項(xiàng)目中，往往在某一時(shí)期特別關(guān)心某些板塊，或者某些板塊相對(duì)容易出錯(cuò)；因此，可以利用page-monitor 進(jìn)行局部dom的細(xì)節(jié)diff。中篇中對(duì)只針對(duì)header進(jìn)行對(duì)比diff做了詳細(xì)介紹，此處不贅述，上圖。

算法優(yōu)化

由于獲取了完整了dom的json，因此可以通過(guò)相關(guān)閾值的設(shè)定或者算法的優(yōu)化；來(lái)對(duì)比結(jié)果，進(jìn)行更加優(yōu)化的分級(jí)預(yù)警和分析；作者一般對(duì)非核心預(yù)警超過(guò)15%變化會(huì)做出預(yù)警，超過(guò)更高閾值會(huì)進(jìn)一步的預(yù)警等等。
貼一個(gè)dom 細(xì)節(jié)圖

其他分析

小拽通過(guò)上面的舉例，旨在拋磚引玉，希望page-monitor或者dom結(jié)構(gòu)在前端的自動(dòng)化測(cè)試有一定應(yīng)用，提升產(chǎn)品質(zhì)量。

最終再上一張流程圖，便于分析

相關(guān)文章：
【page-monitor 前端自動(dòng)化上篇】初步調(diào)研
【page-monitor 前端自動(dòng)化中篇】源碼分析

GPU云服務(wù)器云服務(wù)器前端自動(dòng)化 web前端自動(dòng)化測(cè)試前端應(yīng)用程序服務(wù)器應(yīng)用池自動(dòng)關(guān)閉

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/80029.html

相關(guān)文章

【page-monitor 前端自動(dòng)化 中篇】源碼分析

摘要：上篇中初探了的一些功能和在前端自動(dòng)化測(cè)試方面的可行性，本篇主要分析下的實(shí)現(xiàn)方式和源碼。文件分析完整文件目錄運(yùn)行生成目錄分析出了及其組件代碼，可用和值的分析的文件和下面的五個(gè)文件。相關(guān)文章前端自動(dòng)化上篇初步調(diào)研前端自動(dòng)化下篇實(shí)踐應(yīng)用上篇中初探了page-monitor的一些功能和在前端自動(dòng)化測(cè)試方面的可行性，本篇主要分析下page-monitor的實(shí)現(xiàn)方式和源碼。 mode-modul...

Object 2019-08-20 10:11 評(píng)論0 收藏0
【page-monitor 前端自動(dòng)化 上篇】初步調(diào)研

摘要：前端自動(dòng)化測(cè)試主要在于變化快，不穩(wěn)定，兼容性復(fù)雜故而，想通過(guò)較低的成本維護(hù)較為通用的自動(dòng)化比較困難。本文旨在通過(guò)獲取和分析結(jié)構(gòu)，調(diào)研能否通過(guò)監(jiān)控和分析核心，來(lái)進(jìn)行前端自動(dòng)化測(cè)試。相關(guān)文章前端自動(dòng)化中篇源碼分析前端自動(dòng)化下篇實(shí)踐應(yīng)用前端自動(dòng)化測(cè)試主要在于：變化快，不穩(wěn)定，兼容性復(fù)雜；故而，想通過(guò)較低的成本維護(hù)較為通用的自動(dòng)化case比較困難。本文旨在通過(guò)page-monitor獲取和分...

light 2019-08-20 10:11 評(píng)論0 收藏0
前端20個(gè)靈魂拷問(wèn) 徹底搞明白你就是中級(jí)前端工程師【下篇】

摘要：安裝后已經(jīng)完成了安裝，并且等待其他的線程被關(guān)閉。激活后在這個(gè)狀態(tài)會(huì)處理事件回調(diào)提供了更新緩存策略的機(jī)會(huì)。并可以處理功能性的事件請(qǐng)求后臺(tái)同步推送。廢棄狀態(tài)這個(gè)狀態(tài)表示一個(gè)的生命周期結(jié)束。 showImg(https://segmentfault.com/img/bVbwWJu?w=2056&h=1536); 不知不覺(jué)，已經(jīng)來(lái)到了最后的下篇其實(shí)我寫的東西你如果認(rèn)真去看，跟著去寫，應(yīng)該能有...

fireflow 2019-08-30 15:44 評(píng)論0 收藏0
自從我這樣擼代碼以后，公司網(wǎng)頁(yè)的瀏覽量提高了107%！

摘要：假如我們底層的連接得到重用，這時(shí)候的情況會(huì)是這樣子很明顯，在獲取的請(qǐng)求中，減少了一次握手往返。在使用持久連接后，避免了一次握手往返總延遲減少為。其代價(jià)往往是不能充分利用網(wǎng)絡(luò)連接，造成服務(wù)器緩沖開(kāi)銷，有可能導(dǎo)致客戶端更大的延遲。歡迎大家前往騰訊云+社區(qū)，獲取更多騰訊海量技術(shù)實(shí)踐干貨哦~ 本文由騰訊IVWEB團(tuán)隊(duì) 發(fā)表于云+社區(qū)專欄作者：yangchunwen HTTP協(xié)議是前端性能乃...

sutaking 2019-08-02 16:06 評(píng)論0 收藏0
自從我這樣擼代碼以后，公司網(wǎng)頁(yè)的瀏覽量提高了107%！

摘要：假如我們底層的連接得到重用，這時(shí)候的情況會(huì)是這樣子很明顯，在獲取的請(qǐng)求中，減少了一次握手往返。在使用持久連接后，避免了一次握手往返總延遲減少為。其代價(jià)往往是不能充分利用網(wǎng)絡(luò)連接，造成服務(wù)器緩沖開(kāi)銷，有可能導(dǎo)致客戶端更大的延遲。歡迎大家前往騰訊云+社區(qū)，獲取更多騰訊海量技術(shù)實(shí)踐干貨哦~ 本文由騰訊IVWEB團(tuán)隊(duì)發(fā)表于云+社區(qū)專欄作者：yangchunwen HTTP協(xié)議是前端性能乃至...

lixiang 2019-04-23 13:22 評(píng)論0 收藏0