Blazor .NET 8（開発者チュートリアル）

フルスタックのWeb UIフレームワークであるBlazorは、.NET 8.0のリリースによって大きく進化しました。このアップデートは、開発者がC#と.NETを使用してインタラクティブでモダンなWebアプリケーションを構築できるようにする様々な機能と機能強化をもたらします。

この記事では、Blazor .NET 8.0 の主な側面を掘り下げ、新しいレンダリングモード、プロジェクトテンプレート、ツーリングの改善などを探ります。

Blazorレンダーモードの理解

Blazor in .NET 8.0では、3つのレンダーモードが導入されています：

1. 静的サーバーレンダリング：最適なパフォーマンスのために静的HTMLを生成します。

2. インタラクティブサーバーレンダリング: 初期レンダリングとインタラクティブ性のためにサーバーサイドASP.NET Coreランタイムを利用します。

3. インタラクティブなWebAssemblyレンダリング: クライアント上で.NET WebAssembly実行環境を利用して、その後のレンダリングおよびインタラクティブ性を実現します。

多用途のインタラクティブ自動レンダリング

ハイライトの一つは、インタラクティブオートレンダリングモードです。これは、コンテンツのサーバーサイドレンダリングと、その後、クライアント上での.NET WebAssemblyランタイムを使用したレンダリングとインタラクティビティを組み合わせたものです。これにより、アプリの起動が速くなり、開発者にとって魅力的なオプションとなります。

Blazor Web App テンプレートの紹介

.NET 8.0は、Blazor ServerとBlazor WebAssemblyのホスティングモデルの強みを結集した統合的な出発点となるBlazor Webアプリテンプレートを導入しました。

このテンプレートには、静的サーバーレンダリング、ストリーミングレンダリング、ナビゲーションの強化、およびフォーム処理などの新機能が組み込まれています。 プロジェクトテンプレートの統合により、開発プロセスが簡素化されます。

Blazor Webアプリケーションのためのスリム化されたJSイニシャライザー

従来のJSイニシャライザーは、新しいBlazor Webアプリ向けのセットに置き換えられ、読み込みプロセスのカスタマイズ、ログレベルの設定、その他のオプションに対するより良いコントロールを提供します。 この変更は開発体験を向上させ、.NET 8.0でホスティングモデルを統一するという目標に一致しています。

プリレンダリングと統合ガイダンスの分割

プリアレンダリングと統合に関するガイダンスについて、より焦点を絞ったカバーを提供するために、記事を別々に分けました。 この変更は、理解と実装を簡素化し、開発者がベストプラクティスに従いやすくすることを目的としています。

Blazor Webアプリにおける簡単な状態永続化

Blazor Web アプリは、プリレンダリング中に作成された登録済みのアプリレベルの状態を自動的に保持するようになりました。 これにより、Persist Component State Tag Helper が不要になり、コンポーネントの状態を永続化および読み取るプロセスが簡素化されます。

フォーム処理とモデルバインディングの強化

.NET 8.0 は、Blazorコンポーネントに対するフォーム処理機能を向上させ、モデルバインディングやデータ検証を含む機能を追加しました。 フレームワークはデータ契約属性を尊重し、開発者にフォームデータがモデルにバインドされる方法に対するより多くの制御を提供します。 フォーム送信に対する追加のセキュリティ層として、偽造防止サポートが導入されました。

ナビゲーションとフォームハンドリングの強化

Blazor .NET 8.0の静的サーバーレンダリングは、ページナビゲーションとフォーム処理において大幅な改良を導入します。 従来、ナビゲーションやフォームの送信時にはページ全体のリフレッシュが行われていました。

強化されたナビゲーション機能により、Blazorはリクエストをインターセプトし、フェッチリクエストを実行して、レンダリングされたレスポンスコンテンツをシームレスにブラウザのDOMにパッチします。 これにより、ページ全体のリフレッシュを避け、ページの状態をより多く保持しながら、より速くスムーズなページの読み込みが実現されます。

拡張ナビゲーションは、Blazorスクリプト（blazor.web.js）が読み込まれるとデフォルトで有効になりますが、特定のフォームに対してオプションで有効にすることもできます。 新しい強化されたナビゲーションAPIにより、開発者はプログラム的に現在のページをリフレッシュでき、ユーザーエクスペリエンスにさらに多くの制御を提供します。

ストリーミングレンダリング

Blazor .NET 8.0は、長時間実行される非同期タスクを処理するページのユーザーエクスペリエンスを向上させる強力な機能であるストリーミングレンダリングを導入します。 ストリーミングレンダリングを使用すると、非同期操作が進行中の間に、ページはプレースホルダーコンテンツをレンダリングできます。

完了すると、更新されたコンテンツは同じ応答接続でクライアントにストリームされ、シームレスにDOMにパッチされます。 このアプローチにより、アプリのメインレイアウトが迅速にレンダリングされ、コンテンツが利用可能になるとすぐにページが更新されます。

キー付きサービスインジェクション

