.NET ヘルプ

Razor vs Blazor レイザー vs ブレイザー

公開済み 2022年12月18日
共有:

RazorBlazorは、Visual Studio開発環境でWebアプリケーションを作成するための最も人気のあるWeb UIフレームワークの2つです。 このブログ記事では、構文、相互作用、利点、欠点に基づいて、これら2つの.NET技術の類似点と相違点を検証します。 次のコード例とともにいくつかのユースケースを示します。


ASP.NET CoreのRazorとBlazorとは何ですか?

Razor (レイザー)

Razorは、開発者がHTMLと埋め込みの.NETサーバーサイドコードを使用して動的にウェブページを作成することを可能にする、サーバーサイドマークアップ言語です。 RazorはC#またはVBで記述されたwebページテンプレートファイルであるRazorページからwebページを生成します。 VBコードで書かれたRazorページは .vbhtml ファイル拡張子を使用し、C#コードで書かれたRazorページは .cshtml ファイル拡張子を使用します。

現代のASP.NETウェブアプリケーションはRazorをサポートしており、従来のASP.NETマークアップの代わりに使用してアプリケーションのビューコンポーネントを生成することができます。

Blazor

Blazorは、C#と.NETを使ってクライアント側のWebアプリケーションを構築できるフレームワークです。Blazorは、WebAssemblyを使用してブラウザで直接実行されるため、エンドユーザーにより高速で応答性の高い体験を提供します。このフレームワークは、JavaScriptコードと相互運用可能で、既存のJavaScriptライブラリやフレームワークと一緒に使用することができます。

IronPDF for .NETをBlazorアプリケーションに統合すると、高品質なPDF生成や操作が可能になります。例えば、HTMLをPDFに変換する機能や、PDFからテキストを抽出する機能を簡単に実装できます。IronPDFは、.NET Coreと互換性があり、クロスプラットフォームアプリケーションの開発をサポートします。

BlazorとIronPDFを利用することで、エンドツーエンドのWebソリューションを迅速に開発し、ユーザーに優れたパフォーマンスと機能を提供することができます。

Blazorは、開発者が.NETプログラミング言語を使用して、インタラクティブなクライアント側インターフェイスアプリケーションを構築できるウェブアプリケーションフレームワークです。 Blazorで構築されたWebアプリケーションはシングルページアプリケーションです。(シングルページアプリケーション)ウェブブラウザクライアント内で実行される(ウェブサーバーではない). ブラウザ側のアプリ実行は、WebAssemblyによって可能になります。 WebAssemblyは、.NETソースコードを実行できる最新のWebブラウザすべてに見られるクロスプラットフォームの命令セットライブラリです。

Blazor を使えば、開発者は C#、HTML、CSS を使って、再利用可能でインタラクティブなクライアントサイドのウェブコンポーネントを作成することができます。(JavaScriptを組み込む必要なく). さらに、これらのコンポーネントはC#で記述されているため、開発者は必要に応じて実装の詳細をソースコードとライブラリとしてクライアントとサーバーの間で行き来できる柔軟性を持っています。

Blazor は Razor コンポーネントを使用しますか?

Blazor は完全に Razor 構文をサポートしています。 以下の例を考えてみてください。ループや条件文など、Razorの完全なマークアップ機能セットを使用してBlazorアプリを構築することができます。

@page "/HelloWorld"

<h1>
   Example Component
</h1>

@foreach(var person in People){
    <h2>person.FirstName</h2>
}
@page "/HelloWorld"

<h1>
   Example Component
</h1>

@foreach(var person in People){
    <h2>person.FirstName</h2>
}
'INSTANT VB TODO TASK: The following line could not be converted:
page "/HelloWorld" (Of h1) Example Component </h1> foreach(var person in People)
If True Then
	(Of h2) person.FirstName</h2>
End If
VB   C#

RazorとBlazorの関連性

BlazorとRazorの間には明確な関係があることがはっきりとわかります。 結局のところ、Blazorという名前自体が「ブラウザ」と「レイザー」という言葉の組み合わせです。

RazorとBlazorは、どちらもHTMLとC#を使用してWebアプリケーションを作成するために使用されます。 これらはオープンソースで無料のため、開発者はすぐに制限なしに利用することができます。 ASP.NETウェブアプリケーションを開発する際には、Razor構文を使用します。これはASP.NET CoreやASP.NET MVCとより類似しているためです。

