我正在使用"layzr-rails“gem来延迟加载图片,这个方法工作得很好,但是我可以做一些其他的事情来增加页面加载吗?
在我的本地机器上,almsot需要6秒来加载站点:
Started GET "/" for 127.0.0.1 at 2018-09-19 00:51:43 +0200
Processing by SlotsController#index as HTML
Rendering slots/index.html.erb within layouts/application
Slot Load (2.0ms) SELECT "slots".* FROM "slots"
↳ app/views/slots/index.html.erb:1
Rendered collection of slots/_slot.html.erb [1585 times] (5749.7ms)
Rendered slots/index.html.erb within layouts/application (5783.6ms)
Completed 200 OK in 5906ms (Views: 5888.7ms | ActiveRecord: 2.0ms)
我能在这里做一些更好的事情吗?
我如何呈现它:
index.html.erb
<%= render @slots %>
_slot.html.erb
<%= image_tag(slot.file_name, size: "200x200", lazy:true, class: 'slot-image') %>
我只想渲染尽可能多的图像视图,因为用户能够在屏幕上看到。此时,所有15k视图都被渲染,然后如果内容本身、图像滚动到屏幕中,就会延迟加载。
我对web开发相当陌生,所以我不知道如何在一个真实的应用程序中正确地处理一个页面上的如此多的图像视图。
也许有人可以给我一些好的方向,让我可以阅读这些东西,或者给我一些关于这个问题的关键字。
这是Heroku的页面:https://secret-reef-56473.herokuapp.com/
任何帮助或小费,真的非常感谢!
(我希望这篇文章不违反StackOverflow的规则,我的要求是明确的,可以理解的)
发布于 2018-09-19 09:31:40
您可以尝试将部分渲染移动到内联代码中,并使用部分缓存。但是渲染15k的图像简直是疯了。你有没有想过无底分页?呈现更合理数量的图像,当用户滚动时,您可以检查滚动的高度和内容的高度,您可以执行ajax请求,以便在用户到达末尾时加载更多图像,依此类推,直到没有更多图像可显示。
https://stackoverflow.com/questions/52395804
复制相似问题