Blazorツールステーションを作り、ドメイン名を10年間購入しました。

Blazorツールステーションを作り、ドメイン名を10年間購入しました。

ウェブサイトはBlazor Wasmを使用して開発され、ウェブサイトのコンテンツにはオンラインツールとオンラインミニゲームの2種類が含まれ、主にWeb Assemblyを体験する。

最后更新 2023/06/25 13:54
沙漠尽头的狼
预计阅读 5 分钟
分类
Blazor
标签
.NET C# Blazor Blazor WebAssembly Client

こんにちは、私は砂漠の果ての狼です。

Dotnet9 上线在线小工具和小游戏后,服务器的压力感觉挺大的,打开25个页面,内存占用170MB左右,CPU保持在60~70%,看来Server真不适合搞这类交互较多的程序(服务器配置:2核4G内存),所以站长加急上线 Blazor Wasm 版本网站,便于大家直观对比了解两种模式的区别,下面请看我细说。

1. 概要-Dotnetツールボックスをオンラインにする

为了后面工具和游戏的扩展,站长把去年买的域名 dotnetools.com 用上了,该域名一次性买了10年(不用担心网站过几年消失,当然不排除意外,比如站长没钱续费服务器。。。),并赶紧在1天之内开发并部署了一个 Blazor Wasm 版本网站,把在 Dotnet9 已经上线的在线小工具和游戏同步搬过来了,大家可以体验下:https://dotnetools.com:

2. Dotnet Toolboxウェブサイトオープンソース

ウェブサイトのソース組織構造は次のとおりで、1つのプロジェクトだけで、迅速にオンラインにするために、コードも比較的明確です:

ウェブサイトのソースコードリンクは最後にありますので、ソースコードアドレスを聞かないでください。

3. なぜBlazor Serverはオンラインツールやゲームなどのウェブアプリケーションの開発に適していないのですか?

Blazor Serverは、オンラインツールやゲームのようなWebアプリケーションの開発には適していません。主に、その動作原理や機能により制限や適用外の状況が発生するためです。

  1. リアルタイムの制限:Blazor ServerはSignalRテクノロジーを使用してサーバーとのリアルタイム通信を実現しますが、すべてのUI 更新はサーバー経由で行われるため、ネットワークレイテンシが高い場合にはユーザーが大きな遅延を感じる可能性があります。これは、オンラインツールやゲームなど、リアルタイムの応答性を必要とするアプリケーションでは受け入れられません。

  2. サーバーリソースの消費:Blazor Serverは、アプリケーション全体をサーバーにデプロイすることで動作し、各ユーザーは接続とサーバーリソースの一部を消費します。オンラインツールやゲームなど、多数のユーザーを同時にオンラインにする必要があるアプリケーションでは、サーバーリソースが過剰に消費され、拡張や保守が困難になる可能性があります。

  3. クライアント側のパフォーマンス制限:Blazor ServerのUIレンダリングはサーバー上で行われ、更新されたUIがSignalR経由でクライアントにプッシュされます。つまり、クライアントのパフォーマンスは、アプリケーションの応答性とユーザーエクスペリエンスに大きな影響を与えます。一部の複雑なオンラインツールやゲームでは、クライアントのパフォーマンスがニーズを満たしていない場合があります。

要約すると、Blazor Serverは、リアルタイム要件が高くなく、ユーザー数が少なく、サーバーリソースの消費が少ないWebサイトアプリケーションの開発に適しています。オンラインツールやゲームなど、リアルタイム性と多数のユーザーが同時にオンラインになる必要があるアプリケーションでは、アプリケーション全体をクライアントにデプロイし、サーバーへの負荷を軽減し、ユーザーエクスペリエンスを向上させるBlazor Web Assemblyが適しているかもしれません。

4. Blazor Wasm開発ツールステーションを選択する理由

Dotnet9 网站选择Blazor Server依然不变,因为博客类网站需要SEO,需要搜索引擎提供流量。

