1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

[初心者][備忘録]Blazor Server と Blazor WebAssembly の違い

Posted at

はじめに

数年前にBlazorを使ってちょっとしたWebアプリを作って遊んだことがあったのですが、
(サンプルを適当にいじって表示内容をちょっと変えるだけのような)
正直、全然理解せずに使っていて、なんとなく動いたからヨシとしていました。
今回、改めて学ぶ機会があったので、まとめておきます。

私は普段、C#でWindowsのデスクトップアプリを開発しています。
Webの技術を体系的に学び、しっかり活用した経験がなく用語の理解も怪しいので、超初歩的な内容になってます。
最近、MicrosoftLearnでBlazorを学んでいますが、Webの技術用語とかに明るくないと、厳しいものがある感じがしてます....

(応用情報技術者試験の取得のために勉強した範囲でなんとなく見たことある用語はあるのですが、何せ丸暗記で、試験受けた瞬間に忘れました。)

Blazor

Blazorは、C#を使ってWebアプリケーションを作るためのツールです。
Blazorのホスティングモデル(アプリケーションがどこで実行されるかという基本的な仕組みのこと)には「Blazor Server」と「Blazor WebAssembly」というものがあり、これらの違いについて、まとめます。
Blazorのホスティングモデルにはもう一つのバリエーションとして「Blazor Hybrid」がありますが、今回は割愛します。

Blazor Serverとは

Blazor Serverは、アプリケーションのUIがサーバーで実行され(アプリのロジックがサーバーで動き)、クライアントはSignalRを介してリアルタイムにUIの更新を受け取るモデル(画面の更新だけがユーザーのブラウザに送られる仕組み)です。

特徴

  • 軽い動作
    • ユーザーのブラウザでは、画面の表示だけを行うため軽く動きます
  • 即時起動
    • ユーザーが初めてアプリにアクセスした際、ブラウザは単にUIの表示のみを行い、サーバーから必要なデータやコンポーネントの更新情報を受け取るため、起動が早いです
  • サーバー依存
    • すべての処理はサーバー側で行われ、SignalRという技術を使って、サーバーからブラウザへのリアルタイムな更新をします
    • ネットワーク接続が切れるとアプリケーションが使用できなくなります
  • 高負荷時の対応が必要
    • アクセスが増えた場合、サーバーの能力を増強するなど対応しないと(スケーラビリティがないと)、応答が悪くなったり、サーバーが停止する可能性があります

Blazor WebAssemblyとは?

Blazor WebAssemblyは、アプリのすべてがユーザーのブラウザで動く仕組みです。

特徴

  • オフライン対応
    • アプリケーションがクライアントのブラウザで実行されます
    • アプリケーションのすべてのコードがブラウザにダウンロードされるため、一度ダウンロードすればその後はインターネット接続がなくても動作します
  • 初期読み込みが重くなりやすい
    • クライアントのブラウザで全てのコードを実行するため、初回のアプリケーションの読み込みには全体のアセンブリや必要なリソースをダウンロードする必要があり、読み込みが重くなりやすいです

※WebAssemblyとは、ブラウザで動作するバイナリ形式のプログラム。JavaScriptよりも高速に動作する。

まとめ

やっと色々な用語がはらおちしてきた気がします。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?