7

コンパレータ付きのコレクションがある場合。(コーヒースクリプトで)

class Words extends Backbone.collection
    comparator: (word)->
        word.get('score')

基になるアイテムのスコアを変更している場合、コレクションをソートしたままにするにはどうすればよいですか。これを、スコアが最も低い項目が常に一番上にあるリスト ビューにアタッチするという考え方です。

インスタンスを変更するたびに手動でコレクションの並べ替えを呼び出してきましたが、リスト全体が 1 つの項目で並べ替えられていることを考えると、これはあまり効率的ではないようです。

変異したアイテムを削除してから、もう一度追加してみてください。

助言がありますか?

4

2 に答える 2

5

レンダリングコードは、1つの単純な理由で非常に非効率的であるように見えます。DOM操作は高価です。可能な限り、DOMを数回ではなく1回操作する必要があります。JavaScript/CoffeeScriptの他のすべての最適化は二次的です。

これが顕著なコードです(ambertchの応答に関する2番目のコメントからリンクされた要点から):

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()

したがって、ではrender、最初にリストのHTMLがクリアされます。次に、単語ごとにリストのHTMLがクリアされコントロールが更新されます。

私はjQueryMobileに精通していないため、主なペナルティがappend(jQueryの場合のように)発生するのか、発生するのかはわかりませんlistview('refresh')が、ループを書き直して両方を回避し、関数の定義/呼び出しを削除するのは簡単です。オーバーヘッドも:

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

これで、1つのセッター、nのコール、およびn + 1のコールではなく、 1つのhtmlセッターと1つのコールだけが得られます。refreshhtml append refresh

于 2011-04-03T04:38:14.253 に答える
0

Words のすべての初期モデルを変更イベントで並べ替えにバインドし、コレクションへの追加イベントで同じものをバインドするのはどうですか?

_(self).models.each(model) { model.bind('change', self.sort) } // bind on the model add as well

Backbone.Collection.sort は更新をトリガーするため、次のようにします。

this.bind('refresh', this.refresh)

効率性についての懸念について、「リスト全体が 1 つの項目でソートされる」とはどういう意味ですか? あなたが何千ものアイテムを持っていない限り(そして、それでも、さまざまなブラウザでいくつかのベンチマークを実行してください。それでもかなり速いでしょう)、最新のブラウザ/コンピュータと大きな違いはありません.

あなたがそれについて本当に心配しているなら、より大きなセットをソートし続けるための最適化テクニックのいくつかを行うことができると思います. たとえば、それらをスコア バケット (0 ~ 100、100 ~ 500、500 ~ 1000 など) にドロップしてから、スコアをバケットにドロップし、バケット内でのみ並べ替えます (実際の並べ替えアルゴリズムは、ブラウザーの実装ごとに異なります。バックボーン -またはアンダースコアではなく、それを呼び出すだけです)。このようなアルゴリズムをグーグルで検索できます。しかし、コードの複雑さの増加と比べて、ほとんど得られないのは大変な作業です。

繰り返しになりますが、これが実際に価値があるかどうかを判断するには、多くのプロファイリングとベンチマークが必要です。

于 2011-04-02T18:49:19.307 に答える