javascript - 为后面的页面预加载外部 JavaScript 库

Question

我使用托管在 CDN 上的外部 JavaScript 库。

一些用户报告说，当他们第一次访问需要该库的页面时，加载和渲染内容需要一些时间(该库渲染 LaTeX)。

我想知道我是否可以通过在其他页面上(预)加载此库来优化他们的体验，然后再到达实际使用它的页面。这样，我希望浏览器能够尽早缓存该库，这样稍后渲染可能会更快。

附注有问题的库是 MathJax。

Answer 1

由于您对 MathJax 特别感兴趣，因此简单地加载它不会为您带来那么高的性能。 (尽管 MathJax 会被缓存，如果您使用 MathJax CDN，您的用户在访问其他网站时可能已经缓存了它。)

有两个原因可能会导致您看不到性能的大幅提升。

首先，MathJax 动态加载其大部分组件。例如，MathJax 网络字体只有在用户系统上没有安装兼容字体的情况下才会加载，并且它们也会被分成几个部分，只有当 MathJax 实际遇到字符时才会加载。其他组件也是如此。这也意味着在没有任何数学知识的页面上，加载MathJax不会帮助您缓存太多。

话虽如此，MathJax 组件的实际下载可以通过使用以 -full 结尾的组合配置文件之一进行优化，请参阅 MathJax documentation 。

但是，排版通常才是真正影响性能的。 MathJax 输出取决于您的内容以及用户的屏幕、浏览器和操作系统的组合。计算最佳匹配以及插入和重排内容都是一个具有一些基本限制的问题(IE8 在标准模式下做得特别糟糕)。

PS:如果您有隐藏或动态内容，您可能需要查看配置选项skipStartupTypeset: true；请参阅MathJax documentation .

[免责声明:我是 MathJax 的一员]