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

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

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

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

核心dom校驗

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

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

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

局部dom校驗

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

算法優(yōu)化

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

其他分析

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

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

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

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

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

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/80029.html

相關(guān)文章

【page-monitor 前端自動化 中篇】源碼分析

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

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

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

light 2019-08-20 10:11 評論0 收藏0
前端20個靈魂拷問徹底搞明白你就是中級前端工程師【下篇】

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

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

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

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

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

lixiang 2019-04-23 13:22 評論0 收藏0