ブレザーvsカミソリ

asp.net-core blazor c# razor

質問

Blazorの発明で、私はこれら2つの言語の間に(コードの作成とコードの実際のコンパイル/実行の両方において)かなりの効率があるかどうか疑問に思いますか?

https://github.com/SteveSanderson/Blazor

誰かが実際にそれを実装したのであれば、あなたは何らかのパフォーマンステストを受けたのでしょうか、それとも普通のRazorと比較してコードライティングプロセスについての逸話(すみません、申し訳ありません)をフィードバックしましたか?

受け入れられた回答

私が下で提示している情報は、主にスティーブン・アンダーソンの2月2日のブログ・エントリーと、プロジェクトの目標についての私自身の理解から言い換えられています。

Blazorは、現在の.NET Razorスタックのアイデアと最新のSPAフレームワークアーキテクチャを組み合わせることを目的としています。

コードの作成

次の例に示すように、柔軟性を持ち、コンポーネントベースのレイアウトを促進することを目的としています。

<div class="my-styles">
   <h2>@Title</h2>
   @RenderContent(Body)
   <button onclick=@OnOK>OK</button>
</div>

@functions {
    public string Title { get; set; }
    public Content Body { get; set; }
    public Action OnOK { get; set; }
}

HTMLマークアップに再利用可能なコンポーネントを作成します。

<MyDialog Title="Ski Lift controls" onOK="DismissSkiDialog">
    Gondola @gondolaId is now <em>running</em>
</MyDialog>

実行

Blazorは、webAssemblyが高速であるため、高速になると予想されます。これは、ブラウザのwasmローダによって直接実行されるバイトコードにコンパイルされます。たとえば、javascriptでは、 .jsファイルを最初にロードし、別々のファイルを結合し、解析してトークン化してツリー構造に組み込み、ブラウザのjavascriptエンジン( クロムのv8エンジンなど)で解釈できるようにする必要があります。 。

webAssemblyとjavascriptの実行を詳細に比較するには、 この記事を参照してください。

SPAのアーキテクチャと設計

Blazorは既にReact、Vue、Angularなどの現代のフレームワークで使用されているアイデアからインスピレーションを得ています。

  • レイアウト
  • ルーティング
  • 依存性注入
  • レイジーロード
  • ユニットテスト

これらの概念はRazorのサーバー側に存在しますが、すべてがクライアント側に存在するわけではありません。フロントエンドルーティングはRazorでは利用できません。このシナリオを満たすために、多くの場合、javascriptフレームワークと組み合わされています。

私は個人的に、RazorのページをAngularJsと共に提供しているエンタープライズアプリケーションに取り組んできました。それは時々乱雑になり、決して「きれい」を感じることはありません。

要約すれば

Razorは、APIロジックとサーバー側のテンプレートを処理できるサーバーベースのアーキテクチャのソリューションですが、クライアント側のロジックをJavaScriptの外部に提供することはできません。

BlazorはRazorと同じサーバー側の機能を可能にする次のステップです(うまくいけば後継者)が、JavaScriptの代わりにC#を使ってクライアントサイドのロジックを統合します。

私はBlazorの瞬間に小さなテストプロジェクトに取り組んでいます。今までは使いやすいと思っています。しかし、ブログやGitHubのページの状態に関する警告として、それは生産準備ができていない。

第三者編集:2018-09-26

.NET Conf 2018では、 Razorコンポーネント(「サーバー側Blazor」)が.N​​ET Core 3.0に含まれることが発表されました。このコードが表示されました:

// inside index.cshtml - serverside use of blazor
<SurveyPrompt Title="How is Blazor working for you?" />
<div>
     <img id="bot" src="@imageurl" />
<div>
<button class="btn btn-primary" onclick="@changeImage">Click me</button>

@functions{

    string imageurl = "/images/dotnet-bot-1.png";

    void changeImage()
    {
        if(imageurl.Contains("1"))
        {
            imageurl= imageurl.Replace("1", "2");
        } 
        else 
        {
            imageurl= imageurl.Replace("2", "1");
        }
     }
}


ライセンスを受けた: CC-BY-SA with attribution
所属していない Stack Overflow
このKBは合法ですか? はい、理由を学ぶ
ライセンスを受けた: CC-BY-SA with attribution
所属していない Stack Overflow
このKBは合法ですか? はい、理由を学ぶ