想让您的 Angular 网站尽可能快速且易于访问吗？你来对地方了！
Minko Gechev
什么是 Angular？
Angular 是用于构建界面的框架。它提供的构建块可帮助您快速设置可维护且可扩缩的应用。借助 Angular，开发者能够创建在 Web、移动设备或桌面设备上运行的应用。
此集合中包含什么？
本系列文章重点介绍了优化 Angular 应用的五个主要方面：
- 提升应用的性能以提高用户转化率和互动度
- 使用 Angular Service Worker 预缓存资源，提高应用在网络状况不佳时的可靠性
- 使用预呈现和服务器端呈现，让搜索引擎和社交媒体漫游器发现您的应用
- 使您的应用可安装，从而提供与 iOS/Android 应用类似的用户体验
- 改进应用的无障碍功能，使其可供所有用户使用和理解
该系列中的每篇博文都介绍了一些技巧，您可以直接将其应用到自己的应用中。
此集合中不包含哪些元素？
本集合假定您已熟悉 Angular 和 TypeScript。如果您对这些方面还不太确定，请查看 TypeScript 文档和 angular.io 上的 Angular 使用入门指南。
启动项目
借助 Angular 命令行界面 (CLI)，您可以快速设置简单的客户端 Angular 应用。这篇博文对 CLI 进行了简要介绍，本系列中的其他博文则展示了如何添加更多高级功能，例如服务器端渲染和部署支持。
设置 CLI
首先，全局安装 CLI，并通过运行以下命令来验证您是否拥有最新版本：
npm i -g @angular/cli
ng --version
确保最后一个命令输出的是 8.0.3 或更高版本。
或者，如果您不想全局安装 CLI，可以在本地安装并使用 npx 命令来运行它：
npm i @angular/cli
npx ng --version
创建项目
如需创建新项目，请运行以下命令：
ng new my-app
此命令将为您的应用创建初始文件和文件夹结构，并安装所需的节点模块。
设置过程成功完成后，请运行以下命令来启动您的应用：
cd my-app
ng serve
现在，您应该能够通过 http://localhost:4200 访问自己的应用。
后续操作
在此集合的其余部分，您将了解如何改进 Angular 应用的性能、无障碍功能和搜索引擎优化 (SEO)。涵盖的内容如下：
- Angular 中的路线级代码拆分
- 使用 Angular CLI 计算性能预算
- Angular 中的路线预提取策略
- Angular 中的变更检测优化
- 使用 Angular CDK 虚拟化大型列表
- 使用 Angular Service Worker 进行预缓存
- 使用 Angular CLI 预渲染路线
- 使用 Angular Universal 进行服务器端渲染
- 使用 Angular CLI 添加 Web 应用清单
- 使用 Codelyzer 审核无障碍功能