Question

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

应用/视图/用户/ 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请求？

感谢您的帮助和时间，对此新手问题感到抱歉。

P.S。我想补充一点，即使我加载用户个人资料页面有时也不显示任何头像（在这种情况下，只有我重新加载页面头像才能正确显示）

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 %>

在Rails 4应用程序上从S3加载多个图像：缓慢加载页面

1 个答案: