软件测试之SDK开发(ios)——webview性能监控

最近在项目里发现webview里面的h5游戏经常白屏，所以需要对webview的性能进行监控。

以WKWebView为例，在实际的工程项目里，通常会实现WKNavigationDelegate协议，已实现对webview更多功能的定制。比如在我们自己的项目里引入的是腾讯开源的SonicWebView，遵守WKNavigationDelegate协议，覆写-(void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation方法，在webview加载完成后，对数据进行上报和处理。

而对webview性能监控的思路就是hook webview加载完成的回调函数，在WKWebView中就是-(void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation，通过执行window.performance.timingjs代码获取当前页面与性能相关的信息。

对于WKNavigationDelegate，通常是由业务方指定，是不确定的。Method swizzling替换方法需要指定类名，不适合这种场景。使用NSProxy可以解决上面的问题。具体实现：proxy delegate替换WKWebView原来的delegate，当proxy delegate收到回调时，如果是要hook的方法，则调用proxy的实现，proxy的实现最后会调用原来的delegate；如果不是要hook的方法，则通过消息转发机制将消息转发给原来的delegate。

最后实现效果如下图所示：

点击白屏时间cell，进入如下页面

在该页面，首先给出了白屏时间的各个时间段的耗时和计算方式。并在下面给出了window.performance.timing各个事件发生的时间点，各个事件点的含义如下所示：

1. navigationStart：浏览器处理当前网页的启动时间
2. fetchStart：浏览器发起http请求读取文档的毫秒时间戳。
3. domainLookupStart：域名查询开始时的时间戳。
4. domainLookupEnd：域名查询结束时的时间戳。
5. connectStart：http请求开始向服务器发送的时间戳。
6. connectEnd：浏览器与服务器连接建立（握手和认证过程结束）的毫秒时间戳。
7. requestStart：浏览器向服务器发出http请求时的时间戳。或者开始读取本地缓存时。
8. responseStart：浏览器从服务器（或读取本地缓存）收到第一个字节时的时间戳。
9. responseEnd：浏览器从服务器收到最后一个字节时的毫秒时间戳。
10. domLoading：浏览器开始解析网页DOM结构的时间。
11. domInteractive：网页dom树创建完成，开始加载内嵌资源的时间。
12. domContentLoadedEventStart：网页DOMContentLoaded事件发生时的时间戳。
13. domContentLoadedEventEnd：网页所有需要执行的脚本执行完成时的时间，domReady的时间。
14. domComplete：网页dom结构生成时的时间戳。
15. loadEventStart：当前网页load事件的回调函数开始执行的时间戳。
16. loadEventEnd：当前网页load事件的回调函数结束运行时的时间戳。

参考文章

1、https://github.com/aozhimin/iOS-Monitor-Platform#network
2、https://github.com/didiaodanding/NetworkTracker
3、https://www.cnblogs.com/anywherego/p/11236233.html
4、https://www.jianshu.com/p/1c34147030d1
5、https://lz5z.com/Web%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96-%E9%A6%96%E5%B1%8F%E5%92%8C%E7%99%BD%E5%B1%8F%E6%97%B6%E9%97%B4/
6、http://zhangxiang958.github.io/2017/05/20/%E7%BB%86%E8%AF%B4%20window.performance/