如何强制首先加载html元素 - RoR

Question

我的网站上有2个下拉菜单，使用同位素插件过滤网站上的项目。问题是那些下拉菜单需要花时间显示在页面上，这在移动设备上尤其是一个问题，因为用户可能会在加载之前向下滚动并完全错过它们。您可以在我的网站www.shopwatchkw.com上看到问题。下拉菜单以红色和蓝色显示。

我怎样才能使这两个下拉菜单加载更快或者在加载页面的其余部分之前加载，以便用户不会错过它？我应该指出，下拉菜单的选项是通过def combine_first_if_matching(X, Y): filled = X.combine_first(Y)[list(X.columns)] reverse_filled = Y.combine_first(X)[list(X.columns)] if ((filled == reverse_filled) | (filled.isnull())).all().all(): return filled else: raise ValueError("Overlap of data frames did not match") 和Category模型的数据库请求填充的，而且它们不是静态的html文本。

以下是相关代码：

index.html.erb

Mall

我不确定其他代码会有什么用处，但如果您需要更具体的代码，请告诉我。

Answer 1

您不能强制首先加载代码中的特定项目，除非它位于文档的顶部。计算机读取的代码就像我们如何从上到下阅读一本书。最好的方法是将下拉菜单的css放到css样式表的顶部，或者如果你使用sass，则将main.sass中的顶部链接更改为导航样式。您还可以尝试提高网站的速度，以便同时加载网页上的所有内容，这是加快网页速度的最简单快捷的方式。

方法1 ：

压缩代码有很多方法可以压缩代码。你可以在互联网上找到它们，或者一些代码编辑提供这个，或者你可以使用glup.js，如果你正在使用它/知道如何。

HTML压缩器：https://www.textfixer.com/html/compress-html-compression.php

CSS压缩器：https://cssminifier.com/

方法2 ：

在你的服务器上安装GZIP这意味着你必须编辑你的.htaccess文件但是没关系，因为所有代码都将为你编写，你所要做的就是复制并经过它并安装到你的服务器上。