Blazorは、Inject属性を使用してキー付きサービスの注入をサポートしました。 キーは、依存性注入シナリオにおいてサービスの登録と消費の範囲を指定することを可能にします。

新しいInjectAttribute.Keyプロパティにより、開発者は注入するサービスのキーを指定できるようになり、サービスのスコープ設定に新たな可能性を開きます。

カスケードパラメータとしてHttpContextにアクセスする

Blazor .NET 8.0 は、現在の HttpContext を静的サーバーコンポーネントからカスケードパラメーターとしてアクセスできる機能を導入します。 この拡張機能は、HTTPコンテキストに関連するヘッダーや他のプロパティの検査および変更に特に役立ちます。

ASP.NET Core以外でのRazorコンポーネントのレンダリング

Blazor .NET 8.0は、HTTPリクエストのコンテキスト外でRazorコンポーネントをレンダリングする可能性を開きます。この柔軟性により、開発者はASP.NET Coreホスティング環境に依存せずに、Razorコンポーネントを文字列またはストリームに直接レンダリングすることができます。

この機能は、メールや静的なサイトコンテンツなどのHTMLフラグメントを生成する必要があるシナリオに特に便利です。

セクションサポート

Blazor .NET 8.0では、SectionOutlet および SectionContentコンポーネントの導入により、コンテンツ管理が革新されます。 これらのコンポーネントを使用すると、開発者はレイアウト内にプレースホルダーを定義し、後で特定のページによりそれらを埋めることができます。

セクションは、ユニークな名前またはオブジェクトIDを使用して参照でき、動的なウェブレイアウトの構築において柔軟性と再利用性を提供します。

エラーページのサポート

Blazor Webアプリ が .NET 8.0 で強力なエラーページのサポートを利用できるようになり、開発者はASP.NET Coreの例外処理ミドルウェアと共に使用するカスタムエラーページを定義することができます。

デフォルトのエラーページ（Components/Pages/Error.razor）は、一貫したユーザーエクスペリエンスを提供します。 インタラクティビティが有効になっている場合でも、エラーページは静的サーバーコンポーネントとしてレンダリングされ、例外シナリオ中に安定性を確保します。

QuickGrid が実験的なものから必須のものへ

QuickGrid、高性能グリッドコンポーネントは、実験的ステータスから卒業し、.NET 8 における Blazor フレームワークの重要な一部となりました。

このコンポーネントは、並べ替え、フィルタリング、ページング、仮想化といった強力な機能を提供しながら、表形式データの表示を簡素化します。 ASP.NET Core Blazor の QuickGrid ドキュメントで QuickGrid について詳しく学ぶ。

要素名へのルート

Blazor .NET 8.0は、標準的なURLフラグメントを使用してページ内の特定のHTML要素に直接移動するクライアントサイドルーティングのサポートを導入しました。 HTML要素に標準のid属性で識別子を指定すると、URLフラグメントがその要素の識別子と一致したときにBlazorが自動的にその要素までスクロールします。

ルートレベルのカスケード値

Blazor .NET 8.0では、カスケード値を強化し、ルートレベルのカスケード値を導入しています。これによって、コンポーネント階層全体に対してカスケード値が登録できるようになります。 名前付きカスケード値と更新通知のサブスクリプションがサポートされるようになり、柔軟性とコントロールが向上しました。

空のコンテンツを仮想化

Virtualizeコンポーネントの新しいEmptyContentパラメーターにより、コンポーネントが読み込まれたとき、項目が空であるかItemsProviderResult<T>.TotalItemCountがゼロの場合に、開発者がコンテンツを提供できるようになります。

これにより、開発者はより直感的でユーザーフレンドリーなインターフェースを作成できるようになります。

回路管理およびSignalR監視

Blazor .NET 8.0は、残りの対話型サーバーコンポーネントがない場合に回路を閉じる機能を導入しています。 この最適化はサーバーリソースを解放し、全体的なパフォーマンスを向上させます。

さらに、開発者はサーバーサイドアプリでCircuitHandlerのCreateInboundActivityHandlerメソッドを使用して、インバウンド回路アクティビティを監視できるようになりました。

Jiterpreterによるさらに高速なランタイムパフォーマンス

Jiterpreterは、.NET 8の新しいランタイム機能であり、WebAssembly上で実行する際に部分的なJust-in-Time (JIT) コンパイルのサポートを導入します。 これにより実行時のパフォーマンスが向上し、Blazor WebAssemblyアプリケーションを操作するユーザーにとってスムーズな体験が提供されます。

Ahead-of-Time (AOT) SIMDおよび例外処理

Blazor WebAssemblyのAOTコンパイルは、現在デフォルトでWebAssemblyの固定幅SIMDおよびWebAssemblyエクセプションハンドリングを使用しています。 この戦略的な選択は実行時の性能を大幅に向上させ、より効率的で迅速なユーザー体験を提供します。

ウェブ対応のデプロイメント用Webcilパッケージ化

Blazor WebAssembly は現在、Webcil、.NET アセンブリのウェブフレンドリーなパッケージングを利用しています。 これは、.dllファイルのダウンロードや使用をブロックする環境における互換性を確保し、デプロイメントの課題に対応します。 Blazor WebAssembly アプリでは Webcil がデフォルトで有効になっています。

