Me!

TJ VanToll

Speed Up Your Cordova App with the WKWebView Plugin

| Comments

I woke up this morning to discover that the Telerik marketplace had a new WKWebView plugin:

I had written about the performance benefits of WKWebView before, and Eddy Verbruggen—the author of the WKWebView plugin—has done some performance benchmarks as well, so I knew the plugin would give a performance boost, but I had to see the benefits for myself.

So I did. I added the plugin to a few Cordova projects with cordova plugin add https://github.com/Telerik-Verified-Plugins/WKWebView and to a few AppBuilder ones with appbuilder plugin add "WKWebView Polyfill" --release.

  • The --release flag is necessary because the WKWebView plugin currently conflicts with AppBuilder's LiveSync functionality. LiveSync is only included on debug builds, so the --release flag avoids the conflict. This does mean that you need to perform builds that also include the --release flag to test the WKWebView—e.g. appbuilder build ios --release or appbuilder deploy ios --release.
  • AppBuilder apps must run Cordova 3.7 to take advantage of the WKWebView plugin. You can check which version of Cordova your AppBuilder app uses with appbuilder prop print FrameworkVersion, and change it to 3.7 with appbuilder prop set FrameworkVersion 3.7.0.

Installation is the only step to run the WKWebView plugin, which is pretty awesome. You just build your app with the plugin installed and that’s it.

I could immediately tell that the performance difference was noticeable. It wasn’t life altering, but it was there. I decided to make a brief video to show the difference in action, and to convince myself the change I seeing wasn’t just in my head.

In the video below I run the same app twice, once with the WKWebView plugin installed (on the right), and once with it not (on the left). I made sure this app avoided the network, and I slowed the video down to 50% speed to make it easier to watch.

Now, this test isn’t intended to be conclusive, statistically significant, or anything like that, and your experiences may vary. However, the performance difference shown in the video is consistent with what the statistics have shown, and what I’ve seen from playing with the plugin today: adding the WKWebView gives your hybrid app a small performance boost, basically for free. How much of a boost your app gets depends on what you’re doing, with JavaScript-processing-heavy apps getting the most help, but even mundane apps like mine stand to benefit.

There are a few caveats that keep this plugin from being a true drop-in solution—for example third-party Cordova plugins that explicitly reference the UIWebView will be problematic—so you’ll want to make sure to read through the WKWebView plugin’s documentation before you update your production apps.

That being said, it’s my opinion that everyone with a Cordova app should try adding the plugin. Assuming you don’t hit one of the edge cases, installing the plugin gives your apps a free performance boost, so why not?

Comments