请解释 React 中的异步渲染这一概念，并阐述 Time Slicing 与 Suspense 分别指什么？

回答思路

1. 【回答框架 1】异步渲染是 React 将渲染工作拆分为可中断的多个小任务，在浏览器空闲时段分片执行，从而避免长时间阻塞主线程，提升响应性。其核心是让渲染过程可被更高优先级任务打断，并在空闲时恢复。
2. 【回答框架 2】Time Slicing（时间切片）是异步渲染的底层实现策略：React 将更新任务按时间片（如 5ms）划分，每片执行后让出主线程给浏览器处理输入、动画等紧急任务，确保用户交互不被长任务阻塞，从而提升流畅度。
3. 【回答框架 3】Suspense 是用于处理异步数据获取的声明式机制，允许组件在等待数据时展示 fallback，避免组件内部手动管理 loading 状态。它通过抛出 Promise 通知 React 暂停渲染，待数据就绪后重新渲染。
4. 【回答框架 4】在 React 实现中，时间切片基于 Scheduler 调度器，配合优先级机制实现可中断渲染；Suspense 常与懒加载代码拆分（React.lazy）或数据获取库（如 Relay）配合使用，其功能在并发特性下更完善。
5. 【关键点 1】异步渲染将渲染任务分片并可在空闲时执行，避免阻塞主线程。
6. 【关键点 2】Time Slicing 按时间片让出主线程，提升交互响应性。
7. 【关键点 3】Suspense 声明式处理异步数据或代码加载，通过抛出 Promise 暂停渲染并展示 fallback。
8. 【关键点 4】时间切片依赖 Scheduler 调度与优先级机制，Suspense 在并发模式下能力更完整。
9. 【易错点 1】误认为时间切片会直接提升渲染总耗时，实际是降低卡顿、改善响应体验。
10. 【易错点 2】Suspense 并不能代替完整的数据获取方案，也不解决请求竞态等问题。
11. 【易错点 3】时间切片并非所有场景适用，对于 CPU 密集任务仍需优化算法或配合 Web Worker。