javascript – 骨干集合保持模型变异的排序顺序

如果我有一个带比较器的集合. (在coffeescript中)
class Words extends Backbone.collection
    comparator: (word)->
        word.get('score')

如果我要改变,我如何保持收集分类
基础项目的得分.这个想法是为了
将此附加到列表视图中的项目与
最低分始终在最高分.

我一直在手动调用集合上的排序
每次我改变一个实例,但这似乎没有
考虑到整个列表已排序,效率太高
一个项目.

我也许可以尝试删除变异的项目和
然后再添加一次.

有什么建议?

解决方法

由于一个简单的原因,渲染代码看起来非常低效:DOM操作很昂贵.只要有可能,您应该操作DOM一次而不是几次. JavaScript / CoffeeScript中的所有其他优化都是次要的.

这是显着的代码(来自关于Ambertch响应的第二条评论的主要内容):

refresh: ->
    @list.listview("refresh")

appendWord: (word)->
    wv = new WordView({model: word}).render().el
    @list.append( wv )
    @refresh()

render: ->
    @list.html("")
    @model.each (word) => @appendWord(word)
    @refresh()

因此,在渲染时,首先清除列表的HTML;然后为每个单词清除列表的HTML并刷新控件

我不熟悉jQuery Mobile,所以我不确定主要的惩罚是在追加(因为它是在jQuery中)还是在listview(‘refresh’)上,但是很容易重写循环以避免两者,并删除一些函数定义/调用开销:

render: ->
  html = []
  @model.each (word) ->
    html.push(new WordView(model: word).render().el)
  @list.empty().append(html)

现在你只有一个html setter和一个刷新调用,而不是一个html setter,n追加调用,n 1个刷新调用

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...