Blazor中按钮点击时同步异步任务执行的最佳实践

假设点击按钮时需执行两项耗时任务：第一项非线程安全，无法异步执行；第二项为可等待的异步任务。希望UI能立即响应用户点击（例如禁用按钮），请问在isBusy = true;后添加await Task.Yield();是否为最优方案，或是有更好的实现方式？

我清楚理想状态下所有耗时操作都应异步执行以避免阻塞UI线程，但想了解在存在无法移至主线程外、也无法转为异步任务的同步操作时的有效实现方案。

代码示例 #

@using System.Threading;

<MudButton OnClick="DoSomethingAsync" Disabled="@isBusy">Do something</MudButton>

@code {
    bool isBusy;

    async Task DoSomethingAsync()
    {
        isBusy = true;
        
        Thread.Sleep(2000); // 模拟非线程安全的同步耗时任务
        
        await Task.Delay(2000); // 模拟异步耗时任务
        
        isBusy = false;
    }
}

解决方案分析 #

原代码的问题 #

原代码中设置isBusy = true后直接执行Thread.Sleep，会阻塞UI线程，导致Blazor无法立即更新按钮的禁用状态——用户点击按钮后，按钮要等到2秒的同步任务完成后才会变灰，期间UI完全卡顿，体验很差。

await Task.Yield()的作用与有效性 #

在isBusy = true后添加await Task.Yield()是有效且合适的方案，原因如下：

• Task.Yield()会让当前方法让出UI线程，将后续的执行逻辑排入UI线程的消息队列
• 这给了Blazor足够的时间先完成UI渲染，按钮会立即变为禁用状态，用户能直观看到操作正在进行
• 后续的同步任务和异步任务依然会回到UI线程执行（符合非线程安全任务的要求）

修改后的代码如下：

@using System.Threading;

<MudButton OnClick="DoSomethingAsync" Disabled="@isBusy">Do something</MudButton>

@code {
    bool isBusy;

    async Task DoSomethingAsync()
    {
        isBusy = true;
        await Task.Yield(); // 让出UI线程，优先更新UI
        
        Thread.Sleep(2000); // 模拟非线程安全的同步耗时任务
        
        await Task.Delay(2000); // 模拟异步耗时任务
        
        isBusy = false;
    }
}

是否有更好的替代方案？ #

如果尝试直接调用StateHasChanged()来强制更新UI，效果并不好——因为UI线程被后续的Thread.Sleep阻塞，Blazor依然无法立即渲染。只有让出UI线程（通过Task.Yield()）才能确保UI先更新。

唯一的补充优化点：如果同步任务耗时极长，哪怕非线程安全，也可以评估是否能通过线程安全包装（比如加锁）将其移到后台线程执行，但这需要确保任务的非线程安全限制可以通过这种方式规避。如果确实无法移出主线程，Task.Yield()就是当前场景下最优的实现方式。

内容的提问来源于stack exchange，提问作者Pawel