[Suggestion]: Adding an Explanation Text to Avoid any Confusion
まだ誰も着手していません。
評価
- 難易度
- 2/5
- 見積もり時間
- 1〜3時間
- 初心者へのやさしさ
- 62/100
- issue の種類
- ドキュメント
- 明瞭さ
- 明確に書かれている
- 活発さ
- 停滞
- 技術スタック
- javascript, react
調査の方向性
react.dev/learn/render-and-commit ページを開いて、「Step 3: React commits changes to the DOM」を調べてください。特に、異なる props で再レンダリングすることについての文と、その playground を確認してください。リンク先の「State as a Snapshot」ページと比較し、違いが明確になるよう説明を更新して、ドキュメントのプレビューとリンクを確認してください。
索引モデルが issue の本文から書いたものです。
説明
Summary
Add an explanation text to avoid any confusion about the fact that it's the component's internal state changes, not the props themselves, that actually trigger the render (cf : the Big Re-renders Myth as mentioned by Nadia Makarevich).
Page
https://react.dev/learn/render-and-commit
Details
Section : "Step 3: React commits changes to the DOM"
In this section, there is a sentence which could create some confusion for a new React Developer.
Indeed, even if it is recalled various times in this page, this sentence could bring some confusion since it is not clearly established that a re-render is triggered by state changes instead of props. Therefore, I suggest to add some short explanations to explicitly clarify this distinction.
This is also a good way to create a common thread with the next page "State as a Snapshot".
Moreover, the playground doesn't help to understand this distinction since we don't use any useState hook in this component but in the parent component (we have to fork it to see all the components):
- The original sentences :
React only changes the DOM nodes if there’s a difference between renders. For example, here is a component that re-renders with different props passed from its parent every second.
- The additional sentence :
It's worth noting that although props are updated, it's the component's internal state changes that actually trigger the render.
- 主要言語
- JavaScript
- スター
- 11.8k
- フォーク
- 7.9k
- 平均マージ
- 16時間 6分
- マージ済み PR(30日)
- 7
コントリビューションガイド
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
reactjs/react.dev のほかの issue
-
type: documentation
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
-
難易度 1/5 1時間未満 初心者へのやさしさ 82/100
-
bug: unconfirmed
難易度 2/5 1〜3時間 初心者へのやさしさ 74/100
-
type: typos
難易度 1/5 1時間未満 初心者へのやさしさ 90/100
-
bug: unconfirmed
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
reactjs/react.dev の issue をすべて見る
似ている issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 75/100
Seeed-Studio/wiki-documents#5655 · コメント 2 件 ·
-
bug
難易度 2/5 1〜3時間 初心者へのやさしさ 76/100
capricorn86/happy-dom#2435 ·
-
難易度 2/5 1〜3時間 初心者へのやさしさ 88/100
-
Edit: CW+ オープンchannels:edit check:passed
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
-
01 type: bug 30 needs: triage 99 tag: UX Accessibility
難易度 2/5 1〜3時間 初心者へのやさしさ 82/100