0

0

C# Blazor流式渲染方法 C#如何使用Streaming Rendering提升感知性能

月夜之吻

月夜之吻

发布时间:2026-02-18 10:41:02

|

453人浏览过

|

来源于php中文网

原创

blazor server 中 rendermode 设为 streaming 无效需确认:使用 addinteractiveservercomponents()、signalr 启用 enablestreaming、组件声明 @rendermode interactiveserver,且耗时操作必须正确 await 才能触发流式渲染。

c# blazor流式渲染方法 c#如何使用streaming rendering提升感知性能

Blazor Server 中 RenderMode 设为 Streaming 无效?先确认运行模式

Blazor 的流式渲染(Streaming Rendering)仅在 Blazor Server 模式下原生支持,且必须配合 InteractiveServer 渲染模式和启用流式传输通道。如果你在 Blazor WebAssembly 或未启用 SignalR 流式支持的 Server 部署中尝试设置 Streaming,它会被静默忽略或直接报错。

关键判断点:

  • Program.cs 中注册组件时用了 AddInteractiveServerComponents() 而非 AddInteractiveWebAssemblyComponents()
  • 服务器端 SignalR Hub 配置启用了流式:默认 Blazor Server 模板已启用,但若自定义了 HubOptions,需确保 EnableStreamingtrue(.NET 8+ 默认开启)
  • 客户端浏览器控制台无 Failed to start streaming render batch 类错误

StreamRenderer 不是公开 API:别手动 new 它

你查文档或反编译时可能看到 StreamRenderer 类,但它属于内部实现,不是供开发者直接调用的公开类型。试图实例化或注入它会导致编译失败或运行时异常(如 System.MissingMethodException)。

正确做法是通过组件级声明启用流式渲染:

Nimo.space
Nimo.space

智能画布式AI工作台

下载
  • 在 Razor 组件顶部使用 @rendermode InteractiveServer(.NET 8+)
  • 或在 _Imports.razor 全局配置后,对特定组件加 @attribute [RenderModeProvider(typeof(InteractiveServerRenderMode))]
  • 流式行为由框架自动触发——当组件首次渲染耗时较长(如查询数据库、加载大列表),且服务端响应分块发送时,框架会自动切到流式批次(streamed batch)

感知性能提升的关键不在“开流式”,而在“拆长任务”

开启流式本身不加速计算,它只是让 HTML 分块到达浏览器,让用户更快看到首屏内容。真正影响感知性能的是服务端同步阻塞操作。常见误区是以为设了 Streaming 就能解决卡顿,其实没拆任务照样白搭。

必须配合以下实践:

  • 把耗时操作(如 HttpClient.GetAsyncDbContext.ToListAsync)显式标记为 async/await,避免阻塞主线程
  • 避免在 OnInitializedAsync 中执行多个串行 await;考虑用 Task.WhenAll 并行加载独立数据源
  • 对大数据列表,启用虚拟滚动(Virtualize 组件),而非一次性 @foreach 渲染上千项
  • 服务端日志中观察 Microsoft.AspNetCore.Components.Server.Circuits.CircuitHost 是否频繁记录 Streaming render batch started —— 这才是流式真正生效的信号

调试流式是否生效:看 Network 和服务端日志

浏览器 DevTools 的 Network 标签页看不到单独的 “streaming” 请求,因为它是复用同一个 SignalR 连接的二进制帧。但你能验证效果:

  • 在服务端代码中插入 Thread.Sleep(2000) 模拟慢渲染(仅开发环境!),然后观察浏览器是否先显示骨架 UI,2 秒后再填充内容 —— 这说明流式生效
  • 启用 Microsoft.AspNetCore.Components.Server.Circuits 日志级别为 Debug,启动时会输出类似:
    dbug: Microsoft.AspNetCore.Components.Server.Circuits.CircuitHost[100]<br>      Streaming render batch started for circuit 'xxx'
  • 若看到 Failed to start streaming render batch: The circuit is not in a streaming-capable state,大概率是 SignalR 连接断开或降级到了轮询模式

