【開発日誌#40】アプリ開発で工数短縮！？WebViewのメリット・デメリットについて

はじめに

こんにちは！アプリディレクターをしている竹辻と申します。
突然ですが、「アプリ開発をする上での課題」といえば皆さんはどんなものを思い浮かびますか？

・iOS/Android間の言語の問題
・メンテナンスやアップデートのコストFF
・既存アプリとの差別化
etc...

web制作とはまた違った課題に悩まされるアプリ開発ですが、今回はその中でもアプリ開発特有の機能の一つである「WebView」について概要からメリット・デメリットなどを簡単にまとめてみました。

そもそも「WebView」とは

WebViewとは、iOSやAndroid OSといったスマートフォン/タブレット端末向けのアプリの中にWebページを表示するための技術のことです。
つまり、WebViewを使用することでブラウザアプリを経由せずに直接アプリ内でWebページを表示・閲覧することが可能になります！
また、使い方によってはページの一部をWebViewにすることでアプリ開発の工数を抑えながら品質を担保することも出来てしまいます！

一般的にアプリ開発をするにはiOSとAndroid OSでは使用する言語が異なり、アプリのページ数が増えれば増えるほど工数も増加していきます。
最近ではFlutterと呼ばれるiOSとAndroid OSを１つのコードベースを書くだけで両方に対応出来る言語がトレンドになりつつありますが、それでも１からページを作るとなると、ある程度の工数が発生してしまいます。

ですが！
WebViewを使用すれば、元々存在しているWebページをアプリにそのまま表示する事が可能となるので、コーディングをする工数を大幅に短縮出来てしまうのです！
また、複数のOSに対応したい時でも、WebViewであればOS毎に開発する必要がないという特徴があります。

WebViewのメリット

①開発工数の削減

WebViewであれば１つのHTMLコンテンツでiOS/Android両方に対応が出来ますので、
HTMLコンテンツが無い場合は、ひとつのHTMLコンテンツを作成することでアプリ上でコンテンツを表示出来ます。その結果として、アプリ開発に割くコストを削減することが可能となります。
また、すでにHTMLコンテンツを所持している場合は新規開発を行わずにWebViewの設定をするだけでコンテンツの表示が可能となり、よりコストを削減してアプリ開発をすることが出来ます。

②内容更新時にストアへの申請が不要

通常、アプリの内容を更新する際には各ストア(Google Play/App Store)への申請が必要であり、審査には数日かかることが多いのですが、WebView内の情報更新であれば、アプリの更新ではなくてHPの更新で対応が可能ですので申請の手間や時間を短縮することが可能となります。

③並行して開発をすることによって短期間での納品が実現可能

WebViewの中身はウェブ開発者が担当するHTMLコンテンツであるので、アプリ側の開発と平行してWebviewの内容を開発することが可能です。
同時並行で開発を進めることが可能となるので、アプリ側で全ての中身を開発した時に比べて短期間での納品が実現できますし、アプリ側開発者の負担を削減することが出来ます。

④HTMLコンテンツ　X　アプリ固有の機能　＝　コンテンツの価値向上

WebViewはアプリ内にウェブページやウェブアプリケーションなどのHTMLコンテンツを組み込むツールで、これにより、アプリユーザーに対してアプリ外のHTMLコンテンツをシームレスに提供できます。
例えば、オンラインショッピングアプリ内で商品詳細ページを表示する場合、WebViewを使用してアプリとHTMLコンテンツを統合できます。
これにより、商品の最新情報を提供しながら、アプリ固有の機能（お知らせ機能やカメラ検索機能など）をユーザーに提供できます。
その結果、ユーザーは既存のHTMLコンテンツのみを使用する場合と比べて、アプリ固有の付加価値を利用でき、アプリの価値が向上します。

WebViewのデメリット

①オフラインで利用することが出来ない

WebViewはアプリ内でWebページと通信をして中身を表示する仕組みであるため、オフライン環境（飛行機内やトンネルの中など）においては使用することが出来ません。

②内容を表示するまでの時間がネイティブアプリに比べて長い

