Webアプリとネイティブアプリの違いについてまとめてみた

phiary に引っ越しました. 毎日プログラミングやWebに関する情報を発信しています! RSS 登録してたまに覗いたり, tweet やハテブして拡散してもらえると幸いです.

Pocket

以前, 『新入生・新入社員にオススメのプログラミング参考書 64 冊』という記事で「これから iPhone アプリを作るなら Objective-C より JavaScript の方が良いよ♪」的なこと書いたら 結構色々言ってくる人がいたのでざっくりと両者の違いをまとめてみた.

両方の環境での開発経験による私自身の主観が十二分に混じってるので半信半疑で読んで頂けると助かります.

web app vs native app

主な違いはこんな感じです.

          Web アプリ ネイティブアプリ
入手方法 ダウンロード, インストール不要. 専用のマーケットを介してダウンロード.
動作環境 ブラウザを介して動作する. ネットさえ繋がればPCでもスマートフォンでも動作する. インストールする必要がある. ネイティブ環境で動作するため専用のプラットフォームが必要.
開発環境 主に HTML5, CSS, JavaScript で開発. テキストエディタさえあれば作れる.コンパイルの必要もない. 専用のコンパイラ言語で開発.
メリット お手軽に開発 & 実行ができる 高速に動作する. やれることが多い.
デメリット 動作が遅い. 開発, 公開が面倒.

細かく見て行きましょう.

Table of contents

入手方法

ユーザー側のお話です.

Web アプリの場合, 常にネットを介して実行をするため, 何もダウンロード, インストールする必要がありません. 便宜上, データをクライアント側に保存することはあります. その際は, キャッシュだったり HTML5 から追加されたローカルストレージを使用します.

それに対しネイティブアプリの場合は, 専用のストアを介してアプリのデータをまるごとダウンロードしてインストールする必要があります. 有料のものもありますがその分高機能かつ大規模なものが数多くあります.

アプリをダウンロードできるストアには iPhone の場合は App Store, Android の場合は Google Play などがあります.

up

動作環境

Web アプリの場合ブラウザ上で動きます. そのためブラウザとインターネットに繋がる環境さえあれば PC でもスマートフォンでもプレイすることができます.

ただ, 処理する度に間にブラウザが挟まるためネイティブに比べると動作は低速です. (JITコンパイラがうまく走れば起動時間以外はそこまで差はない…はず)

ネイティブアプリは一度ダウンロードしてしまえばネット環境がなくてもプレイできます.

up

開発環境

Web アプリ開発には, HTML/CSS と JavaScript が使われます. Web ページを作る仕組みと同じですね.

公開はサーバーにアップするだけで出来ます.

数年前に HTML5 で Canvas という描画機能をサポートされてから, だいぶゲームなどのインタラクティブなアプリを作りやすくなりました.

ちなみに私の方で, Web アプリとしてさくっとゲームや簡単なアプリを作れるよう 機能をライブラリ化した『 tmlib.js 』という JavaScript ライブラリがあるのでよかったら使ってみて下さい.

こういったライブラリを使えば, 一つのコードで PC, iPhone, Android で同じように動作する アプリケーションを作ることができます.

ネイティブアプリ開発には, iPhone の場合は Objective-C, Android の場合は Java が主に使われます. 開発はコードを書いたらコンパイルしてバイナリにする必要があります.

傾きセンサーや位置情報, カメラといったデバイス特有の機能はネイティブでしか使えません. でしたが, バージョンが上がるにつれてブラウザでもそういった機能を扱うための API が追加されているので, この辺はいずれ気にしなくても良くなるかもしれません.

また, アプリを更新した際, Web アプリの場合はサーバー側のデータを更新するだけですが, ネイティブアプリの場合は, 全ての人にアップデートしてもらう必要があります.

wav-native-flow

up

実際に同じアプリをネイティブ と Web とで作ったので見比べてみてちょ♪

友人が作っていたネイティブアプリを先ほど紹介した tmlib.js を使って Web に移植してもらいました.

  • Web アプリ版 – Demo
  • ネイティブ版 – Demo

コードの量はネイティブに比べて1/3になっていて, かつ同じように動作します.

HTML の meta の設定とかすれば Web アプリでも下の動画のようにフルスクリーンでネイティブのように動かすことができます.

このように2D ゲームだったりUtility系の処理コストがそこまで大きくないようなアプリであればネイティブで作る必要は全くありません.

up

結局どっちの開発が良いのよ?

状況によって使い分けるべきでしょう!!って言いたい所ですが 私はガッツリ Web アプリ推しです.

というのも, 昔 Objective-C を使って iPhone アプリを開発した経験があるのですが, 正直最悪でした.

もう2年ほどやっていないので, 今はどうか知りませんが Interface Builder という (個人的に合わなかったという意味で)ヘンテコなアプリケーションを使ったり, そもそもの Objective-C が使いにくかったので…

完成した後の公開手続きも面倒だし…正直二度とやりたくない.

ただ, 私が JavaScript を本気で勉強するキッカケを作ってくれたのは この最悪な環境での開発経験があったからなので, そういった意味では良かったし後悔はしていません.

なので, どっちが良いかはどちらも使ってみて決めて下さい.

ただ, Web アプリとネイティブアプリは速度の差も API の制限も徐々に気にならないレベルにまで来ています. おそらく 3D ゲームに関しても, 来年か再来年あたりに WebGL がスマートフォンでも解禁されて(Android では動くやつも出てきてるみたい) 3D ゲームがガンガン動いてると思います.

時代の流れは Web アプリ だということは断言しておきます.

より良いアプリをより多くの人へ』ではなく『お金儲け』が目的であれば話は変わってくるでしょうけど…

up

TRACK BACK URL

POST COMMENT

メールアドレスが公開されることはありません。

COMMENT