我的博客网站为什么又回归Blazor了

引言

在博客网站的开发征程中,站长可谓是一路披荆斩棘。从最初的构思到实践,先后涉足了多种开发技术,包括 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控制器等
AntBlazorCodeWFWebSite
AntBlazorCodeWFWebSite

小知识:什么是静态 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;
}

效果如下:

网站功能说明

首页

  • 网址:https://dotnet9.com

和大多数网站一样,先展示网站宣传语 ”码界工坊:使用.NET 9 Web API + Blazor开发。有技术文章、开源项目介绍和在线工具,助力高效编程。“,然后展示特色文章块,后面会加上特色工具块(正在开发中),最后是友情链接、页尾等:

文档

这里介绍了站长部分开源项目:

  • 网址:https://dotnet9.com/doc

下面是部分项目简介

  1. CodeWF

这是本站的源码仓库,可点击链接查看。

  1. CodeWF.EventBus

它适用于进程内事件传递(无其他外部依赖),功能与 MediatR 类似,可点击链接查看。

  1. CodeWF.EventBus.Socket

CodeWF.EventBus.Socket 是一个轻量级、基于 Socket 的分布式事件总线系统,旨在简化分布式架构中的事件通信。它允许进程之间通过发布 / 订阅模式进行通信,无需依赖外部消息队列服务。可点击链接查看。

  1. CodeWF.NetWeaver

CodeWF.NetWeaver 是一个简洁而强大的C#库,支持AOT,用于处理TCP和UDP数据包的组包和解包操作。可点击链接查看。

  1. CodeWF.Toolbox

CodeWF Toolbox 使用Avalonia开发的跨平台工具箱,使用了Prism做为模块化开发框架,支持AOT发布,可做为Avalonia项目学习。可点击链接查看。

  1. CodeWF.Tools

这里收集、分享了常用工具类,可点击链接查看。

  1. Assets.Dotnet9

这是本站的核心数据仓库,可点击链接查看。

博客

  • 网址:https://dotnet9.com/bbs/

博客页面是标准的技术博客风格样式,分为左、中、右三栏。左边栏是文章分类列表,点击可在中间分页浏览文章列表,右侧则是网站统计、站长推荐等内容:

