18910140161

JavaScript-在用户滚动到所有`content-visibility:auto`元素之前触发呈现这些元素,而不会阻塞>50ms的主线程-堆栈溢出

顺晟科技

2022-10-19 13:31:36

110

我希望快速加载页面,但也不要让用户在向下滚动页面时看到内容呈现之前的延迟。

我有一个包含许多元素的大型html页面。

为了加快页面加载,我在CSS中设置了。请参见https://web.dev/content-visibility/

<dl>

由于%s内容的复杂性,当用户在%s进入视区时进行滚动时,会出现明显的延迟。

因此,在页面加载后不久,我希望立即呈现所有屏幕外的内容(在用户滚动到它们之前),但这样做不会阻塞主线程,滚动保持响应。

所以,我想设置s从顶部开始,并且不阻塞主线程(例如超过50ms)。因此,也许允许用户在呈现每个。

之后进行交互

所以,我需要一个不阻塞主线程的以下版本:

<dl>

我的用例:我的页面是数学笔记,我希望所有这些都在一个页面上,以减少摩擦。我使用katex(目前,在我们可以在chrome上使用mathml之前)生成非常大且复杂的html,即使是服务器端呈现也需要花费大量时间在浏览器上进行布局和呈现。


顺晟科技:

与其不回答这个问题,不如让我粘贴过去几周一直在测试的(未完善的)代码。

  • TAG:
相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航