在页面的head标签中，我使用了3个外部文件(CSS，Font，jQuery库)：
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet"> <!-- Poppins font -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
当我使用所有 3 - 页面加载非常慢时。如果我省略其中之一(无论是哪一个)- 页面会立即加载。为什么？
这是因为脚本一个接一个地同步加载。
如何使它们加载得更快？
如果脚本和链接之间没有依赖关系，则异步加载它们：
异步加载 JS 脚本
为此，您可以使用异步属性。 从文档中：
如果存在，它指定将执行脚本 一旦可用，就异步。
例：
<script src="demo_async.js" async></script>
就像下面提到的@IvanS95 - 您也可以使用延迟。
异步加载 CSS 链接
您可以使用预加载。
从文档中：
加载方式的资源存储在本地 浏览器，并且在它们被引用之前实际上是惰性的 DOM、JavaScript 或 CSS。例如，这里有一个潜在的用例 预加载脚本文件，但不会立即执行，因为它 如果它通过 DOM 中的标签包含在内，将会如此。
举个例子：
<link href="style.css" rel="preload" as="style">
尝试在最后加载 js 文件。
</head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet"> <!-- Poppins font -->
</head>
<body>
...
...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</body>
我的建议是运行您的网站 - https://www.webpagetest.org/优秀的资源。
此外，我会将数据缓存 365 天，这样他们就不必再次调用您的外部脚本。
要了解有关缓存的信息，请查看此站点 - https://www.codebyamir.com/blog/a-web-developers-guide-to-browser-caching
而且，您始终可以使用 F12 浏览器工具来查看加载网页所有元素的瀑布效果。