点击列表中的文章可浏览文章详细内容,在此要感谢[VleaStwo](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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/58525.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Uniapp安装Pinia并持久化(Vue3)

安装pinia 在uni-app的Vue3版本中&#xff0c;Pinia已被内置&#xff0c;无需额外安装即可直接使用&#xff08;Vue2版本则内置了Vuex&#xff09;。 HBuilder X项目&#xff1a;直接使用&#xff0c;无需安装。CLI项目&#xff1a;需手动安装&#xff0c;执行yarn add pinia…

<网络> 协议

目录 文章目录 一、认识协议 1. 协议概念 2. 结构化数据传输 3. 序列化和反序列化 二、网络计算器 1. 封装socket类 2. 协议定制 request类的序列化和反序列化 response类的序列化和反序列化 报头的添加与去除 Json序列化工具 Jsoncpp 的主要特点: Jsoncpp 的使用方法: 3. Ser…

群控系统服务端开发模式-应用开发-文件上传功能开发

一、文件上传路由 在根目录下route文件夹中app.php文件中&#xff0c;添加文件上传功能路由&#xff0c;代码如下&#xff1a; Route::post(upload/file,common.Upload/file);// 上传文件接口 二、功能代码开发 在根目录下app文件夹下common文件夹中创建上传控制器并命名为Up…

pycharm小游戏贪吃蛇及pygame模块学习()

由于代码量大&#xff0c;会逐渐发布 一.pycharm学习 在PyCharm中使用Pygame插入音乐和图片时&#xff0c;有以下这些注意事项&#xff1a; 插入音乐&#xff1a; - 文件格式支持&#xff1a;Pygame常用的音乐格式如MP3、OGG等&#xff0c;但MP3可能需额外安装库&#xf…

检索增强和知识冲突学习笔记

检索增强生成任务&#xff08;Retrieval-Augmented Generation, RAG&#xff09;是一种自然语言处理技术&#xff0c;它结合了信息检索和生成模型&#xff0c;用于生成高质量的文本输出。具体来说&#xff0c;RAG 模型在生成文本时&#xff0c;会先通过检索模块从外部知识库或文…

从0开始深度学习(25)——多输入多输出通道

之前我们都只研究了一个通道的情况&#xff08;二值图、灰度图&#xff09;&#xff0c;但实际情况中很多是彩色图像&#xff0c;即有标准的RGB三通道图片&#xff0c;本节将更深入地研究具有多输入和多输出通道的卷积核。 1 多输入通道 当输入包含多个通道时&#xff0c;需要…

网管平台(进阶篇):如何正确的管理网络设备?

网络设备作为构建计算机网络的重要基石&#xff0c;扮演着数据传输、连接和管理的关键角色。从交换机、路由器到防火墙、网关&#xff0c;各类网络设备共同协作&#xff0c;形成了高效、稳定的网络系统。本文将详细介绍网络设备的种类&#xff0c;并探讨如何正确管理这些设备&a…

论文 | Teaching Algorithmic Reasoning via In-context Learning

这篇论文《通过上下文学习教授算法推理》探讨了如何通过上下文学习&#xff08;In-context Learning, ICL&#xff09;有效训练大型语言模型&#xff08;LLMs&#xff09;以进行算法推理。以下是从多个角度对这项工作的详细解读&#xff1a; 1. 问题陈述与研究动机 算法推理的…

RK3568平台(基础篇)性能分析工具

一.Linux 性能优化工具简介 Linux 系统性能指标无非就是这几个方面,CPU、内存、磁盘 I/O、文件系统、网络等相关指标。不同的性能指标都有对应的具体命令工具进行查看与监控,接下来我们将介绍一些常见的 Linux 系统性能指标及其对应的命令工具(通过命令工具找出 Linux 系统性…

2024阿里云CTF Web writeup

《Java代码审计》http://mp.weixin.qq.com/s?__bizMzkwNjY1Mzc0Nw&mid2247484219&idx1&sn73564e316a4c9794019f15dd6b3ba9f6&chksmc0e47a67f793f371e9f6a4fbc06e7929cb1480b7320fae34c32563307df3a28aca49d1a4addd&scene21#wechat_redirect 前言 又是周末…

Bartender 5 for Mac 菜单栏管理软件 安装教程【保姆级教程,操作简单小白轻松上手使用】

Mac分享吧 文章目录 Bartender 5 for Mac 菜单栏管理软件 安装完成&#xff0c;软件打开效果一、Bartender 5 菜单栏管理软件 Mac电脑版——v5.2.3⚠️注意事项&#xff1a;1️⃣&#xff1a;下载软件2️⃣&#xff1a;安装软件3️⃣&#xff1a;打开软件&#xff0c;根据自己…

职场逆袭!学会管理上司,你也能成为职场赢家

书友们&#xff0c;不要错过了&#xff01;我挖到了一本真正让我彻夜难眠的小说&#xff0c;情节跌宕起伏&#xff0c;角色鲜活得就像从书里跳出来陪你聊天。每一页都是新的惊喜&#xff0c;绝对让你欲罢不能。要是你也在寻找那种让人上瘾的阅读体验&#xff0c;这本书就是你的…

Actor-Critic方法【A2C,A3C,Policy Gradient】

强化学习笔记系列目录 第一章 强化学习基本概念 第二章 贝尔曼方程 第三章 贝尔曼最优方程 第四章 值迭代和策略迭代 第五章 强化学习实例分析:GridWorld 第六章 蒙特卡洛方法 第七章 Robbins-Monro算法 第八章 多臂老虎机 第九章 强化学习实例分析:CartPole 第十章 时序差分法…

若依管理系统使用已有 Nacos 部署流程整理

背景 玩了一下开源项目 RuoYi 管理系统Cloud 版&#xff0c;卡住的地方是&#xff1a;它用到了 nacos 配置管理&#xff0c;如果用的 nacos 环境是单机且是内置数据库的话&#xff0c;该怎么配置呢&#xff1f; 本文整理本机启动 RuoYi Cloud 应用本地部署的过程&#xff0c;…

数字信号处理-FPGA插入不同误码率的模拟源

module data_error_injector (input clk, // 时钟信号&#xff0c;50MHzinput reset, // 复位信号&#xff0c;高有效input DIN_EN, // 数据输入使能&#xff0c;高有效input [7:0] ERROR_LEVEL, // 错误等级…

对称二叉树(力扣101)

题目如下: 思路 对于这道题, 我会采用递归的解法. 看着对称的二叉树, 写下判断对称的条件, 再进入递归即可. 值得注意的是, 代码中会有两个函数, 第一个是isSymmetric,第二个是judge. 因为这里会考虑到一种特殊情况, 那就是 二叉树的根结点(最上面的那个),它会单独用…

山东布谷科技:关于直播源码|语音源码|一对一直播源码提交App Store的流程及重构建议

自从YY、六间房开启国内聊天室和秀场等网红盛行的网络红利时代以来&#xff0c;紧随其后国内各大音视频平台相应出现&#xff0c;先有映客花椒等直播平台的风头正劲&#xff0c;后有功能板块更丰富的头条抖音Tiktok等&#xff0c;盈利功能点不仅仅有直播PK连麦等礼物打赏功能&a…

k8s图形化显示(KRM)

在master节点 kubectl get po -n kube-system 这个命令会列出 kube-system 命名空间中的所有 Pod 的状态和相关信息&#xff0c;比如名称、状态、重启次数等。 systemctl status kubelet #查看kubelet状态 yum install git #下载git命令 git clone https://gitee.com/duk…

ArcGIS地理空间平台 manager 任意文件读取漏洞复现

0x01 产品描述&#xff1a; ‌ ArcGIS‌是一个综合的地理空间平台&#xff0c;由Esri开发&#xff0c;旨在为专业人士和组织提供全面的地理信息系统&#xff08;GIS&#xff09;功能。ArcGIS通过集成和连接地理环境中的数据&#xff0c;支持创建、管理、分析、映射和共享…

【Rust实现命令模式】

Rust实现命令模式 什么是命令模式命令模式的应用场景命令模式的在Rust中的关系图Rust中的命令模式代码示例运行结果总结 什么是命令模式 命令模式,即通过统一接口,如C#interface,亦或C中的抽象类的0方法,通过定义统一的接口,在定义不同的对象,为之接口实现具体的方法逻辑,再通…