草庐IT

javascript - Aurelia + Redux 性能

coder 2025-01-05 原文

我每天都使用 Aurelia。最近，我一直在研究使用 Redux(即我使用 Aurelia+Redux 构建了几个小型试用应用程序)并且给我留下了深刻的印象(我的开发工作流程和我的应用程序推理的清晰度得到了极大的改进)。我已经决定开始将其用于实际应用程序。

话虽如此，我还是担心性能(我查看了有关性能的帖子，但没有直接看到我的问题地址)。我认为这个问题不是 Aurelia 特有的，更多的是关于 Redux 以及将其与非 react 库一起使用的问题。

让我以我对 Redux 的理解作为我的问题的序言(也许我的问题真的是由于错误的理解而产生的？)。本质上，我对 Redux 的理解是有一个 store(一个 javascript 对象)和一个 reducing 函数。现在，reducing 函数可以定义为一棵函数树(每个函数负责修改整个存储的特定分支)，然而，实际上，Redux 接收一个单一的 reducing 函数(它无法知道有多少函数组成创建这个单一的功能)。

我使用 Redux 的方式是这样的(只是一个例子):

@inject(Store)
export class TodosListCustomElement {
    constructor(store) {
        this.store = store;
    }

    activate() {
        this.update();
        this.unsubcribe = this.store.subscribe(this.update.bind(this));
    }

    deactivate() {
        this.unsubcribe();
    }

    update() {
        const newState = this.store.getState();

        this.todos = newState.todos;
    }

    toggleCompleted(index) {
        this.store.dispatch({
            type: UPDATE_TODO,
            payload: {
                index,
                values: {
                    isCompleted: !this.todos[index].isCompleted
                }
            }
        });
    }
}

本质上，组件树下的每个组件都会订阅自己以存储更改并从存储中刷新所需的数据。

我担心的是，每个已发布的操作似乎都发生了很多事情。例如，假设我有一个大型应用程序，具有类似的大型存储和缩减器树。假设有一些受限制的文本框每 250 毫秒将更改分派(dispatch)到商店中的单个文本字段(在列表的一项中)。这意味着当用户键入时，整个 reducer 函数每 250 毫秒执行一次(这可能意味着执行相当多的后代 reducer)以及所有订阅函数也会执行。基本上，即使更改商店的最小部分，似乎也有很多开销。

将此与标准绑定(bind)(在 Aurelia 中)进行对比，其中只有一个绑定(bind)函数(变异观察器)需要每 250 毫秒执行一次以更新模型...

由于我是 Redux 的新手，我想我很有可能天真地误解了一些东西等等。我提前道歉并希望得到纠正/走上正轨(因为我使用 Redux 的有限经验非常愉快)。

提前致谢

最佳答案

您实际上在多个层面上很好地描述了情况。

首先，React-Redux 绑定(bind)做了大量工作以确保连接的组件仅在与给定组件相关的某些数据发生更改时才真正重新呈现。这是通过让连接的组件提供一个名为 mapStateToProps 的函数来完成的，该函数从存储状态中提取组件所需的数据。 connect生成的wrapper组件会在每次dispatch后重新运行它们的mapState函数，并对最近的返回值和之前的返回值做浅比较，看数据是否正确已经改变。这减少了需要完成的实际 UI 更新的数量。

处理连接表单的方式也需要权衡取舍。是的，为每次击键发送一个 Action 总体上可能效率低下。我个人使用 React 表单包装器组件在本地缓冲这些文本输入更改，并且仅在用户完成输入后分派(dispatch)去抖动的 Redux 操作。

最近重写了 React-Redux 绑定(bind)，现在主要基于内存选择器函数，而不是将大部分逻辑放在 React 组件中。我不知道 Aurelia 绑定(bind)是如何组合在一起的，但我怀疑它们可能会利用已经完成的大量工作来优化 React 绑定(bind)。​​

您可能对我的一些关于 Redux 相关性能的文章感兴趣。在 http://redux.js.org/docs/faq/Performance.html#performance-scaling 查看 Redux FAQ 问题，以及我位于 https://github.com/markerikson/react-redux-links/blob/master/react-performance.md#redux-performance 的 React/Redux 链接列表中的文章.

关于javascript - Aurelia + Redux 性能，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41306724/

javascriptAureliaRedux的section

