ruby-on-rails - 在 Rails 4 应用程序上从 S3 加载多个图像 : slow loading page

Question

我有一个用户索引页面，它只列出用户并显示他们的头像(使用载波和雾上传到 Amazon S3):

应用程序/ View /用户/index.html.erb

<% @users.each do |user| %>
    <% if ! user.avatar_url.nil? && user.avatar.file.exists? %>
        <div class=“avatar">
            <%= link_to (image_tag user.avatar_url.to_s), user %>
        </div>
    ...
    <% end %>   
<% end %>

配置/初始化程序/carrierwave.rb

CarrierWave.configure do |config|
   config.fog_credentials = {
     :provider               => 'AWS',
     :aws_access_key_id      => ENV["AWS_ACCESS_KEY_ID"],
     :aws_secret_access_key  => ENV["AWS_SECRET_ACCESS_KEY"],
     :region                 => 'eu-west-1'                  # optional, defaults to 'us-east-1'
   }
   config.fog_directory  = ENV["AWS_S3_BUCKET"]                     # required
   config.fog_public     = true                                   # optional, defaults to true
end

索引页面加载速度非常慢，同时获取所有图像。

有没有办法加速页面加载，也许是通过延迟加载和 ajax 请求？

感谢您的帮助和时间，并为这个新手问题感到抱歉。

附言我会补充一点，即使我加载用户个人资料页面有时它也不会显示任何头像(在这种情况下，只有当我重新加载页面头像显示正确时)

Answer 1

由于您的图像存储在 S3 上，因此您无法真正控制图像加载的速度。一种选择是考虑使用 Amazon Cloudfront 来提供图像。

图像由浏览器异步加载，因此加载图像缓慢不应影响用户索引页面的加载速度。如果你的用户页面加载缓慢，你应该考虑缓存你的用户索引页面:见 http://guides.rubyonrails.org/caching_with_rails.html#fragment-caching想要查询更多的信息。

一个例子是

<% @users.each do |user| %>
    <% cache(user) do %>
      <%= render user %>
    <% end %>  
<% end %>