引言
在部落格網站的開發歷程中，站長可謂是一路披荊斬棘。從最初的構想到實踐，先後涉足了多種開發技術，包括 MVC、Razor Pages、Vue、Go、Blazor 等。在這漫長的過程中，網站版本更迭近 10 次，每一個版本都凝聚著站長的心血與探索，這段充滿挑戰的歷程詳細記錄於 分享我做 Dotnet9 部落格網站時積累的一些資料 - 碼坊。
如今，經過深思熟慮與實踐檢驗，部落格網站再次回歸 Blazor，並採用了靜態 SSR 技術，同時融入了時尚且實用的 Ant Design 設計風格。這一系列的改進使得網站的訪問速度得到了質的飛躍，如同給網站注入了新的活力，目前網站已經成功上線。
- 網址：https://dotnet9.com
開源的力量
在此，要感謝以下開源專案：
- Known: https://known.org.cn/
這是一個開源企業級開發框架，基於 Blazor 技術精心打造。它以低程式碼、跨平台、開箱即用的卓越特性，打破了傳統開發的局限，真正實現了一處程式碼，多處執行的高效模式。其核心價值在於高效與靈活，為軟體開發模式帶來了全新的變革，就像一把神奇的鑰匙，幫助開發者輕鬆開啟數位轉型的大門，從容應對各種挑戰，助力業務實現蓬勃發展，開啟嶄新篇章。
本站原始碼也是開源：
- 倉庫：https://github.com/dotnet9/CodeWF
碼坊是使用.NET 9 Blazor 開發的一個網站，這裡有技術文章，有開源專案介紹，有線上工具使用: 碼坊—文章啟智，工具助力
網站技術
網站是基於 Known 的開源專案 KnownCMS 搭建：
KnownCMS 是基於 Blazor 開發的一個內容管理系統，前台使用 Blazor 靜態元件，後台使用 Known 框架。
因為站長的網站只是一個部落格文章展示、線上工具使用，平時文章編輯也是使用 Typora 及 VS Code 搭配使用，網站核心資料檔案儲存於 Assets.Dotnet9 倉庫，所以站長去除了暫時不使用的後台管理相關功能，專案原始碼只有 3 個工程：
- AntBlazor：站長基本沒有改過該工程，基本是由 Known 提供的 Ant Design 風格 Blazor 靜態元件封裝，比如表單、標籤、按鈕之類的基本元件等。
- CodeWF：Razor 類別庫，主要實現網站文件、博文頁面封裝，目前有工具還未上線，後面會按此庫架構另開一個庫寫線上工具；
- WebSite：網站的入口工程，整合 CodeWF 和 AntBlazor 工程，當然也包括部分頁面封裝（首頁、關於、時間線等）、Web API 控制器等
| AntBlazor | CodeWF | WebSite |
 |
 |
 |