有关javascript - Aurelia + Redux 性能的更多相关文章

  1. ruby-on-rails - 如何优雅地重启 thin + nginx？ - 2

    我的瘦服务器配置了nginx，我的ROR应用程序正在它们上运行。在我发布代码更新时运行thinrestart会给我的应用程序带来一些停机时间。我试图弄清楚如何优雅地重启正在运行的Thin实例，但找不到好的解决方案。有没有人能做到这一点？ 最佳答案 #Restartjustthethinserverdescribedbythatconfigsudothin-C/etc/thin/mysite.ymlrestartNginx将继续运行并代理请求。如果您将Nginx设置为使用多个上游服务器，例如server{listen80;server

  2. ruby - 使用 `+=` 和 `send` 方法 - 2

    如何将send与+=一起使用？a=20;a.send"+=",10undefinedmethod`+='for20:Fixnuma=20;a+=10=>30 最佳答案 恐怕你不能。+=不是方法，而是语法糖。参见http://www.ruby-doc.org/docs/ProgrammingRuby/html/tut_expressions.html它说Incommonwithmanyotherlanguages,Rubyhasasyntacticshortcut:a=a+2maybewrittenasa+=2.你能做的最好的事情是:

  3. ruby - 如何计算 Liquid 中的变量 +1 - 2

    我对如何计算通过{%assignvar=0%}赋值的变量加一完全感到困惑。这应该是最简单的任务。到目前为止，这是我尝试过的:{%assignamount=0%}{%forvariantinproduct.variants%}{%assignamount=amount+1%}{%endfor%}Amount:{{amount}}结果总是0。也许我忽略了一些明显的东西。也许有更好的方法。我想要存档的只是获取运行的迭代次数。 最佳答案 因为{{incrementamount}}将输出您的变量值并且不会影响{%assign%}定义的变量，我

  4. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  5. arrays - Ruby 数组 += vs 推送 - 2

    我有一个数组数组，想将元素附加到子数组。+=做我想做的，但我想了解为什么push不做。我期望的行为(并与+=一起工作):b=Array.new(3,[])b[0]+=["apple"]b[1]+=["orange"]b[2]+=["frog"]b=>[["苹果"],["橙子"],["Frog"]]通过推送，我将推送的元素附加到每个子数组(为什么？):a=Array.new(3,[])a[0].push("apple")a[1].push("orange")a[2].push("frog")a=>[[“苹果”、“橙子”、“Frog”]、[“苹果”、“橙子”、“Frog”]、[“苹果”、“

  6. Ruby 的数字方法性能 - 2

    我正在使用Ruby解决一些ProjectEuler问题，特别是这里我要讨论的问题25(Fibonacci数列中包含1000位数字的第一项的索引是多少？)。起初，我使用的是Ruby2.2.3，我将问题编码为:number=3a=1b=2whileb.to_s.length但后来我发现2.4.2版本有一个名为digits的方法，这正是我需要的。我转换为代码:whileb.digits.length当我比较这两种方法时，digits慢得多。时间./025/problem025.rb0.13s用户0.02s系统80%cpu0.190总计./025/problem025.rb2.19s用户0.0

  7. ruby - Ruby 性能中的计时器 - 2

    我正在寻找一个用ruby​​演示计时器的在线示例，并发现了下面的代码。它按预期工作，但这个简单的程序使用30Mo内存(如Windows任务管理器中所示)和太多CPU有意义吗？非常感谢deftime_blockstart_time=Time.nowThread.new{yield}Time.now-start_timeenddefrepeat_every(seconds)whiletruedotime_spent=time_block{yield}#Tohandle-vesleepinteravalsleep(seconds-time_spent)iftime_spent

  8. ruby-on-rails - 如果条件与 &&，是否有任何性能提升 - 2

    如果用户是所有者，我有一个条件来检查说删除和文章。delete_articleifuser.owner?另一种方式是user.owner?&&delete_article选择它有什么好处还是它只是一种写作风格 最佳答案 性能不太可能成为该声明的问题。第一个要好得多-它更容易阅读。您future的自己和其他将开始编写代码的人会为此感谢您。 关于ruby-on-rails-如果条件与&&，是否有任何性能提升，我们在StackOverflow上找到一个类似的问题：

  9. += 的 Ruby 方法 - 2

    有没有办法让Ruby能够做这样的事情？classPlane@moved=0@x=0defx+=(v)#thisiserror@x+=v@moved+=1enddefto_s"moved#{@moved}times,currentxis#{@x}"endendplane=Plane.newplane.x+=5plane.x+=10putsplane.to_s#moved2times,currentxis15 最佳答案 您不能在Ruby中覆盖复合赋值运算符。任务在内部处理。您应该覆盖+，而不是+=。plane.a+=b与plane.a=

  10. ruby - Sinatra + Heroku + Datamapper 使用 dm-sqlite-adapter 部署问题 - 2

    出于某种原因，heroku尝试要求dm-sqlite-adapter，即使它应该在这里使用Postgres。请注意，这发生在我打开任何URL时-而不是在gitpush本身期间。我构建了一个默认的Facebook应用程序。gem文件:source:gemcuttergem"foreman"gem"sinatra"gem"mogli"gem"json"gem"httparty"gem"thin"gem"data_mapper"gem"heroku"group:productiondogem"pg"gem"dm-postgres-adapter"endgroup:development,:t

随机推荐