UIWebView和WKWebView的对比
1.UIWebView和WKWebView
UIWebView
1)UIWebView是iOS2就有了的,占用内存也比较多,内存峰值也挺夸张的
2)UIWebView继承自UIView 是用来加载网页的类,可以简单理解成就是一个view
WKWebView
1)相比UIWebView的话,支持更多的HTML5的特性
2)滚动刷新率在60fps以及内置手势
3)添加了加载进度属性:estimatedProgress
4)和Safari想听的JavaScript引擎
WKWebView的流程
在发送请求之前决定是否跳转 --> 第一次进入页面 --> 页面开始加载时调用 --> 收到服务器跳转请求之后执行 --> 收到服务器跳转请求之后再执行 --> 收到响应后决定是否跳转 --> 内容开始返回时调用 --> 页面加载完成之后调用
之后进入页面 --> 在发送请求之前决定是否跳转 --> 收到服务器跳转请求之后执行 --> 收到服务器跳转请求之后再执行 --> 收到响应后决定是否跳转 --> 内容开始返回时调用 --> 页面加载完成之后调用
在开发过程中会经常遇到网页加载慢的现象,原因有：网速过慢，大图渲染，图片异步下载等，只要与线程异步处理有关都是，设备系统只是影响用户体验度。
OC和JS的交互方式
WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init];
WKUserContentController *userController = [[WKUserContentController alloc] init];
config.preferences.javaScriptEnabled = YES;
config.userContentController = userController;
[userController addScriptMessageHandler:self name:@"callbackNative"];
WKWebView *web = [[WKWebView alloc] initWithFrame:CGRectMake(0, TOPBAR_H,SCREEN_W,SCREEN_H - TOPBAR_H) configuration:config];
self.webView = web;
web.UIDelegate = self;
web.navigationDelegate = self;
[web loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:self.urlStr]]];
[self.view addSubview:web];
#pragma mark - 处理与js交互回调
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
{
//message中包含了js中所有的信息
//有两个重要的属性，一个是name，进行区分判断具体响应某个方法
//body中就是js传过来的参数
if ([message.name isEqualToString:@"callbackNative"]) {
NSLog(@"----%@\n----%@\n-----%@",message,message.body,message.frameInfo);
id obj = [NSJSONSerialization JSONObjectWithData:[message.body dataUsingEncoding:NSUTF8StringEncoding] options:NSJSONReadingAllowFragments error:nil];
NSDictionary *dict = obj;
}
}
网页内部也会进行一些处理方式,比如goback, [self.webview reload]等操作
在具体落实开发详情页面,会使用到网页进行加载,需要的就是计算webview的高度,再计算scrollView的高度,计算webview的高度就很耗时,因为网页是需要全部展示出来后才会去计算高度的,先算高度,再展示网页的文字,再展示网页的图片,图片可以慢慢缓存后再显示,这样的话不至于白屏时间过长
第一步：添加观察者
[_webView.scrollViewaddObserver:selfforKeyPath:@"contentSize"options:NSKeyValueObservingOptionNewcontext:nil];
第二步：观察者监听webView的contentSize变化
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void*)context {
if ([keyPathisEqualToString:@"contentSize"]) {
dispatch_async(dispatch_get_global_queue(0,0), ^{
//document.documentElement.scrollHeight
//document.body.offsetHeight
[_webViewevaluateJavaScript:@"document.documentElement.offsetHeight"completionHandler:^(id_Nullable result,NSError * _Nullable error) {
CGRect frame =_webView.frame;
frame.size.height = [resultdoubleValue] + 50;
_webView.frame = frame;
_scrollViewHeight =220 + _webView.height;
_scrollView.contentSize =CGSizeMake(kScreenWidth,_scrollViewHeight);
}];
});
}
}
第三步：移除观察者
- (void)dealloc
{
[_webView.scrollViewremoveObserver:selfforKeyPath:@"contentSize"];
}