フロントエンド、バックエンド、データベースとしてのウェブサイトの著者の認識は、ブラウザのページでユーザーがボタンまたはフォームリクエストを押し、フロントエンドイベントをトリガーし、収集された条件をバックエンドにパッケージ化し、バックエンドは条件を受信した後、データベースに行って判断し、ユーザーが望むデータを取り出し、バックエンドはページ、データをフロントエンドに戻し、フロントエンドは対応するデータをページに提示し、これが最も元のフロントエンドとバックエンドのコミュニケーションです。
その後、誰かがページをリフレッシュするたびに面倒すぎることを発見し、非同期で実行できるAjax技術を開発しました。イベントAが完了していない場合、他のイベントB、CはAが完了するのを待たず、自分で行うので、ユーザーがフォームリクエストを送信すると、ウェブページはリフレッシュを待つために小さな円を走り続けませんが、最初にユーザーにページを見てもらい、ユーザーが見えない場所で他のことが処理され続けます。ユーザーエクスペリエンスが大幅に向上します。
動的ウェブページの仕様は後に強く型付けされたTyepScriptが登場してもJSで統一された。（つまり、Angular、React、Vueなどのフロントエンドフレームワークで使用される言語）は、最終的にはブラウザが認識するJSにコンパイルする必要があり、TyepScriptもJSに基づいているため、バックエンドエンジニアが自分でウェブサイトを書きたい場合は、必然的にJSに対処しなければなりません。強い型に慣れている人にとっては、最初から開発するのと同じです。会社の規範が厳しくなく、任意のタイプの同僚に遭遇した場合、変数が数値を使って文字列を使うのはクレイジーですが、Blazorが登場してよかったです。
BlazorはBrowserとRazorの合成語であり、ブラウザ上で実行されるRazorコンポーネントを表します。
BlazorはWeb Assemblyホスティングとサーバホスティングの2つのモードに分かれており、クライアントサイドとサーバサイドの両方に長所と短所があります。先に進む前にWeb Assemblyとは何かを説明しましょう。
Web AssemblyはWasmと呼ばれ、バイナリ表現言語であり、特定のコンパイル後の任意のプログラミング言語はWasmに変換することができ、Wasmの利点は、サーバーを必要とせずにブラウザにプログラム全体を送信することです。バイナリとコンパイルされた関係のため、Webページのレンダリング速度はJSよりも速くなり、ファイルが小さくなります。
Blazor Web Assemblyは、コンパイルされたdllファイルと. NETランタイムをパッケージ化してユーザーのブラウザに送信するため、最初の接続の確立は遅くなります。Blazor Serverは、サーバーとブラウザ間のSingalR接続を確立し、ブラウザがイベントをトリガーすると、サーバーはページ全体を更新しません。（すべてのHtml要素をフロントエンドに送ります）代わりに、変更された要素（divなど）をSingalR経由でブラウザに送ります。これは、BlazorもAngularのようにSPA Single Page Applicationモードを使用しているためです。最初から最後までは1ページだけで、さまざまな機能のコンポーネントがいっぱいで、イベントをトリガーすると関連するコンポーネントのみが更新されます。
Blazor WebAssembly
利点：
- すべてのファイルがブラウザ上にあるため、Blazor Serverよりも高速です。
- サーバー不要です。
- サーバーに接続する必要はありません。
- クライアント側のブラウザがフル活用され、サーバ負荷が軽減
- クラウド、マイクロソフトのAzure、さらにはCDN（Content Delivery Network）など、データをユーザーの地理的位置に近い場所に保存するモデルです。例えば、私が米国のホストサイトにログインしたい場合、速度は台湾のホストサイトよりもずっと遅くなります。CDNは台湾のホストサイトにデータを保存します。香港、シンガポールなど、台湾に近い地域のホストに保存します。
短所：
- ブラウザが. NETランタイムなどのコンポーネントをダウンロードするため、最初のロードには時間がかかります（注：アイアンマンの前に筆者は新しいBlazor Web Assemblyプロジェクトを作成しましたが、コンポーネントがダウンロードされていないことがわかりました。Microsoftの公式画像にもダウンロードされたコンポーネントが表示されません。
- ブラウザの能力に制限される
- クライアント側のハードウェアが重要です。
Blazor Server
利点：
- 読み込み速度が速い。
- サーバの能力を最大限に活用できる
- このソフトウェアを使用するクライアントに必要なのはブラウザだけです。
- ソースコードがクライアントに届かないので安全です。
短所：
- サーバーが必要。
- サーバーとの接続が必要です。
- データが前後に移動するため、遅延感が大きくなります。
- サーバーが耐えられるクライアント側が限られているため、コンピューティング能力を向上させることは容易ではありません。マイクロソフトは、3.5 Gメモリを備えたシングルコアBlazor Serverは5，000接続を処理できます。14Gメモリを備えたクアッドコアBlazor Serverは20，000接続を処理できます。
Blazor Web AssemblyとBlazor Serverの長所と短所を別々にリストすると、どちらも完璧ではなく、最適なものだけがわかります。PHP、Node、Railsなどの他のプログラミング言語アーキテクチャをすでに持っているサーバーが、常にサーバーに接続する必要のないクライアントサイドプログラムが必要な場合は、Blazor Web Assemblyが最適です。Blazor Web AssemblyにはPWAがあります。Progressive Web Appデータの追加、変更、削除など、サーバーへの頻繁な接続を必要とするWebサイトをゼロから作成する必要がある場合は、Blazor Serverが適しています。
しかし、Blazorは結局のところ、マイクロソフトの新製品であり、筆者はASP.NET CoreとBlazorしか使用しておらず、Blazor Web AssemblyはPHPやその他のマイクロソフト以外の言語開発とのバックエンド統合を望んでおり、関連するニーズがある場合は、注意すべき他の場所があるかもしれません。
テキストの多くは、おそらくまだ多くの人が私の最初の接触を理解していない、私は明日2つのプロジェクトを作成し、誰もが2つの違いを見てみましょう。
- 引用: What is Blazor
- 引用: ASP NET Core blazor hosting models
- 引用: The Differences Between Blazor WebAssembly And Blazor Server
- 引用: 了解 WebAssembly 的基础使用方法
- 引用: WebAssembly design
- 引用: WHAT IS A CDN & WHERE DOES IT SHINE?
- 引用: Twitter
**注：このコードは. NET 6 + Visual Studio 2022リファクタリングを通じて、元のリンクとリファクタリング後のコードを比較することができます。読んでいただきありがとうございます。
- 本文 Markdown：点击浏览