Blazorは、Razor構文で記述された1つまたは複数のコンポーネントから柔軟でインタラクティブなユーザーインターフェイスを構築します。

ここで一つ重要な区別をする必要があります。BlazorにおいてRazorはコンポーネントを構築するために使用されます。(ボタン、ページ要素など), そして全体のページを構築するのではなく。

さらに、Razor ファイル(.chtml拡張子のファイル)Blazor内では、正式には「Razorコンポーネント」と呼ばれ、「Blazorコンポーネント」とは呼ばれません。(この2つの単語は、多くの開発サークルで同じ意味で使われていますが).

Razor PagesおよびBlazor Serverの動作

Razorは、MVCアプリケーション内で機能し、完全なページをブラウザに提供します。

Razor 対 Blazor、図 1: アクション中の Razor ページ

アクション中のRazor Pages

ユーザーがボタンやリンクをクリックすると、ブラウザがサーバーにリクエストを送り、データベースにアクセスして.cshtml Razor Viewsを取得します。(またはRazorページ)データとマークアップを一緒にまとめて、全体をブラウザに返します(ページ全体の再レンダリング).

一方、BlazorはRazor構文で記述された一連の小さなコンポーネントを使用して、ウェブページ全体を作成することができます。

Razor対Blazor、図2: Blazorの動作中

Blazorの実践

Blazor WebAssemblyの動作を示しています(Blazor WASM).

最初のBlazor WASMアプリケーションの呼び出しは、JavaScriptを使用して作成されたSingle Page Applicationのように、定義したすべてのコンポーネントを含む完全なプログラムを返します。

これらの要素にアクセスできるようになったブラウザは、情報やイベントに応じてこれらを表示、非表示、および更新することができます。

このようにして、Blazorアプリは、VueやAngularのような「最新の」JavaScriptライブラリ/フレームワークを使用して開発するアプリケーションに似ています。 Blazor アプリケーションはブラウザー内で実行中にデータを取得および送信するためにバックエンドにネットワーク呼び出しを行います。

それでは、BlazorアプリとRazorビューエンジンの利点と欠点について話し合いましょう。

BlazorとRazorの長所と短所

.NETフレームワークで構築されたインタラクティブなWebアプリケーションを作成する場合、BlazorとRazorはどちらも非常に好まれています。 これらの技術は、標準的なJavaScriptプロジェクトの主要なプログラミング言語としてC#を利用することからの新しい移行を提供します。

RazorやBlazorを使ってウェブアプリケーションを作成する際に考慮すべき利点と欠点をいくつか紹介します。

Blazor の利点

  • クライアントサイドBlazorは、WebAssemblyを使用してブラウザ内で直接.NETコードを実行します。(ネットワーク帯域幅の無駄を省き、より迅速に。)動的なウェブコンテンツを提供します。
  • サーバーサイド言語と同じ構文とロジックを使用しているため、すべての.NETライブラリおよびツールと互換性があります。

Blazorの欠点

  • Blazorを使用したクライアントサイドの.NETアプリケーション実行には、限られた.NETツールとデバッグサポートしか利用できません。
  • クライアントサイドBlazorのパフォーマンス上の利点は、サーバーサイドの実装には存在しません。

Razorの利点

  • レイザーは、論理的な(条件付き)ウェブページへのC#コードの挿入。
  • Razor は柔軟性が高く、さまざまなアプリの作成に使用できます。
  • Razorの構造はよく整理されています。

Razorの欠点

  • 動的なクライアント側のインタラクションを実装するには、JavaScriptが必要です。
  • 複数の自己完結型ページはRazorで管理および維持するのが難しい場合があります。

    HTML to PDF effortlessly.IronPDFでHTMLをPDFへ、レイアウトとスタイルを保持します。 この機能は、レポート、請求書、ドキュメントなどのWebベースのコンテンツからPDFを生成するのに理想的です。 HTMLファイル、URL、およびHTML文字列はすべてPDFに変換できます。

using IronPdf;

