Drastically improving the performance of your meteor iOS app with WKWeb​View

WKWeb​View, the new web view component introduced in iOS 8.0, replaces the old, clunky, memory leaking UIWebView that has been around forever. One of it’s main benefits is the fact that it uses the Nitro JavaScript engine, the same one used by Safari. According to JavaScript benchmarks, it is 3.5 times faster than UIWebView. In addition, from community feedback so far, wkwebview reduced the memory consumption of meteor apps by a factor of almost 10 (say what???).

Neither Apache Cordova nor meteor don’t officially support it yet, but, as part of building a meteor + famo.us ios app, we found out that UIWebView will just not cut it, performance wise.

So, we’ve modified the meteor core cordova plugin to allow the use of WKWeb​View and created a plugin based on Telerik’s WKWeb​View cordova plugin to support meteor. For now, there are two steps to adding WKWeb​View to your app:

# This replaces the default meteor cordova plugin with our version
meteor add cordova:com.meteor.cordova-update@https://github.com/practicalmeteor/com.meteor.cordova-update/tarball/a7e98f27a26b727288da81dcfd8047eccb5f6036

# This package simply includes our wkwebview cordova plugin
meteor add practicalmeteor:wkwebview

Regarding filling issues, please read the guidelines in the practicalmeteor:wkwebview package README, since non-meteor iOS specific issues should be filed with the Telerik cordova plugin, and once solved, I’ll merge them into my meteor supported fork.

That’s it! Enjoy and many thanks to the people at Telerik for creating their wkwebview plugin until Cordova officially supports it.

References

Advertisements

18 thoughts on “Drastically improving the performance of your meteor iOS app with WKWeb​View

  1. Quite fantastic! Haven’t given it a go yet just wanted to make sure no one gets in trouble with the typo ‘meteor add pracitalmeteor:wkwebview’ it should be `practicalmeteor:wkwebview`

    Like

  2. This is awesome!nnOn Xcode debug navigator, my previous app with UIWebView is a memory hog, taking 100MB on average.nnUsing WKWebView the memory usage came down to roughly 20MB. nnI’m using Ionic framework (meteoric.github.io) with my Meteor iOS app.nnThe only problem is the standard keyboard sliding up issues whenever its a text input form which Ionic manages almost flawlessly.nAny pointers on how such issues can be managed while using WKWebView please?

    Like

  3. This sounds awesome indeed! Mobile performance is a struggle still compared to fast desktops so having WKWebView solves a lot of headaches. Looking forward to this being rolled into official cordova/meteor.

    Like

  4. another discussion herenhttps://github.com/facebook/react-native/issues/321nnrelated – what are the actual benefits of using meteor’s phonegap process? I’ve found it to be a lot simpler to just do a native android app, and most cordova plugins are just wrappers on native SDKs anyway…

    Like

    1. Main benefit, for me, is meteor’s auto update (hot code pushes) of new versions of your app, without the need to deploy new versions to the app stores. But this is true only if you don’t change the cordova plugins you use in your app. If you do, you will need to deploy a new version.

      Like

  5. Great article! The main reason I actually stopped using phonegap with jquery mobile was performance. Will have to test again once MDG support WKWebView.

    Like

    1. Not sure I understand the question. practicalmeteor:wkwebview is including the wkwebview cordova plugin in your meteor cordova project for ios. If you don’t include the cordova wkwebview plugin, the ios app will use the default non-performing UIWebView to run your meteor app.

      Like

      1. oh ok, I was comparing this implementation to that used by Crosswalk, where you simply replace the webview after the app has been compiled. So adding practicalmeteor:wkwebview ensures that Meteor will use the cordova wkwebview plugin get installed during the compilation?(meteor build …).

        Like

  6. Thanks for the package and the article. I can confirm a significantly reduced memory footprint (112MB -> 15MB) and noticeably faster performance on a Meteor Cordova Ionic app. Testing will continue but no ill side-effects so far. This is great for hybrid apps!

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s