是否应该从供应商或 CDN 加载第三方库?

我看到有些插件会下载第三方库并将其作为本地文件从 /vendor 加载,而另一些则通过 CDN 引入库。

就带宽和速度而言,哪种方法更好?

这两个方案之间有一点灰色地带。您可以配置 Discourse 通过 CDN 提供资源,包括主题或插件的 JS 文件。因此,即使您的插件在 /vendor 中加载外部库,它也会从您为 Discourse 配置的 CDN 加载。不过,这是一个私有 CDN。

话虽如此,我认为您指的不是这个。您指的是像 https://cdnjs.comhttps://www.jsdelivr.com 这样的服务,这属于另一个略有不同的话题——公共 CDN。

像 cdnjs 这样的服务拥有专门用于此类用途的广泛服务器网络。

所以,

它们可能更快,并且确实有助于减轻您服务器的负载。

但是……如果您的网站已配置 Discourse 使用私有 CDN,那么在 /vendor 上使用文件也能获得同样的速度优势。

此外,关于带宽,大多数外部 JS 库都小于 20KB。因此,虽然您确实能节省一些带宽……但这并不是一个主要问题,除非您的网站每天拥有数十万的浏览量。

使用类似 cdnjs 的服务的好处之一是,它们提供相同的文件并设置缓存头。

这意味着什么?我们以 jQuery 为例。

许多网站使用 jQuery,其中许多使用 cdnjs 来分发 jQuery。当 cdnjs 向用户分发 jQuery 文件时,它会包含缓存头——默认为 1 年。

这意味着,如果用户访问了使用 cdnjs 提供 jQuery 的网站 A,然后访问了同样使用相同版本文件的网站 B,他们的浏览器无需再次下载 jQuery,因为它已被缓存——从而加快了页面加载速度。

上述观点是使用类似 cdnjs 的服务来提供外部库的最大优势。
然而,很少有库像 jQuery 那样普遍,因此这实际上取决于该库的普及程度。

当您从 cdnjs 加载文件时,还需要确保将它们添加到 CSP 设置 中。

所以,我想这里的答案是……视情况而定。

您是直接加载该库吗?
它常见吗?
它的体积较大吗?

如果是,也许可以使用 CDN。如果不是,保持简单,直接将其添加到 /vendor 中即可。

此处有一个小更新:Chrome、Safari 和 Firefox 不再以此方式工作。网站之间不再有共享缓存:

有人能分享一个插件链接吗,该插件使用通过 /vendor 文件夹或 CDN 添加第三方库的方法?

我找不到任何相关文档,并且在将第三方库包含到我的插件、正确注册它、符合确切的文件夹结构以及在控制器文件中正确编写导入语句时遇到了麻烦。

提前感谢您的帮助!

discourse-math 可能是一个不错的参考——它在 /public 目录下有许多“已打包”的脚本。或者一个更简单的例子可以是 discourse-client-performance