巧用WebView監(jiān)控提升WebAPP整體性能

相對于需要專業(yè)移動開發(fā)人員的原生應(yīng)用(Native APP)，基于HTML5/CSS/JavaScript的WebAPP憑借開發(fā)者門檻低、迭代迅速、支持跨平臺發(fā)布等特點(diǎn)，成為電商、銀行等網(wǎng)絡(luò)服務(wù)、瀏覽類應(yīng)用的選，然而由于頁面渲染導(dǎo)致的性能差距是WebAPP與原生應(yīng)用無法抗衡的大原因，因此針對WebView組件的性能優(yōu)化就顯得至關(guān)重要。

為什么是WebView

WebAPP所顯示的Web頁面都是由一個叫做WebView的組件渲染出來的，每個網(wǎng)頁都有一個鏈接即URL，首先將URL轉(zhuǎn)換成NSURLRequest，然后用加載網(wǎng)頁的類WebView加載Request，使用- (void)loadRequest:(NSURLRequest *)request這個方法，就能將網(wǎng)頁加載顯示出來。

目前iOS中有兩個加載網(wǎng)頁的類，分別是UIWebView和WKWebView，UIWebView是UIKit框架中的一個類，而WKWebView是WebKit框架中的類，從性能上來說WKWebView的性能高、穩(wěn)定性好、占用內(nèi)存小，完全優(yōu)于UIWebView。但由于WKWebView是iOS8提供的組件，因此系統(tǒng)版本低于iOS 8.0的iPhone/iPad用戶就無法正常使用WKWebView組件開發(fā)出來的APP。所以目前大部分開發(fā)人員還在使用性能、穩(wěn)定性并不理想的UIWebView進(jìn)行WebAPP開發(fā)，而本文所說的云智慧透視寶WebView性能監(jiān)控也是以UIWebView為主要優(yōu)化目標(biāo)。

要進(jìn)行性能監(jiān)控必須獲得WebAPP頁面加載全過程的性能數(shù)據(jù)，透視寶是通過向當(dāng)前加載鏈接的html5、jsp、php網(wǎng)頁代碼中注入獲取數(shù)據(jù)的JS代碼，然后通過OC與JS交互，將數(shù)據(jù)傳遞給OC，然后再將數(shù)據(jù)整理發(fā)送到透視寶后端。

監(jiān)控哪些WebView性能數(shù)據(jù)

透視寶能監(jiān)控四大類數(shù)據(jù)：

行為數(shù)據(jù)：抓取用戶在移動端網(wǎng)頁點(diǎn)的行為操作，也就是點(diǎn)擊網(wǎng)頁的內(nèi)容，分析用的戶行為

時間相應(yīng)數(shù)據(jù)：分解一個鏈接從加載開始到完成這段時間內(nèi)，每個階段的耗時

Ajax請求數(shù)據(jù)：抓取終端用戶響應(yīng)時間，響應(yīng)數(shù)據(jù)下載時間，數(shù)據(jù)響應(yīng)成功的callback執(zhí)行時間和ajax錯誤數(shù)據(jù)

JS錯誤數(shù)據(jù)：抓取加載鏈接的代碼錯誤信息

①時間響應(yīng)數(shù)據(jù)及數(shù)據(jù)計算公式

參見上圖，JS傳給透視寶的時間響應(yīng)數(shù)據(jù)就是這些字段，其中navigationStart是起點(diǎn)，所有的計算都需要依賴與它。分析移動端H5性能數(shù)據(jù)，其實(shí)就是測算HTML5、JSP、PHP等網(wǎng)頁元素在iOS上加載的時間長短，通過這些性能數(shù)據(jù)前段開發(fā)人員能夠準(zhǔn)確發(fā)現(xiàn)性能問題并及時解決，下表是透視寶定義的響應(yīng)時間分解數(shù)據(jù)及計算方案：

②資源時序數(shù)據(jù)

每一個網(wǎng)頁都是有很多資源組成的，包括.js、.png、.jpg、.css、script等，每一個元素的加載都需要加載時間，資源時序數(shù)據(jù)就是準(zhǔn)確記錄每一個元素的加載時間及類型，并把這些數(shù)據(jù)通過JS的performance接口直接獲得并傳給OC，不需要計算。

③JS錯誤及ajax請求數(shù)據(jù)

JS錯誤指的是抓取網(wǎng)頁代碼的錯誤，包括錯誤類型及堆棧信息，直接定位錯誤。ajax請求的數(shù)據(jù)有請求的鏈接、uri、終端用戶響應(yīng)時間，響應(yīng)數(shù)據(jù)下載時間，數(shù)據(jù)響應(yīng)成功的callback執(zhí)行時間和ajax錯誤數(shù)據(jù)。JS錯誤和ajax請求數(shù)據(jù)都是有JS代碼直接獲取到，不需要處理。

JS代碼注入

想要準(zhǔn)確監(jiān)測網(wǎng)頁性能就需要進(jìn)行代碼注入，而只有拿到網(wǎng)頁的代碼才能注入，UIWebView這個類里面除了三個加載鏈接的方法和4個代理方法，就沒有其他內(nèi)容了，而這些方法并不能獲取到內(nèi)容，所以我們就需要考慮其他方法。UIWebView在加載攔截的時候會進(jìn)入NSURLProtocol這個類，而恰好這個類能拿到當(dāng)前加載鏈接NSURLRequest，而且會走進(jìn)這個類的- (void)startLoading方法，這個方法在頁面load完成之前，頁面剛加載之后，所以就是我們所需要的。

創(chuàng)建一個類，繼承NSURLProtocol這個類，重寫startLoading方法，由于能拿到鏈接的request，所以我們就對這個鏈接發(fā)送請求，用原生態(tài)的NSURLConnection或者NSURLSession都可以，我們用的NSURLConnection這個類發(fā)送請求并設(shè)置代理，方法是這個- (nullableinstancetype)initWithRequest:(NSURLRequest*)request delegate:(nullableid)delegate startImmediately:(BOOL)startImmediately，

NSURLConnection的代理方法中有一個能接受請求鏈接數(shù)據(jù)的方法，- (void)connection:(NSURLConnection *)connection didReceiveData:(NSData *)data，得到的NSData是16進(jìn)制的字節(jié)流數(shù)據(jù)，通過utf8轉(zhuǎn)碼將字節(jié)流轉(zhuǎn)換成字符串，然后發(fā)現(xiàn)這個字符串正好是這個當(dāng)前加載網(wǎng)頁的代碼，

網(wǎng)站名稱：巧用WebView監(jiān)控提升WebAPP整體性能
網(wǎng)站網(wǎng)址：http://www.muchs.cn/news34/261034.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供虛擬主機(jī)、企業(yè)建站、微信公眾號、App設(shè)計、關(guān)鍵詞優(yōu)化、Google

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)