小知識：什麼是靜態 SSR？
靜態 SSR 與 Blazor Server 或 Blazor Client（WASM）有著顯著的區別，微軟文件 的說明：
靜態 SSR 是一種獨特的執行模式，在伺服器處理傳入 HTTP 請求時，元件在伺服器端執行。在此過程中，Blazor 會將元件巧妙地呈現為 HTML，並將其包含在回應內容之中。當回應發送完成後，伺服器端元件和相應的呈現器狀態會被自動丟棄，最終在瀏覽器端僅留存純淨的 HTML。
這種模式的優勢是多方面的。首先，它極大地降低了托管成本，為網站營運者減輕了經濟負擔。其次，它具有出色的可縮放性，無論是面對小規模的用戶訪問，還是大規模的流量衝擊，都能應對自如。這得益於它無需持續的伺服器資源來維持元件狀態，從而節省了大量伺服器資源。而且，它擺脫了瀏覽器和伺服器之間持續連接的束縛，同時也無需在瀏覽器中載入 WebAssembly，進一步最佳化了效能。
從更通俗易懂的角度來看，靜態 SSR 與 Blazor Server 同屬伺服器端渲染的範疇，但它在互動能力方面有所不同。在靜態 SSR 模式下，前端的 HTML 控制項不能像在 Blazor Server 中那樣使用 C# 事件方法對應，不過它仍然可以借助 JS 函數來實現互動，例如 button 的 click 事件可以對應 JS 函數進行處理。值得慶幸的是，C# 實體繫結、服務注入等重要功能在靜態 SSR 中依然可以正常使用。這一特性使得靜態 SSR 成為需要 SEO（搜尋引擎最佳化，即透過一系列技術手段提升網站在搜尋引擎中的排名，進而增加網站流量。其核心在於確保網站內容能夠被搜尋引擎有效抓取，從而獲得更多流量）的前台網站的最佳選擇。以下是一個靜態 SSR 元件定義（文章詳情基本資訊元件 UPostCount.raozr）：
@inject IOptions<SiteOption>
SiteOption
<div class="counts">
@if (Post?.Lastmod != null) {
<span>更新於@(Post?.Lastmod?.ToString("yyyy-MM-dd HH:mm:ss"))</span>
} else {
<span>建立於@(Post?.Date?.ToString("yyyy-MM-dd HH:mm:ss"))</span>
}
<span style="margin:0 5px;">|</span>
<span class="author"
>@(string.IsNullOrWhiteSpace(Post?.Author) ? SiteOption.Value.Owner :
Post!.Author)</span
>
@if (ShowEdit) {
<span style="margin:0 5px;">|</span>
<a
href="@ConstantUtil.GetPostGitHubPath(SiteOption.Value.RemoteAssetsRepository, Post)"
target="_blank"
>我要編輯、留言</a
>
}
</div>
@code { [Parameter] public BlogPost Post { get; set; } [Parameter] public bool
ShowEdit { get; set; } = true; }</SiteOption
>
效果如下：
網站功能說明
首頁
- 網址：https://dotnet9.com
和大多數網站一樣，先展示網站宣傳語 ”碼坊：使用.NET 9 Web API + Blazor 開發。有技術文章、開源專案介紹和線上工具，助力高效程式設計。“，然後展示特色文章塊，後面會加上特色工具塊（正在開發中），最後是友情連結、頁尾等：
文件
這裡介紹了站長部分開源專案：
- 網址：https://dotnet9.com/project
下面是部分專案簡介
- CodeWF
這是本站的原始碼倉庫，可點擊連結查看。
- CodeWF.EventBus
它適用於處理序內事件傳遞（無其他外部依賴），功能與 MediatR 類似，可點擊連結查看。
- CodeWF.EventBus.Socket
CodeWF.EventBus.Socket 是一個輕量級、基於 Socket 的分散式事件匯流排系統，旨在簡化分散式架構中的事件通訊。它允許處理序之間透過發布 / 訂閱模式進行通訊，無需依賴外部訊息佇列服務。可點擊連結查看。
- CodeWF.NetWeaver
CodeWF.NetWeaver 是一個簡潔而強大的 C# 程式庫，支援 AOT，用於處理 TCP 和 UDP 資料包的組包和解包操作。可點擊連結查看。
- CodeWF.Toolbox
CodeWF Toolbox 使用 Avalonia 開發的跨平台工具箱，使用了 Prism 作為模組化開發框架，支援 AOT 發布，可作為 Avalonia 專案學習。可點擊連結查看。
- CodeWF.Tools
這裡收集、分享了常用工具類別，可點擊連結查看。
- Assets.Dotnet9
這是本站的核心資料倉庫，可點擊連結查看。
部落格
- 網址：https://dotnet9.com/post
部落格頁面是標準的技術部落格風格樣式，分為左、中、右三欄。左邊欄是文章分類列表，點擊可在中間分頁瀏覽文章列表，右側則是網站統計、站長推薦等內容：
點擊列表中的文章可瀏覽文章詳細內容，在此要感謝 VleaStwo (Lee) 大佬提供的 TOC 功能：這個功能使用戶能夠快速定位文章的重點內容，提高閱讀效率。
所有文章您都可以修改
如果文章有錯別字、語病，或有誤導的地方，或您有什麼補充，可點擊頁頭右上角「我要編輯、留言」進行 PR，十分感謝！
最新一個對文章 . NET 跨平台用戶端框架 - Avalonia UI 的 PR#4：
感謝網友 hjkl950217 (長空 X)
總結
在網站的開發歷程中，站長不斷探索嘗試，學習了大量的教學和開源專案，非常受用、非常感謝提供幫助的朋友和老師。
另外，VleaStwo大佬開了一個 Masa Blazor 分支，歡迎有興趣的朋友前來 PR 或交流：
最後，貼上相關連結，大家可以了解、交流：
- 本站原始碼(Ant Design 風格)：https://github.com/dotnet9/codewf
- VleaStwo大佬分支(Masa Blazor 風格)：https://github.com/VleaStwo/CodeWF
- Known：https://known.org.cn
- Ant Design Blazor：https://antblazor.com/
- Masa Blazor：https://masastack.com/blazor