Dotnet工具箱 主要关注的是在线小工具和小游戏,所以选择Blazor Wasm,当谈到选择Blazor WebAssembly时,有几个令人兴奋的优势值得一提:

  1. インスタントパフォーマンスBlazor Web Assemblyは、Web Assembly Wasmテクノロジを利用して、C#コードを効率的なバイナリ形式にコンパイルし、ブラウザで直接実行できる。つまり、C#で書かれたアプリケーションをJava Scriptに変換することなくクライアント側で使用できます。この直接実行機能により、Blazor Web Assemblyはネイティブアプリケーションに近いパフォーマンスを実現し、より高速なロード速度とスムーズなユーザーエクスペリエンスをユーザーに提供します。

  2. クロスプラットフォーム:Blazor Web Assemblyは、Windows、Mac、Linux、モバイルデバイスを含むさまざまなオペレーティングシステムやデバイスで動作するクロスプラットフォームソリューションです。つまり、同じコードベースを使用して異なるプラットフォームで動作するアプリケーションを構築できるため、開発や保守の手間が軽減されます。

  3. 開発効率:Blazor Web Assemblyは、C#言語と広く使用されている開発ツールとエコシステムである. NET Frameworkを使用します。すでにC#と. NETに精通している場合は、新しい言語やフレームワークを習得することなく、すぐにBlazor Web Assemblyを使用して開発を開始できます。この開発効率は、プロジェクトの開発を大幅にスピードアップし、開発者の学習曲線を短縮できます。

  4. 強力なエコシステム:Blazor Web Assemblyは. NETエコシステム上に構築されています。つまり、. NETの豊富な機能とサードパーティ製ライブラリを活用して、強力なアプリケーションを構築できます。Entity Framework、ASP.NET Coreなど、. NETのさまざまなツールやテクノロジーを使用して、開発プロセスを簡素化し、アプリケーションの品質と保守性を向上させることができる。

  5. セキュリティ:Blazor Web Assemblyアプリケーションはクライアント側で実行されますが、サンドボックス環境で実行されるため、ネイティブアプリケーションよりもセキュリティが高くなります。つまり、セキュリティを心配することなく、機密操作をクライアント側で実行できます。さらに、C#でコードを記述するため、. NETのセキュリティ機能を利用して、一般的なセキュリティ脆弱性や攻撃からアプリケーションを保護できます。

Blazor Web Assemblyには、即時のパフォーマンス、クロスプラットフォーム、開発効率、強力なエコシステム、セキュリティなどのエキサイティングな利点があります。これらの利点により、Blazor Web Assemblyはエキサイティングなテクノロジーの選択肢となり、高性能でクロスプラットフォームのWebアプリケーションを構築する新しい方法を開発者に提供します。

** ハイライト **:WASMはBlazorの未来です。

5. Blazor ServerとBlazor Wasmの違い

Dotnet9 网站选择Blazor Server,可在在线工具和在线游戏页面体验Server,比如 扫雷游戏,在游戏页面也可选择跳转到 Dotnet工具箱扫雷游戏 页面,这是Wasm版本,可通过浏览器F12打开开发者工具查看网络请求情况,下面简单说说查看步骤。

Dotnet9 页面的 扫雷游戏,点击工具栏可以跳转到 Dotnet工具箱扫雷游戏 页面:

Dotnet9 页面的 扫雷游戏页面,看网络请求,几乎一直在请求,简直令人发指,丧心病狂:

Dotnet工具箱扫雷游戏 页面,看网络请求,只有网页的图片请求,其他请求就没有,这就是客户端的魅力(WebAssembly):

Blazor、またはBlazor ServerとBlazor Wasmについては、多くの人が聞いたことがあると思いますが、関連する概念についてはあまり知らない、ここでGPTを尋ねることによって、回答は前の段落と同様です。

