我使用stellar.js创建了视差网站。但事实证明有点滞后/笨拙。所以我跳进来调试这个。我整天都在看各种关于加快网站性能的视频，我发现了更多关于chrome devtools的信息，特别是时间线标签。事情变得更好，但在时间轴上，最昂贵的事情就是绘画。这是因为图像正在调整大小。 这里的问题是为什么bg-image在每个滚动事件上调整大小？在我看来，浏览器渲染图像并在我加载页面时调整它们的大小，而不是在每个滚动上。我知道应该在每个卷轴上计算位置，但这是否意味着bowser还需要重新计算图像大小？如果是这样，有没有解决这个问题？在某些视频/文章中，我看到了transform: translateZ(0);，但在我的情况下它并没有帮助。
这是每个幻灯片包的代码。我知道background-size:cover;代价很高，但这是我保持全屏背景的唯一方式，它们很大（2000x1200），但不重（350kb）。
.slide{
background-attachment: fixed;
height: 100%;
position: relative;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-repeat: no-repeat;
}
感谢任何想法。或者只讨论一般的“绘画”事物