程序员经验分享-hwhale

页面性能：从 CDN 加载多个库脚本或将这些库组合并缩小为从服务器下载的一个文件？

2024-02-04

我了解从 CDN 加载 jQuery 等大型通用库的优势。

但是较小的插件和库帮助程序（例如 jQuery-ui 或 bootstrap 及其帮助程序）又如何呢？我的网站大约有 10-12 个。

我是否应该从 cdnjs 中单独选择它们并获得 CDN 的好处，但可能会有更多的 HttpRequest。或者我应该在本地将它们压缩并最小化到一个大插件文件中并从我的服务器加载？

我在 SO 上看到这个问题，框架为“公共 CDN 上的多个库或我们的 CDN 上的一个串联文件”，但是如果我们不订阅 CDN 该怎么办？


使用 CDN 的好处是用户可以从最近的 CDN 获取文件。此外，用户的计算机上可能已经有该文件，因此他不需要下载它。

创建捆绑包将最大限度地减少浏览器获取所有脚本/样式所需的 GET 数量。

我的建议是结合使用两者，因为浏览器一次只能下载 5 个文件。因此，将 CDN 用于最常见的库（用户可能已经拥有它们），并将捆绑包用于您自己的文件（您的样式表或 JS 文件）。

检查开发人员工具中的网络选项卡，测量每种情况下所需的时间。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

performance

页面性能：从 CDN 加载多个库脚本或将这些库组合并缩小为从服务器下载的一个文件？ 的相关文章

  • 使用 Firefox 插件 sdk 的 nsISocketTransportService

    我正在尝试使用 Firefox 来读取 SSH 横幅 IE 当您最初连接到 SSH 服务器时 服务器会向您发送其横幅 标识服务器软件 并且您向 SSH 服务器发送您的横幅 标识您的客户端软件 为此 我使用以下 URL 中的示例 firefo

  • JQuery datepickers-从开始日期设置结束日期

    使用了两个 Jquery 日期选择器 StartDate 和 EndDate

  • Mapbox GL 中的 MaxBounds 和自定义非对称填充

    我有一个 Mapbox GL JS 应用程序 在地图上显示一些小部件 为了确保地图上的任何内容都不会被它们隐藏 我使用以下命令添加了一些填充map setPadding 这是一个不对称的 在我的例子中左边比右边大 它按预期工作 例如fitB

  • 设置双指缩放时精确的滚动位置

    我正在创建一个地图应用程序 它将标记图像放置在画布上并滚动到它 我正在使用浏览器的捏缩放和滚动来放大 缩小地图 然而 我注意到有一些奇怪的行为 我想知道如何解决它 这有点难以解释 但我们开始吧 假设您处于网页的标准缩放级别 无法进一步缩小

  • 访问 nuxt 配置文件中的存储

    我想添加通过 Nuxt 静态生成的动态路由 我定义了一个客户端 服务器端存储asyncData方法 我想将这个存储值 一个数组 映射到我的nuxt config js文件使其成为 动态 静态 路线图nuxt generate命令 但如何访问

  • 检查两个数是否是彼此的排列？

    给定两个数字 a b 使得 1 例如 123 是 312 的有效排列 我也不想对数字中的数字进行排序 如果您指的是数字的字符 例如 1927 和 9721 则 至少 有几种方法 如果允许排序 一种方法是简单地sprintf将它们放入两个缓冲

  • 将 Firebase FCM 添加到 ReactJS 应用程序

    我正在尝试向我的 ReactJS 应用程序中的用户发送推送通知 我已添加 firebase 请求用户通知权限 这正在发挥作用 但现在我想注册设备令牌 但这给了我错误 消息传递 我们无法注册默认的 Service Worker 无法注册 Se

  • 如何在 Web 服务器上设置 gzip 压缩？

    我有一个嵌入式网络服务器 总共有 2 兆空间 通常 您使用 gzip 文件对客户端有利 但这会节省我们在服务器上的空间 我读到你可以只 gzip js 文件并将其保存在服务器上 我在 IIS 上测试过 但没有任何运气 为了使这项工作成功 我

  • 如果没有 /// 标签，TypeScript 的“将 JavaScript 输出合并到文件中”选项无法推断出正确的脚本顺序

    我正在开发一个使用 将 JavaScript 输出合并到文件中 选项的 TypeScript 解决方案 我经常引用另一个文件中定义的项目 例如 In MyBaseClass ts export class MyBaseClass In My

  • 如何使用 window.onerror 捕获所有 javascript 错误？ （包括道场）

    这个问题是后续问题javascript 如何在弹出警报中显示脚本错误 https stackoverflow com questions 2604976 javascript how to display script errors in

  • 模板中带有 ng-if 的 angularjs 指令

    我正在构建一个在模板内使用 ng if 的指令 奇怪的是 提供给链接函数的元素没有扩展ng if代码 它只是ng if的注释行 经过一番尝试 我发现通过将链接代码包装在 timeout 中似乎可以使其正常工作 但我想知道这是否不是正确的处理

  • 类中可以有生成器 getter 吗？

    我的意思是吸气剂是发电机 我相信这一切都是 ES6 也许像这样 class a get count let i 10 while i yield i let b new a for const i of b count console lo

  • 如何在 webpack 中渲染嵌套的 SASS？

    采取以下CSS MyComponent color blue Button color red 以及以下 React 组件 import React from react import classes from MyComponent sc

  • 摩纳哥：如何添加内联自动完成/代码建议？

    我找不到任何有关如何添加内联自动完成功能的示例 如下图所示 有人可以指导我如何在摩纳哥做到这一点吗 这可以在 v1 66 中启用 现在在 Insiders 中 The editor quickSuggestions设置现在接受内联为 配置值

  • ChartJs：如何按时间值（而不是像素）以编程方式平移

    我使用的是chartJs 3 6 1 和 Chartjs plugin zoom 1 2 1 但我认为这并不重要 我有 2 个时间序列折线图 当我通过拖放平移一个图表时 我也想移动 平移另一个图表 为此 我为 graphA 启用了缩放 平移

  • Jwt 签名和前端登录身份验证

    我有这个特殊的 jwt sign 函数 Backend const token jwt sign id user id process env TOKEN SECRET expiresIn 1m res header auth token

  • NHibernate - CreateCriteria 与 CreateAlias

    假设以下场景 class Project public Job Job class Job public Name 假设我想使用 Criteria API 搜索其 Job 名称为 sumthing 的所有项目 我可以使用 CreateAli

  • ng-include 和 ng-view 不同时加载

    下面是我的应用程序的结构 很简单 页眉和页脚是非常小的文件 而主页上的 ng view 要大得多 当我进入该页面时 我注意到了这一点 首先加载两个 ng include 然后 ng view 出现 页脚被推到底部 页脚闪烁大约 0 1 秒

  • Chrome 扩展：强制 popup.html 关闭

    我想知道是否可以强制 popup html 关闭 在弹出的 javascript 中 window close

  • 如何映射轮播的子项数组？

    我正在尝试将 Carousel 组件包装在映射对象数组周围作为组件的子级 目前我只能让映射创建映射对象的 1 个子对象 轮播需要像这样

