pyscript 中的 python 代码默认运行在浏览器主线程，会阻塞 html 动画、css 加载效果及用户交互；通过 `async/await` 分片执行或等待 web worker 支持，可实现非阻塞式图像处理等耗时任务。
在使用 PyScript 进行图像处理（如汉明码、里德-所罗门码编解码）时，你可能会遇到一个典型问题：Python 脚本执行时间较长，导致整个页面“卡死”——CSS 加载动画暂停、按钮无法点击、滚动失效。这不是代码逻辑错误，而是浏览器渲染机制决定的：PyScript 当前完全运行在浏览器主线程上，与 JavaScript 同构，不支持原生多线程或多进程（threading 和 multiprocessing 在 Pyodide 环境中不可用）。
✅ 正确解法：使用异步协程主动让出控制权
虽然无法真正并行，但你可以将长任务拆分为多个小步骤，并在每步之间插入 await asyncio.sleep(0) —— 这并非真正“休眠”，而是向浏览器事件循环发出信号：“我暂且交出控制权，请先处理 UI 更新、动画帧、用户输入等”。这样，CSS 动画能持续播放，按钮仍可响应，用户体验显著改善。
以下是一个适用于图像处理流程的结构化示例：
import asyncio
import pyscript
# 模拟耗时图像处理步骤（实际中替换为 numpy/Pillow/OpenCV 操作）
def step_load_image():
pyscript.write("status", "✅ 步骤1：加载图像...")
# 实际代码：img = PIL.Image.open(...)
def step_encode_hamming():
pyscript.write("status", "⏳ 步骤2：汉明编码中...")
# 实际代码：encoded = hamming_encode(img_array)
def step_apply_rs():
pyscript.write("status", "⚡ 步骤3：里德-所罗门纠错...")
# 实际代码：corrected = rs_decode(encoded)
def step_save_result():
pyscript.write("status", "? 步骤4：保存结果...")
# 实际代码：img.save("output.png")
# 异步主函数：分步执行 + 主动让权
async def run_image_pipeline():
step_load_image()
await asyncio.sleep(0) # ← 关键：让出主线程，触发 UI 更新
step_encode_hamming()
await asyncio.sleep(0)
step_apply_rs()
await asyncio.sleep(0)
step_save_result()
pyscript.write("status", "? 处理完成！可下载结果。")
# 启动任务（不阻塞）
asyncio.ensure_future(run_image_pipeline())
? 提示：await asyncio.sleep(0) 是当前最轻量、最可靠的“yield”方式。避免使用 sleep(0.1) 或更大值，否则会人为引入延迟；0 表示立即返回事件循环，无实际等待。
⚠️ 注意事项与进阶建议
- 不要在 async 函数中调用纯同步阻塞函数（如 time.sleep()、未异步封装的 cv2.imread()），它们仍会冻结页面；
- 所有耗时操作应尽量使用 Pyodide 兼容的异步友好库（如 micropip 安装的 pillow 已优化部分 I/O）；
- 若需真正隔离 CPU 密集型任务，可关注 PyScript Web Worker 支持进展（已进入实验阶段），未来可通过 Worker 在后台线程运行 Python，再通过 postMessage 通信；
- CSS GIF 动画虽能“视觉上”动起来，但无法恢复交互性，仅作临时降级方案，不推荐作为根本解决手段。
✅ 总结
主线程阻塞是 PyScript 当前限制下的共性挑战，但并非无解。通过 async/await + asyncio.sleep(0) 对长任务进行逻辑切片，是现阶段最实用、零依赖、即插即用的非阻塞方案。它不改变算法复杂度，却极大提升用户体验——你的汉明/RS 编解码网页，完全可以既强大又流畅。
Python免费学习笔记（深入）：立即使用
在学习笔记中，你将探索 Python 的核心概念和高级技巧！
