0

私は現在、サーバーから引き出されたモデル データに基づいてテンプレートをレンダリングするために Backbone を使用する Web アプリに取り組んでいます。以下は、モデルベースのテンプレート レンダリング用のボイラープレート コード (CoffeeScript) です。私の問題は、サーバーの応答時間が遅いと、AJAX 呼び出し (フェッチ) が完了するのを待っている間にレンダリングがハングすることです。

model.fetch() 呼び出しからのデータを必要とする部分を除いて、ほとんどのテンプレートをロードする必要があります。私のテンプレートはモデル データに大きく依存しているため、テンプレートのコードのモデルに依存する部分と独立した部分を解きほぐし、途切れ途切れのユーザー エクスペリエンスを最小限に抑えるためのクリーンまたは標準的な方法があるかどうかを知りたいです。私が考えていたのは、テンプレートのモデルに依存しない部分を最初にロードし、次にモデルに依存する部分をロードすることでしたが、それは非効率的です。

model = new Model  # Create model
model.fetch().done ->  # Load model data from server
  view = _.template ViewTemplate,  # Fill template w/ model data
    model: model
  $('#view').html view  # Update DOM w/ newly rendered template 
4

1 に答える 1

1

ビューはサーバーからのモデル データに大きく依存しているため、レンダリングを高速化する方法は実際にはありません。ただし、ビューのレンダリングの知覚パフォーマンスを向上させることはできます。

体感パフォーマンスを向上させる方法は、2 パス レンダリングを行うことです。最初に、キャッシュされたデータをビューにレンダリングし、小さなスピナーを表示して、ユーザーがより多くを取得していることをユーザーに知らせます。ajax 呼び出しが完了した瞬間に、更新されたデータでビュー全体を再レンダリングするだけです。これは最初は非効率に思えますが、機能し、パフォーマンスの低下なしにユース ケースの 90% をカバーします。これがパフォーマンスの問題であることがわかった場合は、後で最適化してください。

于 2013-08-09T16:21:51.987 に答える