Blazor WebAssembly デバッグの改善

Blazor WebAssembly アプリのデバッグは、.NET 8 でよりスムーズになりました。デバッガーは、Visual Studioの設定にある場所からシンボルデータをダウンロードし、NuGet パッケージを利用するアプリのデバッグ体験を向上させます。

さらに、現在はデバッグがFirefoxでサポートされています。リモートデバッグの設定と.NET WebAssemblyデバッグプロキシを通じた接続が必要です。

コンテンツ セキュリティ ポリシー (CSP) の互換性

.NET 8.0のBlazor WebAssemblyでは、コンテンツセキュリティポリシー（CSP）を指定する際に、unsafe-evalスクリプトソースを有効にする必要がなくなりました。 この強化により、セキュリティ設定が簡素化され、Blazor WebAssemblyアプリケーションに対して強力なCSPを適用することが容易になります。

コンポーネントライフサイクル外での例外処理

ComponentBase.DispatchExceptionAsync の導入により、開発者はRazorコンポーネントのライフサイクル呼び出しスタック外でスローされた例外を処理することができます。

この機能は、コンポーネントのコードが例外をライフサイクルメソッドの例外として扱うことを可能にし、より一貫した制御されたエラーハンドリングメカニズムを保証します。

Iron Suiteの紹介

Iron Software の Iron Suite は、Iron Software によって開発された、いくつかの便利なライブラリで構成されており、開発者が強力な Blazor アプリを構築することを可能にします。 これは、PDF 機能、Excel または CSV ファイル機能、画像からテキストへの認識、バーコードおよび QR コードの生成と読み取り、ファイルの圧縮または解凍の機能を追加するためのソリューションを提供します。

Iron Suiteは、Blazor WebAssemblyホスティングモデルや、Blazor WebAssemblyアプリ、Blazorサーバーアプリ、ASP.NET Core MVC APP、ASP.NET core WEB API、.NETランタイムで構築されたアプリケーションなど、Microsoftテクノロジーを使用したWeb開発に最適です。

Iron Suiteのライブラリ

1. IronPDF は、PDFファイルの作成、操作、およびデータ抽出をシームレスに行います。

   IronPDFの際立った機能は、レイアウトとスタイルを完全に保存してHTMLをPDFに変換することです。 ウェブコンテンツから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

2. IronOCR（光学式文字認識）は、スキャンされた画像やPDFからテキストを抽出し、データのアクセス性を向上させます。

3. IronXLは、Excelスプレッドシートの読み取り、書き込み、および操作を効率的に行うためのツールです。

4. IronBarcodeは、さまざまな形式でのバーコードの生成と読み取りを行い、データのエンコードと取得を容易にします。

5. IronQR は、機械学習を使用してQRコードを作成および読み取るためのツールです

6. IronWebScraper は、ウェブサイトから貴重なデータを抽出し、ウェブベースのアプリケーションの機能を強化します。

7. IronZIP は、ファイルの圧縮および解凍により、データの保存と転送プロセスを効率化します。

   

Iron Suiteが選ばれる理由

1. 投資の価値を最大限に引き出し、わずか2つの個別製品の価格でスイート全体にアクセスできます。

2. Windows、macOS、またはLinuxで作業しているかどうかにかかわらず、Iron Suiteは（ほぼ）すべてのプラットフォームでの互換性を保証します。

3. ダウンロードから本稼働までの迅速な移行を体験し、最短5分で立ち上げて実行することができます。

4. 開発プロセス全体を通じて、明確さと指導を提供するすべての機能に関する詳細なドキュメントと例にアクセスできます。

5. エンジニアの専任チームが24時間週5日体制でご質問にお答えし、スムーズな開発体験をサポートいたします。

6. Iron Suiteは30日間の無条件返金ポリシーを提供しており、安心して使用いただけます。

結論

結論として、Blazor .NET 8.0 のリリースは、C# および .NET を使用したフルスタックウェブUI開発の進化における重要なマイルストーンとなります。

新しいレンダリングモードの導入、Blazor Webアプリテンプレート、強化されたナビゲーション、およびその他多数の機能により、最新でインタラクティブなWebアプリケーションを作成しようとする開発者にとって魅力的な選択肢となります。

Blazor .NET 8.0 には、フォーム処理の強化、ストリーミングレンダリング、キー付きサービスの注入可能性などの魅力的な機能が導入されており、開発に深みと柔軟性を加えています。

Iron Softwareによって提供されるIron Suiteの導入は、Blazorの機能を補完し、.NETエコシステム内でのドキュメント関連タスクのための包括的なツールキットを提供します。

Blazor .NET 8.0は、Iron Suite を利用することで、開発者が堅牢で機能豊富なWebアプリケーションを作成することを可能にします。

強力な機能、パフォーマンスの向上、そして活気ある開発者コミュニティのサポートを組み合わせることで、Blazorは現代のウェブ開発において魅力的な選択肢となります。