WebViewはページの内容をその都度で通信をしてから表示をする仕組みであるため、データが全てアプリ内に包括されているネイティブアプリに比べて、コンテンツが表示されるまでの時間が長くなります。
また、ページを表示した分だけ通信量が増加していくため、どうしてもネイティブアプリ以上に通信量は増えてしまいます。
その結果として、ユーザーエクスペリエンスに悪影響を及ぼす可能性があります。
アプリの応答性やスムーズなトランジション（画面遷移）が必要な場合、WebViewの使用の是非を検討する必要があります。

③ストアの審査でリジェクトされやすい

特にiOS(App Store)で発生しやすいのですが、アプリの中にWebViewを入れすぎてしまうとストアの審査に通らずにリジェクト（配信を拒否）されやすくなっています。
WebViewでHTMLコンテンツを表示するだけではアプリである必要がないため、アプリとしてプラスアルファの機能を追加する必要があります。

4.2 最低限の機能 Appを作成する際は、Webサイトを単に再パッケージしたようなものではなく、優れた機能、コンテンツ、UIを作成するようにしてください。特に便利でも、ユニークでも、「Appらしく」もない場合、そのAppをApp Storeで提供することはできません。Appが継続的に楽しめる何らかの価値、または十分な有用性を備えていない場合は、承認されない可能性があります。Appが単に曲または映画の場合は、iTunes Storeに提出してください。Appが単に書籍またはゲームの攻略本の場合は、Apple Books Storeに提出してください。

参照：App Store Reviewガイドライン

アプリか Webview か
また、既存ウェブサイトを Webview で見せているだけに過ぎないアプリもよく見かけます。こういったアプリのほとんどは、Android ユーザーにエンゲージメントの高いアプリのエクスペリエンスを提供するというよりは、単にトラフィックを上げるという目的で登録されています。このようなアプリは、Webview スパムと見なされ、Play から削除されます。アプリではウェブ以上の機能を提供することを検討し、ユーザーエクスペリエンスを高める関連機能を実装してください。

参照：Google Play 配信アプリのよくあるポリシー違反とその回避方法

WebViewが使われているアプリ

①ソーシャルメディアアプリ

ソーシャルメディアアプリでは、WebViewを使用して外部のHTMLコンテンツを表示します。
ユーザーが外部の記事やリンク、ウェブページを投稿内からクリックすることでシームレスに閲覧可能にするために使用されています。

②オンラインショッピングアプリ

オンラインショッピングアプリでは、WebViewを使用して製品詳細ページや支払いページを表示することが可能です。
これにより、アプリ内でシームレスなショッピング体験を提供できます。

③メディアプレイヤーアプリ

メディアプレイヤーアプリでは、動画ストリーミングサービスや音楽プラットフォームのコンテンツを表示するためにWebViewを使用することが可能です。
これにより、ユーザーは常に最新のメディアコンテンツを再生することができます。

④ニュースアプリ

ニュースアプリでは、WebViewを使用して外部のニュース記事やウェブサイトを表示することが可能です。
これにより、ユーザーはアプリを更新せずとも常に最新のニュースを閲覧することができるのです。

まとめ

「WebView」とはブラウザアプリを経由せずに直接アプリ内でWebページを表示・閲覧することが可能となる機能です。
WebViewを使用すべきか否かは下記のような場面で変化します。

WebViewを使用するべき場面

ニュースアプリ等のページ更新が頻繁に発生するアプリ
開発コストの削減をしたい場合
既存のHTMLコンテンツと見た目を寄せたい場合

WebViewを使用するべきでない場面

カメラや位置情報などの端末独自の機能を使用したい場合
オフラインでの動作を求めているアプリの場合
アプリのパフォーマンスを重要視している場合

何もすべてをWebViewで表示する必要はありません。（そもそも、その様なアプリはストアからリジェクトされてしまいます）
アプリ内の一部ページはWebViewで表示する、端末依存の機能を実装するのはアプリ側に依存する。
このような開発を行うことでWebViewの強みを活かしながらアプリ開発を行うことが可能となるでしょう。