如何通过AJAX请求加速多个Partial加载？Rails性能优化问询

我之前在Rails项目里也踩过类似的AJAX加载Partial卡顿的坑，结合你说的全新5.1.4应用场景，给你几个排查和解决的方向：

• 排查Partial里的N+1查询问题：这是最常见的性能杀手。比如如果你的_abc.html.erb里循环调用了Recipe的关联模型（比如recipe.ingredients.name），但控制器里没有预加载关联数据，每次渲染Partial都会触发一次新的数据库查询，累积起来就会让响应时间飙升。解决办法是在处理AJAX的控制器action里用includes预加载关联：

  # 比如在对应的action里
  def load_partial
    @recipes = Recipe.includes(:ingredients) # 预加载关联，避免N+1
    respond_to do |format|
      format.js
    end
  end
  

• 精简控制器的AJAX处理逻辑：有时候即使是全新应用，可能不小心在AJAX对应的action里做了和index页面一样的全量操作（比如加载了大量不需要的实例变量）。要确保AJAX action只返回渲染Partial必需的数据，比如限制查询数量：

  @recipes = Recipe.limit(10) # 按需加载，不要一次性查全表
  

  对应的load_partial.js.erb也只做必要的渲染：

  $("#target-container").html("<%= j render 'abc' %>")
  

• 开启开发环境的模板缓存：默认开发环境下Rails不会缓存模板，每次渲染Partial都要重新编译，这会增加不少耗时。可以临时在config/environments/development.rb里开启模板缓存来测试：

  config.action_view.cache_template_loading = true
  

  注意：开启后修改Partial内容需要重启服务器才能生效，测试完可以改回去。

• 深挖服务器日志定位瓶颈：不要只看控制台的表面时间，打开log/development.log找到对应的AJAX请求日志，查看每个步骤的耗时——比如Rendered recipes/_abc.html.erb的具体时间，或者数据库查询的耗时，这样能精准判断是渲染慢还是数据库查询慢。

• 检查AJAX请求的额外开销：打开浏览器DevTools的Network标签，查看AJAX请求的TTFB（Time To First Byte）：如果TTFB很长，说明是服务器端处理慢；如果是下载时间长，可能是Partial里的内容太大（比如渲染了太多数据），可以考虑分页加载。

内容的提问来源于stack exchange，提问作者sjsc