Boost your iOS 8 Mobile App Performance with WKWebView

November 10, 2014By 4 Comments

ios8
If you build hybrid apps using PhoneGap/Cordova for iOS, you are likely aware that Apple recently announced a new WKWebView for iOS 8 which has major performance optimizations over the UIWebView including access to the Nitro JIT JavaScript engine. Benchmark tests with Nitrous enabled report a 40%-80% performance spike. (See this link for more details). Unfortunately this new WKWebView had some initial issues that needed to be resolved for PhoneGap/Cordova to be supported with it due to the reasons explained here by resident iOS expert Shazron (essentially an issue with loading local file URLs). Apple has actually fixed this bug, but it’s not yet been released and a target release date is unknown.

WKWebView Plugin

In the meantime there’s a new option (self-proclaimed hack) available to try. Eddy Verbruggen (author of the Social Sharing Plugin and many other useful Cordova plugins) created a WKWebView plugin that uses the WKWebView rather than the UIWebView and includes code to fix the local file loading issue. A screenshot from his demo app running a performance test in the standard Hello World app using the new plugin versus without it is shown below. Notice the difference in FPS (frames per second) and CPU by using this plugin:

UIWebView-vs-WKWebView

I tried out Eddy’s plugin on my iPhone 6 running iOS 8.1 and saw similar FPS and CPU results to the screenshots above when including the plugin vs without it (defaulting to the standard UIWebView), pretty awesome!! Some of the community folks have been testing it with different types of apps (including some built with Ionic) as well and after a couple issues have been worked out, it seems to be providing great results to many and is an option for folks to consider until the Apple fix is released. The plugin is also supported on the iOS 8 simulator and simply defaults back to the UIWebView on iOS 7 and lower. Please keep in mind this plugin is new and beta currently and you can report any issues found to the issue tracker.

How does it work?

To summarize how this works, the plugin includes an AppDelegate+WKWebViewPolyfill class that checks to see if the app is running on iOS8 and if so will use a different ViewController with the WKWebView instead of the UIWebView as it’s WebView UI delegate. This is done via method swizzling (changing implementation at runtime) as shown in the code snippet below:

@implementation AppDelegate (WKWebViewPolyfill)

+ (void)load {
  // swap in our own viewcontroller which loads the wkwebview, but only in case we're running iOS 8+
  if (IsAtLeastiOSVersion(@"8.0")) {
    swizzleMethod([AppDelegate class],
                  @selector(application:didFinishLaunchingWithOptions:),
                  @selector(my_application:didFinishLaunchingWithOptions:));
  }
}

To learn all about the WKWebView, check out this in-depth informative post by Mattt Thomspon. Some interesting and inspirational quotes from the article are included below. :)

It’s a dirty secret that some stock apps like Messages use WebKit to render tricky content. The fact that you probably haven’t noticed should be an indicator that web views actually have a place in app development best practices.

If your app is little more than a thin container around web content, WKWebView is a game-changer. All of that performance and compatibility that you’ve longed for is finally available. It’s everything you might have hoped for.

Useful Links

Filed in: CordovaiOSMobile DevelopmentPhoneGap Tags:

About the Author ()

Comments (4)

Trackback URL | Comments RSS Feed

  1. Timothy Nott says:

    Can’t wait to take this for a test drive. Hoping to drop it into a client build this afternoon. I’ll bet they notice…

  2. Bernardo says:

    Hi Holly, nice article!
    Any ideas if it’s possible to set “AllowUniversalAccessFromFileURLs” in WKWebView preferences as it’s possible with the old WebView?

    Thanks.

Leave a Reply