Question

我在我的网站上有一个页面（由Rails上的ruby制作），我想要提高其性能。我正在使用Google Chrome浏览器的“审核”来测试“性能”。

我在“机会”部分获得的一件事是：“预加载关键请求”。它告诉我的是，对一些耗时的CSS使用use preload。我无法理解的是，它告诉我要预加载的CSS在application.scss文件中。我如何预加载正在预编译的CSS？那有可能吗？

我知道的是，如果我在页面上使用样式表（例如temp.css），则可以使用 'link rel =“ preload” href =“ temp.scss” as =“ style”'，它将预加载文件。现在，如何对正在预编译的资产执行此操作。我真的很困惑。如果我的理解有误，请提供帮助。谢谢！

Answer 1

您还可以在 rel: :preload 末尾添加 stylesheet_link_tag，例如：

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload', rel: :preload %>

它将在 HTML 标题上生成类似：

<link rel="preload" media="all" href="/assets/application.self-ddcad.css?body=1" data-turbolinks-track="reload">

Answer 2

您可以使用preload_link_tag。请参阅此处：