Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon

React Native 0.57 coming soon with new iOS WebViews

Save for later
  • 2 min read
  • 28 Aug 2018

article-image

WebView is used to display web content in your iOS applications.Yesterday, React Native announced a new native iOS backend to the WebView component that uses WKWebView. This WebView component will be available in the upcoming React Native 0.57 release.

Apple has discouraged the use of UIWebViews for a long time. This is due to its being formally deprecated in the upcoming months. It is advised that you use the WKWebView class instead of using UIWebView for the apps that run in iOS 8 and above.

You can use the useWebKit property to opt into this implementation:

react-native-0-57-coming-soon-with-new-ios-webviews-img-0

What problems does WKWebView solve?


Earlier, to embed web content in our applications we had two options, UIWebView and WKWebView.

UIWebView is the original WebView introduced in 2.0. It is known to have some pitfalls and problems. The main drawback is that it has no legitimate way to facilitate communication between the JavaScript running in the WebView and React Native. The newly introduced WKWebView aims to solve this problem. Other benefits of WKWebView over UIWebView include faster JavaScript execution and a multi-process architecture.

What to consider when switching to WKWebView?


You must avoid using the following properties, for the time being:

  • Using automaticallyAdjustContentInsets and contentInsets may result in inconsistent behavior. When we add contentInsets to UIWebView, the viewport size changes (gets smaller, if the content insets are positive). In case of WKWebView, the viewport size remain unchanged.
  • Unlock access to the largest independent learning library in Tech for FREE!
    Get unlimited access to 7500+ expert-authored eBooks and video courses covering every tech area you can think of.
    Renews at €18.99/month. Cancel anytime
  • If you use the backgroundColor property there is a chance that WKWebView may render transparent backgrounds differently from UIWebView and can also flicker into view.


Per React Native community, WKWebView doesn't support the scalesPageToFit property. Hence, they couldn't implement this on the WebView React Native component.

To know more about the new WebViews, check out their announcement on React Native’s official website and their GitHub repository.

Apple releases iOS 12 beta 2 with screen time and battery usage updates among others

React Native 0.56 is now available

Apple releases iOS 11.4 update with features including AirPlay 2, and HomePod among others