dojo dragon main logo

效率和性能

高性能渲染

动态网站内容 - 包括 JavaScript - 已经成为网络的一部分多年了。网站长期以来一直能够包含操纵 DOM 以添加、更新或删除内容的脚本。然而,网络的起源 - 以及今天仍然是其关键特征之一 - 是基于静态内容。浏览器 DOM 实现随着时间的推移而优化,以尽可能高效、快速地向最终用户呈现静态文档内容。

近年来,随着更复杂的 Web 应用程序的出现,浏览器已经通过有利于更多动态内容的 DOM 性能优化做出了回应。但是,为了渲染其用户界面,Web 应用程序仍然需要与一个几十年来基本保持不变的命令式 API 进行交互。围绕响应式数据传播设计的现代 Web 应用程序需要一种更有效的方式将它们的用户界面转换为网页的 DOM。

Dojo 将 DOM 从应用程序中抽象出来,并提倡使用响应式状态流来最大限度地减少应用程序样板代码,同时还允许提高渲染性能。小部件从它们的渲染函数输出虚拟节点,这些节点表示小部件在 虚拟化 DOM 中的结构表示。然后,框架处理在渲染之间以最有效的方式 渲染 VDOM 的更改,只影响实际需要更改的具体 DOM 元素。

Dojo 通过其 中间件 系统为需要来自 DOM 的具体信息的应用程序提供另一个 DOM 抽象层,以实现其需求。Dojo 中间件以一致的方式解决了这些问题中的许多问题,同时仍然支持跨应用程序的响应式数据流。

应用程序交付 - 分层和捆绑

随着 Web 应用程序规模的增长,对于用户来说,在仅需要一小部分应用程序资源的情况下加载所有应用程序资源变得效率低下。每个应用程序资源都有与其大小相关的成本:内存存储需求、网络上的数据传输;所有这些都会影响用户需要等待多长时间才能开始工作。通过让应用程序仅在需要时加载所需的内容,将此成本降至最低,符合用户的最佳利益。

获取应用程序资源会产生额外的 HTTP 资源协商开销。客户端需要请求数据,然后客户端必须等待服务器完成发送资源的最后一个字节。在更严重的情况下,开销还可能包括 DNS 解析、完整的 TCP 连接重新建立和 TLS 密码/证书协商。

浏览器在最大限度地减少这种开销方面非常有效,但它们无法完全消除它 - Web 应用程序仍然在最大限度地减少资源传输开销方面负有自己的责任。与给定资源的大小相比,获取应用程序资源相关的开销相对静态。获取 1 KB 文件产生的开销与获取 100 KB 文件产生的开销类似。

因此,可以通过两种方式最大限度地减少开销:减少资源总数,以及增加单个资源的大小。Web 应用程序可以通过分层和捆绑相关资源来实现这两点。

单个层应该包含与应用程序中特定功能相关的资源集。当用户访问该功能时,该层中的所有资源都可能在同一时间左右加载。然后,构成单个层的所有内容都可以捆绑在一起,形成一个单一文件,以便更有效地交付给用户。

自动分层

使用 Dojo 的 路由系统 时,应用程序可以从自动分层和捆绑中受益。应用程序的顶级路由每个都成为一个单独的层,Dojo 的构建系统将自动为每个子部分生成捆绑包。这提供了层分离和资源捆绑,而无需任何额外的工具链配置。这种自动化的权衡在于,跨多个层共享的公共依赖项会在每个捆绑包中内联和重复。

声明式分层

复杂的应用程序可能需要对其层/捆绑包定义进行更细粒度的控制。例如,如果应用程序有一组跨多个路由使用的共享依赖项 - 而不是在每个路由的捆绑包中内联/重复依赖项,可能希望将共享依赖项提取到它们自己的捆绑包中,该捆绑包可以在第一次引用时延迟加载。

Dojo 的构建管道允许在应用程序的 .dojorc 构建配置文件中指定资源 捆绑包,并且可以自动将跨捆绑包边界的模块依赖项转换为延迟加载的引用。