perf(Form): FormContext use a memoized value(#21976)

[qiqiboy]

• fix FormContext应当使用memorized值避免导致FormItem的额外无意义渲染 #21976

🤔 This is a ...

• New feature
• Bug fix
• Site / document update
• Component style update
• TypeScript definition update
• Refactoring
• Code style optimization
• Test Case
• Branch merge
• Other (about what?)

🔗 Related issue link

#21976

💡 Background and solution

In current, FormContext.Provider use an inline Object variable as the value, it will always trigger unintentional renders in consumers when Form or Form's parent re-renders.

📝 Changelog

Language	Changelog
🇺🇸 English	FormContext use a memoized value to avoid trigger FormItem's unintentional renders
🇨🇳 Chinese	FormContext使用memoized值避免FormItem产生额外的渲染

☑️ Self Check before Merge

⚠️ Please check all items below before review. ⚠️

• Doc is updated/provided or not needed
• Demo is updated/provided or not needed
• TypeScript definition is updated/provided or not needed
• Changelog is provided or not needed

[ant-design-bot]

[yoyo837]

memo 本身也消耗性能，这里好像不明显， 多产生个对象。

[qiqiboy]

memo 本身也消耗性能，这里好像不明显， 多产生个对象。

正常情况下Form或者Form的上层组件render的话，所有FormItem都会重新渲染，是这么回事。这种情况下，这里的memo也确实显得是额外的比较开销。

但是当Form和FormItem中间有使用shouldComponentUpdate优化的组件时，依然无法阻止FormItem的重新渲染，因为Provider的value变化，会强制更新所有连接的Consumer，即使Consumer的父级使用了shouldComponentUpdate.

虽然这种优化并不常见，4.0里的Form性能也很好了，但是这里的FormContext用法确实不符合最佳实践，破坏shouldComponentUpdate对组件渲染优化的逻辑。这里的一个小的memo应当也会影响太多，这几个值本身数据也很小，但是对于渲染的优化影响是极大的。

[zombieJ]

useMemo

[qiqiboy]

Sorry，已修改

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit d72bc19:

Sandbox	Source
antd reproduction template	Configuration

[codecov]

Codecov Report

Merging #21980 into master will increase coverage by <.01%.
The diff coverage is 100%.

@@            Coverage Diff             @@
##           master   #21980      +/-   ##
==========================================
+ Coverage   97.93%   97.93%   +<.01%     
==========================================
  Files         306      306              
  Lines        7024     7026       +2     
  Branches     1889     1934      +45     
==========================================
+ Hits         6879     6881       +2     
  Misses        145      145

Impacted Files	Coverage Δ
components/form/Form.tsx	100% <100%> (ø)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 8eb6647...d72bc19. Read the comment docs.

[zombieJ]

memo 本身也消耗性能，这里好像不明显， 多产生个对象。

它的场景是子元素又通过 React.Memo or shouldComponentUpdate 隔离了一层 Form.Item。本身 useMemo 性能开销还行，觉得可以加。