Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React:redux和context的优缺点 #63

Open
HCLacids opened this issue Mar 29, 2022 · 0 comments
Open

React:redux和context的优缺点 #63

HCLacids opened this issue Mar 29, 2022 · 0 comments
Labels

Comments

@HCLacids
Copy link
Owner

HCLacids commented Mar 29, 2022

参考链接
context

  • 优点
    代码比较简洁,如果你的项目比较简单,只有少部分状态需要提升到全局,大部分组件依旧通过本地状态来进行管理。这时,使用 hookst进行状态管理就挺不错的。杀鸡焉用牛刀。
  • 缺点
    两种hooks管理方式都有一个很明显的缺点,会产生大量的无效rerender,如上例中的Count和Name组件,当state.count改变后,Name组件也会rerender,尽管他没有使用到state.count。这在大型项目中无疑是效率比较低的。

Redux

  • 优点
    组件会订阅store中具体的某个属性【mapStateToProps手动完成】,只要当属性变化时,组件才会rerender,渲染效率较高
    流程规范,按照官方推荐的规范和结合团队风格打造一套属于自己的流程。
    配套工具比较齐全redux-thunk支持异步,redux-devtools支持调试
    可以自定义各种中间件
  • 缺点
    state+action+reducer的方式不太好理解,不太直观
    非常啰嗦,为了一个功能又要写reducer又要写action,还要写一个文件定义actionType,显得很麻烦
    使用体感非常差,每个用到全局状态的组件都得写一个mapStateToProps和mapDispatchToProps,然后用connect包一层,我就简单用个状态而已,咋就这么复杂呢
    当然还有一堆的引入文件,100行的代码用了redux可以变成120行,不过换个角度来说这也算增加了自己的代码量
@HCLacids HCLacids added the React label Mar 31, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant