我正在创建一个拥有大量HTML（数千个div元素）的网站。没有真正的方法可以摆脱所有这些div元素，并且它使网站加载非常慢（7-12秒）。我已经尝试在网站上放置缓存，但它没有帮助，因为该网站仍然必须渲染所有这些div元素。
更具体地说，它是140个下拉列表，每个下拉列表包含100-800个div元素，并且需要很长时间才能显示。
我的想法是，在页面加载后渲染下拉列表中的div元素，但我不知道该怎么做？
在页面加载后渲染部分内容的最简单方法是什么？我正在使用Rails 4顺便说一句。
关于如何处理大量HTML的任何其他建议？
答案 0 :(得分：1)
我的某个页面上有类似的问题。以下是与选择框相关的一些尝试。
（前两个可能不相关，因为你说你试过缓存，但我包括完整性。你尝试过什么类型的缓存？你是如何验证浏览器渲染速度慢的？）
仔细检查问题原因
注释掉生成选择框的代码，并检查rails日志中的时间（与浏览器测量值相反）是否下降。这确定了您对该度量的性能改进的“下限”。
避免使用铁路助手。
如果您正在使用select_tag，options_for_select或任何一系列方法，那么您每次调用它们时可能会进行大量重复工作，因此需要重建选项列表。如果每个选择框的选项相同，则可以将它们构建一次，然后将它们转储到页面中：
<% options = options_from_collection_for_select(@array, "id", "name") %>
<%= select_tag "myfield", options %>
如果您需要为每个选择不同的值，您可以尝试：
options以添加它们。这非常严重，可能不会比默认生成器更快。部分中的AJAX
即使服务器时间相同，这也会给出更快加载的错觉（尽管它可能会稍微并行化，但会增加额外的网络延迟）。最简单的方法是使用jQuery's .load method。
$("#element-1").load("/path/to/partial/1")
在JS中生成选择框
如果您可以相对快速地获得客户端所需的所有数据（可能在JSON端点中提供？），您可以尝试使用jQuery直接构建选择框，Programmatically create select list < / p>
删除多余的HTML
为什么你的下拉列表里面有div个？有没有办法简化？
答案 1 :(得分：0)
尽管这个问题已有数年之久，但也许有人会从中受益。
1）在控制器中：
@companies = Company.all.pluck(:name, :id) #order is important here
2）：
<%= f.select(:company_id, options_for_select(
@companies, selected: @user.company_id
), {}, class:"form-control m-b") %>
pluck仅获取:name, :id值，例如，数组
=> [["Sumptus xiphias canto.", 5], ["My First Co.", 1]]
，然后options_for_select填充选项。
我的5000条记录在〜300ms的AJAX模态窗口中填充。速度不是很快，但是我认为普通用户不会抱怨。