流式渲染的边界很清晰:它不改变总耗时,只改变用户等待的“心理时间”。最容易被忽略的是——一旦组件内出现未 await 的 async 方法调用(比如忘了写 await),整个流式链条就退化为普通同步渲染,首屏等待时间立刻拉满。

相关文章

数码产品性能查询
数码产品性能查询

该软件包括了市面上所有手机CPU,手机跑分情况,电脑CPU,电脑产品信息等等,方便需要大家查阅数码产品最新情况,了解产品特性,能够进行对比选择最具性价比的商品。

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
php中foreach用法
php中foreach用法

本专题整合了php中foreach用法的相关介绍,阅读专题下面的文章了解更多详细教程。

182

2025.12.04

线程和进程的区别
线程和进程的区别

线程和进程的区别:线程是进程的一部分,用于实现并发和并行操作,而线程共享进程的资源,通信更方便快捷,切换开销较小。本专题为大家提供线程和进程区别相关的各种文章、以及下载和课程。

675

2023.08.10

线程和进程的区别
线程和进程的区别

线程和进程的区别:线程是进程的一部分,用于实现并发和并行操作,而线程共享进程的资源,通信更方便快捷,切换开销较小。本专题为大家提供线程和进程区别相关的各种文章、以及下载和课程。

675

2023.08.10

Java 并发编程高级实践
Java 并发编程高级实践

本专题深入讲解 Java 在高并发开发中的核心技术,涵盖线程模型、Thread 与 Runnable、Lock 与 synchronized、原子类、并发容器、线程池(Executor 框架)、阻塞队列、并发工具类(CountDownLatch、Semaphore)、以及高并发系统设计中的关键策略。通过实战案例帮助学习者全面掌握构建高性能并发应用的工程能力。

94

2025.12.01

JavaScript中的typeof用法
JavaScript中的typeof用法

在JavaScript中,typeof是一个用来确定给定变量的数据类型的操作符。可以用来确定一个变量是字符串、数字、布尔值、函数、对象或undefined的数据类型。更多关于typeof用法相关文章,详情请看本专题下面的文章,php中文网欢迎大家前来学习。

763

2023.11.23

数据库三范式
数据库三范式

数据库三范式是一种设计规范,用于规范化关系型数据库中的数据结构,它通过消除冗余数据、提高数据库性能和数据一致性,提供了一种有效的数据库设计方法。本专题提供数据库三范式相关的文章、下载和课程。

373

2023.06.29

如何删除数据库
如何删除数据库

删除数据库是指在MySQL中完全移除一个数据库及其所包含的所有数据和结构,作用包括:1、释放存储空间;2、确保数据的安全性;3、提高数据库的整体性能,加速查询和操作的执行速度。尽管删除数据库具有一些好处,但在执行任何删除操作之前,务必谨慎操作,并备份重要的数据。删除数据库将永久性地删除所有相关数据和结构,无法回滚。

2093

2023.08.14

vb怎么连接数据库
vb怎么连接数据库

在VB中,连接数据库通常使用ADO(ActiveX 数据对象)或 DAO(Data Access Objects)这两个技术来实现:1、引入ADO库;2、创建ADO连接对象;3、配置连接字符串;4、打开连接;5、执行SQL语句;6、处理查询结果;7、关闭连接即可。

355

2023.08.31

pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法
pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法

本专题系统整理pixiv网页版官网入口及登录访问方式,涵盖官网登录页面直达路径、在线阅读入口及快速进入方法说明,帮助用户高效找到pixiv官方网站,实现便捷、安全的网页端浏览与账号登录体验。

462

2026.02.13

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
极客学院Java8新特性视频教程
极客学院Java8新特性视频教程

共17课时 | 3.8万人学习

C# 教程
C# 教程

共94课时 | 9.7万人学习

C 教程
C 教程

共75课时 | 4.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号