reactjs / reactjs/react.dev

[Suggestion]: Cap the height of the artificially-slow example output (useDeferredValue / useTransition)

未关闭 适合新手
#8,486 1 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

type: documentation
主要语言
JavaScript
星标
11.8k
派生
7.9k
平均合并
1 天 11 小时
30 天内合并 PR
11

描述

Summary

When you view the example's rendered output in full, the SlowList/SlowPost demos expand into hundreds of identical rows, which is more than anyone needs to scroll through. The output height should be capped (e.g. max-height + scroll) while keeping the item counts that create the intentional slowdown.

Image Image
Page

https://react.dev/reference/react/useDeferredValue
https://react.dev/reference/react/useTransition

Details

The point of these demos is felt within the first few rows — you just need to see the list "lag behind" the input. But the rendered output shows the full list, so viewing it expands the example to hundreds of identical "Text:" rows and pushes the rest of the docs far down. The number of rows differs across pages (250 / 500 / 50), so the problem shows up unevenly.

贡献指南

打开贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

调研方向

从 useDeferredValue 和 useTransition 参考页面中的示例开始,检查 SlowList 和 SlowPost 如何渲染其输出。通过滚动限制可见输出的高度,同时保留现有的项目数量和有意设置的减速效果,然后验证这两个页面不再过度扩展。

由索引模型根据 Issue 内容生成。

评估

技术栈
javascript, react
领域
documentation
Issue 类型
功能
难度
2/5
预计耗时
1-3 小时
活跃度
冷清
描述清晰度
基本清楚
新手友好度
72/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。