0

我目前正在开发一个 Web 应用程序,该应用程序使用 Backbone 来根据从服务器中提取的模型数据呈现模板。下面是我用于基于模型的模板渲染的样板代码(在 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 回答