Skip to content

  • Projects
  • Groups
  • Snippets
  • Help
    • Loading...
    • Help
    • Support
    • Submit feedback
  • Sign in / Register
N
Neos
  • Project overview
    • Project overview
    • Details
    • Activity
    • Releases
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
    • Locked Files
  • Issues 1
    • Issues 1
    • List
    • Boards
    • Labels
    • Service Desk
    • Milestones
  • Merge Requests 2
    • Merge Requests 2
  • CI / CD
    • CI / CD
    • Pipelines
    • Jobs
    • Schedules
  • Security & Compliance
    • Security & Compliance
    • Dependency List
    • License Compliance
  • Packages
    • Packages
    • List
    • Container Registry
  • Analytics
    • Analytics
    • CI / CD
    • Code Review
    • Insights
    • Issues
    • Repository
    • Value Stream
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Members
    • Members
  • Collapse sidebar
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
  • MyCard
  • Neos
  • Issues
  • #3

Closed
Open
Opened Apr 15, 2023 by timel@timel
  • Report abuse
  • New issue
Report abuse New issue

用Valtio来取代Redux

这是一个实验性的想法。将Redux换成Valtio,可以很大程度上减轻项目的状态管理的复杂度。

Redux是一个很传统的状态管理库,它有很多优点,但也有一些不能忽视的缺点,比如模版代码太多、要写专门的reducer来更改状态等。

相比之下,Valtio的api更加灵活和神奇。Valtio使用es6的Proxy和Reflet,可以直接修改store,同时被其他订阅的组件感知到。我觉得这是使用Valtio最大的动力,去掉绝大部分的模版代码,不需要useAppSelector和slice来获取state,也不需要action和reducer来更改状态。

比如,它可以这样直接修改store。

const removeTodo = (index: number) => {
  store.todos.splice(index, 1)
}

const toggleDone = (index: number, currentStatus: Status) => {
  const nextStatus = currentStatus === 'pending' ? 'completed' : 'pending'
  store.todos[index].status = nextStatus
}

同时,Valtio可以直接使用计算属性(compute,依赖于已有的state计算出的新的state),但是Redux做到这一点需要添加额外的库。

除此之外,Valtio更加容易上手,而且因为代码简单,所以测试/监视也更加容易。

但是,我觉得不能忽视的一点是改造成本,从现在的代码迁移到Valtio,需要去掉Reducer。在组件内部和Service之中,将dispatch换成直接修改store。虽然说,这些改动都不需要更改本质的逻辑,只是将dispatch换成直接的修改,可这也是不小的改动成本。

当然,好处也是很明确的,综合上面说的减少复杂度、简单上手,其实就是大大方便后续的开发,这是一个很需要权衡的问题。

Edited Apr 16, 2023 by timel

Linked issues

  • Discussion
  • Designs
Assignee
Assign to
None
Milestone
None
Assign milestone
Time tracking
None
Due date
None
0
Labels
None
Assign labels
  • View project labels
Reference: mycard/Neos#3