在页面组件加载之前隐藏部分

Hiding parts before the page components loads

当页面在加载某些部分(字体、必需的 css 文件)之前加载时,会出现非常不愉快的情况。

我在一些网站上看到,它们在页面组件加载之前隐藏了一些部分。

例如:

我不想在页面中放置预加载器。是否只有策略或任何其他解决问题的方法?

这些页面使用 javascript 框架,例如 Angular、React 或 Vue。 他们使用一种叫做生命周期钩子的东西。我最熟悉的是 Vue.js,但根据加载 called/what 的时间不同,也有不同的。 他们很可能使用 before mounted 和 mounted 生命周期挂钩,它执行操作直到项目完全加载,然后执行不同的操作。

如果您不使用图书馆,并且正在寻找 - 我建议您 Vue.js 因为您不必 install/learn node.js 在页面,只需要一个CDN,我下面使用的link将告诉你如何防止你的页面元素在加载之前被查看。

https://v3.vuejs.org/api/options-lifecycle-hooks.html

https://angular.io/guide/lifecycle-hooks

https://reactjs.org/docs/state-and-lifecycle.html

它的名字是“骨架加载”。 你可以只使用 HTML 和 CSS.

那里有一些库,如果你想不费力地直接使用它们,只需搜索“Skeleton Loading”。或者我推荐你看这个 video.