BlazorはWebアプリケーションを構築するためのオープンソースフレームワークで、C#と. NETを使用してクライアントサイドコードを記述することができます。Blazorには、Blazor ServerとBlazor WebAssembly Wasmの2つのモードがあります。以下は、2つのモデルの詳細な比較です:

  1. 構造:より
  • Blazor Server:Blazor Serverモードでは、アプリケーションのUIをサーバーにレンダリングし、SignalR経由でUI更新をクライアントにプッシュします。クライアントは、サーバーとの永続的な接続を確立することでUIの更新を受信し、ユーザーの操作を処理します。
  • Blazor Web Assembly:Blazor Wasmパターンは、アプリケーション全体のコードと依存関係をWeb Assembly形式にコンパイルし、クライアント側で実行します。アプリケーションはクライアント上で独立して実行され、サーバとの永続的な接続は必要ありません。
  1. パフォーマンス::
  • Blazor Server:Blazor Serverモードのパフォーマンスは、サーバーとネットワークの両方に影響されます。UIレンダリングはサーバ上で行われるため、大規模なアプリケーションや並列性の高いシナリオでは、サーバに大きな負荷がかかる可能性があります。
  • Blazor Web Assembly:Blazor Wasmモードのパフォーマンスは、主にクライアントデバイスの影響を受けます。アプリケーションはクライアント上で実行されるため、応答性が向上し、レイテンシが低減されます。
  1. 信頼性の向上
  • Blazor Server:Blazor Serverモデルは、サーバーの安定性と可用性に依存します。サーバに障害が発生したり、ネットワーク接続が切断されたりすると、アプリケーションが正常に動作しなくなります。
  • Blazor Web Assembly:Blazor Wasmモードはクライアント側で独立して動作し、サーバーの安定性や可用性に依存しません。サーバが使用できなくても、アプリケーションは引き続き実行できます。
  1. 開発体験:
  • Blazor Server:Blazor Serverモデルの開発エクスペリエンスは、従来のサーバーサイド開発に似ており、. NETの完全な機能とエコシステムを使用できます。ただし、UIはサーバ上にレンダリングされるため、ユーザインタラクションを処理する際には、サーバとの通信遅延を考慮する必要があります。
  • Blazor Web Assembly:Blazor Wasmモードの開発エクスペリエンスはクライアントサイド開発に似ており、C#と. NETのほとんどの機能を使用できますが、一部の機能に制限があります。アプリケーションはクライアント側で実行されるため、ネイティブアプリケーションに近いユーザーエクスペリエンスを提供できます。

一般的に、Blazor Serverは迅速な開発とデプロイが必要なアプリケーションに適しており、Blazor Web Assemblyはより良いパフォーマンスとスタンドアロンで実行する必要があるアプリケーションに適しています。選択するモードは、アプリケーションのニーズと優先順位によって異なります。

6. 最後の言葉だ

前の2つの記事では、一部のネチズンはウェブマスターがWasmモードを使用することを提案し、ウェブマスターは正常にオンライン展開され、誰もが歓迎メッセージを持っている、ウェブマスターは追加を検討する時間があります、もちろん、誰もがPRツールやゲームを、Blazor WASMの開発に限定してください。

今日はこれを共有し、読んでくれてありがとう。

  • Webサイトhttps//dotnetools.com/
  • Webサイトソースhttps//github.com/dotnet9/Dotnet9
  • .NET版本: .NET 8.0.0-preview.5.23280.8
  • WeChat技術グループ:ウェブマスター WeChat(codewf)を追加し、“グループに入る”2つの単語をメモしてください
  • QQ技術グループ:77 1992,30 0
Keep Exploring

延伸阅读

更多文章
同分类 / 同标签 2023/06/27

Blazor版テトリスゲームの展開に成功

TetrisのBlazorバージョンがオンラインで公開され、オンラインツールとオンラインゲームコンポーネントがRazor共有ライブラリに抽出され、Dotnet9ウェブサイトとDotnet Toolboxウェブサイトで再利用できるようになった。

继续阅读
同分类 / 同标签 2024/11/06

なぜ私のブログはBlazorに戻るのか?

ブログサイトの開発は苦労し、MVC、Vue、Goなどの10近くのバージョンを試してきましたが、Blazorに戻り、静的SSRを使用して、速度が急上昇し、正常にオンラインになりました。

继续阅读
同分类 / 同标签 2024/02/29

Winformでもデータを表示できます。

winform開発の過程では、しばしばデータ表示機能を行う必要がありますが、以前はグリッドコントロールを使用していましたが、今日は例を通じて、Winform Blazorハイブリッドでant Design Blazorテーブルコンポーネントを使用してデータ表示を行う方法を紹介します。

继续阅读
同分类 / 同标签 2024/02/29

Winformのインターフェースも良く見えますか?

先日、winformでBlazorハイブリッドを使用することを紹介しましたが、Blazor UIを使用するとwinformプログラムがより良く見えるようになると述べました。次に、winform Blazorハイブリッドで描画する例を示したいと思います。

继续阅读