随机推荐

  • 使用java的小型http服务器？

    我使用 java 创建了以下测试服务器 import java io import java net class tcpServer public static void main String args ServerSocket s nu

  • PostgreSQL 使用组和顺序计算滚动平均值

    我有一张表如下 id x y value 1 1 1 25 1 1 2 42 1 2 3 98 1 2 4 54 1 3 5 67 2 1 1 78 2 1 2 45 2 2 3 96 我必须按 id 对其进行分组 同时按 id x 和 y

  • 尝试安装 VS2019 扩展会导致 NullReferenceException

    自 VS 2019 发布以来 我一直无法向其添加扩展 我最近更新到版本 16 4 3 但当我尝试添加扩展时仍然遇到相同的错误 我尝试执行以下操作 但仍然失败并出现上面的错误对话框 从 Visual Studio 中的扩展管理器安装 从 Ma

  • 在 NSUserDefaults Xcode 中存储和更新 Swift 字典

    我想在用户输入值时存储和更新字典 一切似乎都正常 直到这段代码 并且应用程序崩溃了 override func viewDidLoad super viewDidLoad if NSUserDefaults standardUserDefa

  • 将字体设置为斜体和粗体

    如何将多种字体样式应用于文本 System Drawing Font MyFont new System Drawing Font thisTempLabel LabelFont float thisTempLabel fontSize F

  • Hibernate 的代码优先方法

    我是一名 PHP 开发人员 正在学习 Java Spring MVC Hibernate 我想知道 Hibernate 是否支持像 Entity is ASP NET 或 Doctrine with PHP 这样的代码优先方法 到目前为止我

  • Flutter - 如何删除单个 google_maps_flutter ^0.5.21 标记？

    自成立以来发生了很大变化google maps flutter 这意味着删除单个标记的过程也发生了变化 我在这个问题的旧查询中发现了什么 删除版本 0 0 1 上的标记 https stackoverflow com questions 5

  • 如何从 Slack 机器人发送定期短暂（“隐藏”）消息

    我有兴趣编写一个 Slack 机器人 它会定期向用户发送 短暂 消息 临时消息是出现在频道内的消息 但只能由特定用户看到 例如对机器人 斜杠命令 例如 who 的响应 然而 这里的目标是让机器人定期发送临时消息 并且 出现在频道消息流中 即

  • 启动 Java Swing 桌面应用程序的正确方法

    启动需要 5 10 秒从数据库检索初始数据的应用程序的正确方法是什么 这是我到目前为止所得到的 但我不确定是否有更好的方法 我希望 GUI 和数据库访问位于不同的线程中 以便 GUI 构建与数据检索同时发生 public static vo

  • 如何解析来自 ruby​​ 客户端的 SOAP 响应？

    我正在学习 Ruby 并且编写了以下代码来了解如何使用 SOAP 服务 require soap wsdlDriver wsdl http www abundanttech com webservices deadoralive deado

  • 反序列化抽象类的集合[重复]

    这个问题在这里已经有答案了 我有一个包含 Web API 和 MVC Web 应用程序的解决方案 我的 API 有这个实体模型 有一个抽象父类和几个子类 public abstract class Person public Guid Id

  • Ruby：Proc#call 与 Yield

    以下两个 Ruby 实现之间的行为差 异是什么thrice method module WithYield def self thrice 3 times yield yield to the implicit block argument

  • 将日期 dd/mm/yyyy 格式从表单转换为时间戳？

    我有一份表格 要求填写日期dd mm yyyy格式 我尝试将其转换为时间戳strtotime 功能 但我发现只有当您在表格中填写日期时 它才有效dd mm yyyy 我该如何解决 我不知道国外的情况 但在意大利没有人这样写日期dd mm y

  • 如何获取recyclerview Item位置的文档id？

    我正在使用firebaseUI使用库来填充回收器视图firestore数据库 当我尝试检索时文档编号当我点击回收器查看项目时 它是这样的 DocumentSnapshot snapshot getSnapshots getSnapshot

  • 如何使用curl 访问IBM 语音转文本API？

    我无法使用curl 访问IBM Bluemix 上的语音转文本API 我尝试了文档中使用curl进行无会话请求的示例 但它不起作用 我收到无效的用户 ID 密码消息 这是我得到的错误 代码 401 错误 未授权 描述 2016 10 08T

  • 如何获取MemberInfo的值？

    我如何获得 a 的值MemberInfo目的 Name返回变量的名称 但我需要该值 我认为你可以这样做FieldInfo但我没有代码片段 如果你知道如何做到这一点 你可以提供一个代码片段吗 Thanks 虽然我总体上同意 Marc 关于不反

  • 数据导入期间超出 Fuseki GC 开销限制

    我正在尝试在启动时将 LinkedMDB 610 万个三元组 导入到我的本地版本的 jena fuseki 中 path to fuseki server file path to linkedmdb nt ds 它运行了一分钟 然后因以下

  • Java：字符串分割

    我有以下字符串 Mr John Smith Dickson lt email protected cdn cgi l email protection gt 我想把它分成三个部分 第1部分 先生第二部分 约翰 史密斯 迪克森第三部分 电子邮

  • 找出特定整数有多少个二进制数字[重复]

    这个问题在这里已经有答案了 可能的重复 计算快速对数以 2 为底的上限 https stackoverflow com questions 3272424 compute fast log base 2 ceiling 在 C C 中 找出

  • 页面性能：从 CDN 加载多个库脚本或将这些库组合并缩小为从服务器下载的一个文件？

    我了解从 CDN 加载 jQuery 等大型通用库的优势 但是较小的插件和库帮助程序 例如 jQuery ui 或 bootstrap 及其帮助程序 又如何呢 我的网站大约有 10 12 个 我是否应该从 cdnjs 中单独选择它们并获得

热门标签