フロントエンジニア芸人もりたけんじのreact

【ReactNative】なるほど!UIWebViewとWKWebViewの違い(WKWebViewが来るので)

【ReactNative】なるほど!UIWebViewとWKWebViewの違い(WKWebViewが来るので)

自分はネイティブ開発に触れたことがないのですが、
最近「初めてReactNativeを触った
のでWKWebViewを調べてみました。
調べるとじゃあなにが変わるのか違いが知りたいということで
記事書きました

概要
1. react-native 0.57からWebViewはWKWebViewで実装されたものが使える
2. UIWebViewとWKWebViewの違い

RNブログでの発表
https://facebook.github.io/react-native/blog/2018/08/27/wkwebview

1.react-native 0.57からWebViewはWKWebViewで実装されたものが使える

このように

<WebView useWebKit={true} source={{url: ‘https://www.google.com’}} />

OSは12で正式にUIWebviewを廃止を予定していて、
RNは0.57からWKWebViewをサポートする

今までRNのWebViewはUIWebViewっていう古いWebviewの実装に依存していたんだけど
それをWKWebViewで作られたバックエンドを利用することになったらしい

JavaScriptとReact Native間の通信が円滑になる

アプリはすでにWKWebViewを使っているのが主流みたいで
実質アプリのようなWebView体験がRNでもできるようになる
という理解

2. UIWebViewとWKWebViewの違い

あまりまとまっている日本語記事がない。
下はUIWebViewとWKWebViewの違いの記事
参照

UIWebView・・・UIKitの一部。標準実装なのでなにもimportする必要がない。内部インターフェイスビルダーの中で利用可能。iOS2.0から導入、プロセスが1つでネイティブに頼っている。今ではdprecated
WKWebView・・・iOS8.0から導入、実行時のプロセスがSafariと分けられているのでWebを早く効率よく表示する。このことはメモリをオーバーヘッドしないように消費すること意味する。iOS8.0ではファイルを扱えなかったバグがあったがiOS9で解消されている

その他クラッシュ率とセキュリティと色々違いがあるみたい

一旦ここまで

WIP (あとで更新します)

全然関係ないけど、
React-NativeでWebViewからNaitiveのそれへの戻り方実装はここら辺かも


フロント記事

React
【Reactのstateとpropsの違いが知りたい!(変更・更新の仕方等デモあり)】過去のReact初心者の自分にpropsとstateの違いを説明する
【REACT】REACTの動きを理解したい人の為の最小サンプル
【REACT × ES6 × FLUX】を手っ取り早く学びたい人の為にサンプル作ったよ【3の倍数と3が付くときだけ猫になるCOUNTER】
REACT × FLUX × ES6 [WIP]LINE風チャット

その他
フロントエンド記事
フロントエンド記事(タグ)
JavaScript練習問題
recomposeと仲良くなりたい
機動戦士FlowType
styled-componentsの使い方
初めてReactNativeWebを触ってみて
フロントエンドエンジニア豚汁の作り方
SCSS問題集
Ramda.jsシグネチャの読み方
環境変数の話

サイトTOP
私は何者か


SNS
インド旅 instagram
適当な日常写真 instagram
シュールさーん instagram
シュールさーん LINEスタンプ
もりたけんじTwitter
ネタ帳Twitter
note

FaceBook -kennji.morita-
※わたしが結成しているWebチームではWeb未経験者、フリーランスの方へのお仕事を紹介しています。
もしご興味ある方はチャットから自己紹介を兼ねてご連絡ください。
※業務連絡やお久しぶり連絡はチャットからお願いします

(Visited 1 times, 1 visits today)