移动端iOSH5性能监控技术角度分析

性能数据了解

     分析移动端H5性能数据，首先我们说说是哪些性能数据。白屏时间，白屏时间无论安卓还是iOS在加载网页的时候都会存在的问题，也是目前无法解决的；页面耗时，页面耗时指的是开始加载这个网页到整个页面load完成即渲染完成的时间；还有加载链接的一些性能数据，重定向时间，DNS解析时间，TCP链接时间，request请求时间，response响应时间，dom节点解析时间，page渲染时间，同时我们还需要抓取资源时序数据，什么是资源时序数据呢？每个网页是有很多个资源组成的，有.js、.png、.css、.script等等，我们就需要将这些每个资源链接的耗时拿到，是什么类型的资源，完整链接；对于客户来说有了这些还不够，还需要JS错误，页面的ajax请求。JS错误获取的当然是堆栈信息和错误类型。ajax请求一般是获取三个时间，响应时间，ajax下载时间，ajax回调时间。

      上面分析的是能够获取到移动端H5的性能数据，这些数据怎么得到就是接下来要讲的了。数据获取是需要js来做的，都知道移动端是通过webView来加载网页的，js里面能通过performance这个接口来从webView内部api获取上面的那些数据，js获取的数据然后发给OC；那JS怎么样才能拿到这些数据呢，这就是最关键的，OC代码如何写才能让JS获取数据。

代码编写

有两种方法可以得到数据,先介绍用NSURLProtocol这个类获取数据。

iOS的UIWebView加载网页的时候会走进NSURLProtocol这个类,所以我们就需要在这个类里面作文章了,我们先用UIWebView加载一个链接，例如百度等等,然后创建一个继承NSURLProtocol的类。

继承NSURLProtocol

NSURLProtocol里面有很多方法，就不一一介绍了，有一个startLoading的方法,我们在这个方法里面用NSURLConnection发送一个请求,设置代理,请求的request就是加载网页的request，因为NSURLProtocol有一个NSURLRequest的属性。

- (instancetype)initWithRequest:(NSURLRequest*)request delegate:(id)delegate startImmediately:(BOOL)startImmediately

这个就是请求的方法。

发送请求

- (void)connection:(NSURLConnection *)connection didReceiveData:(NSData *)data

通过NSURLConnection设置代理,就需要写出代理方法，在其中一个代理方法里面能获得网页的代码，这就是我们最关键的地方，就是上面这个方法，将data用utf-8转码就会得到代码。

插入js代码的方法

得到网页的代码有什么用呢？熟悉网页端代码的都知道，网页端的代码都是由很多标签组成,我们先找到这个标签，在下面插入一个