class Program
{
    static void Main(string[] args)
    {
        var renderer = new ChromePdfRenderer();

        // 1. Convert HTML String to PDF
        var htmlContent = "<h1>Hello, IronPDF!</h1><p>This is a PDF from an HTML string.</p>";
        var pdfFromHtmlString = renderer.RenderHtmlAsPdf(htmlContent);
        pdfFromHtmlString.SaveAs("HTMLStringToPDF.pdf");

        // 2. Convert HTML File to PDF
        var htmlFilePath = "path_to_your_html_file.html"; // Specify the path to your HTML file
        var pdfFromHtmlFile = renderer.RenderHtmlFileAsPdf(htmlFilePath);
        pdfFromHtmlFile.SaveAs("HTMLFileToPDF.pdf");

        // 3. Convert URL to PDF
        var url = "http://ironpdf.com"; // Specify the URL
        var pdfFromUrl = renderer.RenderUrlAsPdf(url);
        pdfFromUrl.SaveAs("URLToPDF.pdf");
    }
}
using IronPdf;

class Program
{
    static void Main(string[] args)
    {
        var renderer = new ChromePdfRenderer();

        // 1. Convert HTML String to PDF
        var htmlContent = "<h1>Hello, IronPDF!</h1><p>This is a PDF from an HTML string.</p>";
        var pdfFromHtmlString = renderer.RenderHtmlAsPdf(htmlContent);
        pdfFromHtmlString.SaveAs("HTMLStringToPDF.pdf");

        // 2. Convert HTML File to PDF
        var htmlFilePath = "path_to_your_html_file.html"; // Specify the path to your HTML file
        var pdfFromHtmlFile = renderer.RenderHtmlFileAsPdf(htmlFilePath);
        pdfFromHtmlFile.SaveAs("HTMLFileToPDF.pdf");

        // 3. Convert URL to PDF
        var url = "http://ironpdf.com"; // Specify the URL
        var pdfFromUrl = renderer.RenderUrlAsPdf(url);
        pdfFromUrl.SaveAs("URLToPDF.pdf");
    }
}
Imports IronPdf

Friend Class Program
	Shared Sub Main(ByVal args() As String)
		Dim renderer = New ChromePdfRenderer()

		' 1. Convert HTML String to PDF
		Dim htmlContent = "<h1>Hello, IronPDF!</h1><p>This is a PDF from an HTML string.</p>"
		Dim pdfFromHtmlString = renderer.RenderHtmlAsPdf(htmlContent)
		pdfFromHtmlString.SaveAs("HTMLStringToPDF.pdf")

		' 2. Convert HTML File to PDF
		Dim htmlFilePath = "path_to_your_html_file.html" ' Specify the path to your HTML file
		Dim pdfFromHtmlFile = renderer.RenderHtmlFileAsPdf(htmlFilePath)
		pdfFromHtmlFile.SaveAs("HTMLFileToPDF.pdf")

		' 3. Convert URL to PDF
		Dim url = "http://ironpdf.com" ' Specify the URL
		Dim pdfFromUrl = renderer.RenderUrlAsPdf(url)
		pdfFromUrl.SaveAs("URLToPDF.pdf")
	End Sub
End Class
VB   C#

結論

RazorはAPIロジックおよびサーバーサイドのテンプレート処理を扱うことができますが、JavaScriptベースでないクライアントサイドのロジックを扱うことはできません。 Blazorは、プログラマーがクライアントとサーバーサイドの機能をC#だけで扱うことを可能にします。 Razorはテンプレートのためのマークアップ構文です。 それはサーバーサイドのコードをHTMLに組み込みます。 一方で、BlazorはSPAフレームワークであり、状況に応じてBlazor WebAssemblyまたはBlazor Serverのいずれかで実行できます。

IronPdfを見るPDF ファイルを作成、読み取り、更新、操作する最も簡単な方法は、次のとおりです。Razor アプリケーション以下のコンテンツを日本語に翻訳してください:Blazor アプリケーション. IronPDFは...の一部ですIron SoftwareのIron Suiteこの翻訳には、Excel、PDF、BarCode、QRコード、画像を使用したRazorまたはBlazorウェブアプリの作成に役立つ5つの便利なライブラリが含まれています。

Iron Suiteは個人使用のために無料で利用可能です。 商用ライセンスの取得に関する詳細については、以下をご覧ください。Suite ライセンス情報.

< 以前
Blazorフレームワークとは(開発者向けチュートリアルの仕組み)
次へ >
NuGetとは何ですか?