Альтернативы Redux, матч-реванш, два: smox

внешний интерфейс Vue.js React.js Redux
Альтернативы Redux, матч-реванш, два: smox

привет всем, меня зовут 132, это мой первый пост ххх

задний план

Мы обычно чувствуем «уродливый внешний вид и раздражающее использование» Redux при разработке проектов React.Некоторые люди трансформируют его, например, dva, rematch и упаковывают синтаксический сахар для Redux, например, smox, напрямую переплавляя Regeneration, полностью освобождаясь от ограничений Redux все еще использует «новые функции»

Автор матча-реванша, упомянутый в статье,工具质量 = 工具节省的时间 / 使用工具消耗的时间

Мы будем использовать эту формулу далее, чтобы почувствовать smox工具质量

Упрощенный API

Стоит отметить, что API smox совместим с vuex.Vuex — это управление состоянием, которое я считаю лучшим API.Хотя vue отвергается реагирующими пользователями, я все же не могу отрицать это напрямую.

Итак, smox использует преимущества vuex, а API становится следующим:

import React from 'react'
import ReactDOM from 'react-dom'
import App from './app.js'
import { Store, Provider } from 'smox'

const state = {
  count: 2
}

const actions = {
  asyncAdd({ commit }) {
    setTimeout(() => {
      commit('add')
    }, 1000)
  }
}

const mutations = {
  add(state) {
    state.count += 1
  },
  cut(state) {
    state.count -= 1
  }
}

const store = new Store({ state, mutations, actions })

ReactDOM.render(
  <Provider store = {store}>
    <App />
  </Provider>,
  document.getElementById('root')
)

Ощущение, кажется ли вам более приятным для глаз, если вы написали vue?

На самом деле DVA, API Rematch тоже почти одинаковые, но Mutations smox соответствуют их Reducers, Actions соответствуют Effects

В чем разница между почти одинаковым API?

Простое сравнение и сравнение матчей-реваншей

Давайте посмотрим на матч-реванш:

    add(state, payload) {
      return state + payload
    }

В качестве параметра передает состояние, но при возврате параметр меняется, это не чистая функция, нам нужно оптимизировать производительность вручную

Однако smox использует метод Proxy для безвозвратного захвата объектов, который может точно перехватить изменения.

    add(state, payload) {
      state.count += payload
    }

Из этого механизма видно, что smox идет в правильном направлении.

Кроме того, у рематча все еще есть несколько проблем, таких как невозможность избавиться от ограничения типа действия, отсутствие инкапсуляции коннекта и т. д.

Что касается dva, то на самом деле я не очень внимательно изучил его исходный код, но это не инструмент, а фреймворк, лично я не сторонник такого рода вещей~

Выше, через простое сравнение smox и rematch, я могу непосредственно почувствовать smox

В дополнение к использованию нового API Proxy smox также использует API New Context, который использовался в начале smox, когда еще не был выпущен react16.3 √

Другой пример - малый размер, или рематч.Если использовать, то все равно нужно качать redux, react-redux и другие библиотеки, том относительно раздутый, но smox полностью отказывается от redux, gzip 1KB

все еще нуждается в улучшении

В будущем smox внесет значительные улучшения в версию, такие как добавление механизмов промежуточного программного обеспечения.

Суммировать

Давайте рассмотрим формулу:工具质量 = 工具节省的时间 / 使用工具消耗的时间

Судить...

Наконец, прикрепите адрес smox на GitHub: https://github.com/132yse/smox

Спросите звездочку, спросите об ошибке, спросите о проблеме, спросите про

Затем адрес документа: https://smox.js.org/

Хахаха, рыбачил на работе и улизнул!

Категории