Web前端：优化Angular应用程序以提高网站速度的技巧（angular打包优化）

　　跨企业领域的许多已知和产生流量的网站都使用网站优化方法进行 Angular Web 开发，Angular 作为前端框架因其功能丰富、健壮、高性能的特点而广受欢迎应用内显示的性能问题是直接影响应用对最终用户体验的巨大问题。

网络流量下降、商业网站上没有流量或客户参与度下降是该应用程序的缺点Angular 存在一些问题，例如跳出率高，其中一些因素可以让你快速了解应用程序是否遇到问题如何优化 Angular 性能?1.变更检测策略.OnPush

更改检测是开发人员用于应用程序开发的最常见功能之一它主要可以检测用户的数据何时随着DOM的更新而改变或改变，以反映变化在这里，框架组件具有用于从其父组件获取数据的信息当异步事件发生时，Angular 会解析组件树并包含与之前值不同的数据。

通过严格相等运算符，检查应用程序性能是否存在差异此操作员检查分支输入或组件中的连接更改因此，为输入的当前值分配了新的内存2. 分离变更检测器当你计划使用 Angular 开发网站时，它会遵循带有变更检测器的树形部分。

我们可以渗透这个变化检测器 (ChangeDetectorRef) 以分离 CD 树的元素或将其连接到 CD 树因此，当 Angular 在元素树上运行 CD 时，它的元素及其子树将被跳过开发人员通过使用 ChangeDetectorRef 类来执行此操作。

导出抽象类 ChangeDetectorRef：

3. 延迟加载作为 AngularJS 应用程序开发的基本功能之一，延迟加载让开发人员能够处理路由器和组件的复杂性它允许他们避免块文件造成的混乱，并将大块文件分成多个较小的文件它将附带 JavaScript 组件;它们仅在触发特定路由器时加载。

4. 提前编译(AOT)AngularJS 应用程序开发中的 AOT 编译有助于将 TypeScript 代码转换为优美的 JavaScript 代码，并在运行之前优化和压缩整个代码这是 Angular 的主要功能之一，是用于提高网站速度的默认功能。

5. .JIT 与 .AOTAngular 提供了两种编译模型，即即时 (JIT) 和提前 (AOT)JIT 模型在运行时编译你的应用程序，而 AOT 编译发生在构建时默认情况下，开发人员使用 JIT 编译，这需要他们为你的软件开发包含 Angular 编译器。

另一方面，AOT 预计在开发时进行编译，只提供已编译的模板，并从部署包中删除 Angular 编译器它还将你的应用程序负载减少了大约 1MB，大约是 Angular 编译器的大小Angular JS 开发公司还使用带有 AOT 按钮的 CLI 命令编译它，并利用 AOT 优化：。

6. 提供缩放图像Serve Scaled Images 用于提高 Web 应用程序的速度这是一个缩放网站中使用的图像的过程，它使用缩放的图像优化网站虽然大图像可能会被压缩成固定大小，但它会占用额外的空间来降低网站的速度。

为了优化角度性能并避免网站速度下降，开发人员必须确保上传的图像是网站上 HTML 图像的实际大小。

7.优化图片在开发和执行 Angular 应用程序时，优化图像是提高网站速度的另一个重要方法与网站一起，图像优化有助于提高网站性能因此，Angular Web 开发建议保持文件大小以千字节为单位，并避免以兆字节为单位上传图像。

开发人员在上传图片时会牢记这些事情，因为在上传之前将大图片转换为更小的文件很重要8.代码拆分代码拆分是另一种减少加载时间的方法，它还有助于加快页面导航一旦开始构建和开发 Web 应用程序，它们就会变得更加复杂。

因此，发送给用户的 JavaScript 文件增加了，这使得任务更简单由于其巨大的 JavaScript 文件，它会减慢浏览器中的交互时间，尤其是对于移动用户而言对于 Angular 应用程序优化，代码拆分有效地减少了应用程序中的 JavaScript 负载。

请注意，执行此过程不会丢失功能这种技术通过将代码分成多个部分来帮助开发人员划分 JavaScript 代码，这些部分可以随着用户导航到不同的路径而逐渐加载Angular 应用程序的所有网络优化技巧都将有助于提高网站速度并减少负载。

了解使你的 Web 应用程序性能更高的每个技巧并知道何时应用它们会产生关键的差异