"BOKU"のITな日常

還暦越えの文系システムエンジニアの”BOKU”は新しいことが大好きです。

PWA・SPA・・など「WEB技術を使うアプリケーションの種類」をまとめる。

Nuxt.jsとか最近のWEB技術のドキュメントを読んでいると、中にユニバーサルアプリとかPWA、SPAとか・・いろんな名前がさらっとでてきます。

なんとなくは知ってるとはいえ、いつ度忘れするかわからないので、頭の整理をかねて、ザックリとまとめておくことにしました。

f:id:arakan_no_boku:20190505103119j:plain

 

アプリケーションの種類

 

ウェブ開発系の資料を読んでいて、目にするアプリケーションの種類に関する単語を列挙してみます。

  • プログレッシブウェブアプリケーション(PWA)
  • ユニバーサルアプリケーション
  • ユニバーサルWindowsプラットフォーム (UWP)アプリケーション
  • シングルページアプリケーション(SPA)
  • デスクトップ(WEB)アプリケーション
  • サーブレット
  • サーバーサイドアプリケーション
  • モバイルアプリケーション
  • モノシリックアプリケーション
  • マイクロサービスアプリケーション

など・・ですかね。

あと、紛らわしい言葉に「AMP(Accelerated Mobile Pages)」があります。

これは、「モバイルページを高速に表示させるための手法」のことなので、アプリケーションの種類ではありませんので、ここには含めてません。 

 

自分流にざっくり分類してみる

 

上記を個別に書いていくと数が多すぎて、いまいちまとまりません。

でも、ある程度グループ化できそうなので、自分流に4つに分類してみました。

 

マルチデバイスマルチプラットフォーム対応グループ

 

応答性改善狙い系グループ
  • シングルページアプリケーション(SPA)
  • デスクトップ(WEB)アプリケーション

 

プロセス構成軸で分類グループ
  • モノシリックアプリケーション
  • マイクロサービスアプリケーション

 

従来のアプリケーション系グループ
  • サーブレット
  • サーバーサイドアプリケーション
  • モバイルアプリケーション

 

さて・・、個別に見ていきます。

 

マルチデバイスマルチプラットフォーム対応グループ

 

ざっくりした意味はこんな感じです。

名称 概要
ユニバーサルアプリケーション

Apple社は 「iOS」を搭載した「iPhone」、「iPad」、「iPod Touch」の全端末上に対応しているアプリケーションのことをこうよんでます。

ユニバーサルWindowsプラットフォーム アプリケーション/UWPアプリケーション

「ユニバーサルWindowsプラットフォーム (UWP) 」で動作するアプリケーションです。

UWP上で動作することで、Windowsを搭載するPCやタブレット型端末、Windows Phone、Xboxなどマルチデバイスマルチプラットフォームのアプリケーションになります。

プログレッシブウェブアプリケーション

Googleが提唱するデスクトップとモバイルの両方でインストール可能なウェブアプリケーションのことです。

アプリストアにも登録可能です。

当然、ブラウザ上でも動作可能です。

当初は、Androidだけでしたが、iOSやWindows10など対応範囲は確実に広がっているようです。

なんですが。

上記の「UWPアプリケーション」が色んな名前で呼ばれることがあるのが困りものなのです。

例えば、「Universal Windows Apps(UWA)」とか。

あと、「ユニバーサルアプリケーション」と呼んでいる資料もあります。

これのおかげで、「ユニバーサル」って書いてあれば、Appleのこと・・と、決められなくなっています。

自分が見た範囲だと、「ユニバーサル」と書かれていたら、どのOSを前提に書いているかで判断したほうが良さげです。

 

応答性改善狙い系グループ

 

WEB技術を使って、デスクトップアプリのような応答性を実現するアプローチになっているというくくりで、グルーピングしてみました。

名称 概要
シングルページアプリケーション(SPA)

単一のWebページのみで構成します。

非同期通信で処理結果をうけ画面の差分だけ更新する手法で、デスクトップアプリケーションのような応答性を提供するWebアプリケーションです。

デスクトップ(WEB)アプリケーション

HTMLとCSSJavaScriptなどのウェブ技術を使って開発するデスクトップアプリケーションです。

例えば、Electron (エレクトロン)だとWindowsmacOSの両OSのアプリケーションを1つのコードから作ることができます。

どちらも、ベースにNode.jsがいたりして、ほぼ同じようなWEB技術で開発します。

なので、開発したものが「WEBアプリケーション」なのか「デスクトップアプリケーション」なのか・・の 違いということになります。

あと。

Electron (エレクトロン)と聞くとピンときませんが、実は・・「Visual Studio Code」、「Atom」、「Skype」みたいな超メジャーなアプリケーションがそれを使って開発されていたりする超メジャーな環境だったりするのですね。

 

プロセス構成軸で分類グループ 

 

ざっくり書くと、プログラムを単一のマシン上にまとめておくか、自由に複数のマシンに分散しておいているか・・ってことです。

名称 概要
モノシリックアプリケーション

MVCの階層分けや機能ごとにプログラム自体は異なっています。

ですが、同一マシン上にすべてが存在している前提です。

従来のサーバーアプリケーションは、基本全てこのタイプです。

マイクロサービスアプリケーション

構成する各機能が別マシンに分かれて存在している前提です。

それを通信によって値(テキストデータ)を投げ合うことで、ひとつのアプリケーションとして機能させるやり方です。

各機能が疎結合なので、保守性・拡張性・可用性等にメリットがあります。

Nuxt.jsの説明には「 静的に生成された Vue.js アプリケーション」がでてきます。

これは、上記のマイクロサービスアプリケーションに優位性をもった形態と位置付けられています。

自分も最近、マイクロアプリケーションには興味があります。

codezine.jp

 

従来のアプリケーション系グループ

 

昔からあるタイプ・・なので、今更感はありますが・・。

名称 概要
モバイルアプリケーション

スマートフォンタブレットコンピュータ、その他携帯端末で動作するように設計されたコンピュータプログラムです。

他にも「携帯アプリ」とか「スマホアプリ」とかよばれる場合もあります。

iOSはSwift(Objective-C)、AndroidはKotlin(Java)で開発します。

でも、Coldovaなどクロスプラットフォーム開発できる環境もあります。

サーブレット

クライアント(ブラウザ)からのリクエストを受けて、処理を行い、結果をHTMLに生成して返すタイプのアプリケーションです。

概ね、JAVAで開発したものをこう呼ぶみたいですね。

サーバーサイドアプリケーション

サーブレットと同様に、クライアント(ブラウザ)からのリクエストを受けて、処理を行い、結果をHTMLに生成して返すタイプのアプリケーションです。

サーブレットと対比して、JAVA以外を意味する場合が多いみたいです。

でも、たまに、JAVAを含んで総称的に使われたりもするので、とまどいます。

ちょっと補足です。

最近「サーバーサイドレンダリングSSR)」という言葉が、モダンなJavaScriptフレームワーク資料で頻出しています。

一見、混乱するときがあります。

でも、この「サーバーサイドレンダリングSSR)」は、仮想DOM技術等を使ったクライアントレンダリングで生じる問題の解決のために、同じロジックをサーバーサイドで行う「手法」のことで、「サーバーサイドアプリケーション」とは全く違うものです。

念のため。

 

まとめ

 

とりあえず、整理してみました。

超、ザックリですが。

でも、この程度わかると思い出せるので・・まあ、いいかな・・と思ってます。

ではでは。