「这是我参与11月更文挑战的第9天，活动详情查看：2021最后一次更文挑战」
参看 Philip Walton 的 《Page Lifecycle API》
今天的现代浏览器在系统资源(内存)受限时，有时会暂停页面或完全不加载这些页面，从而减少电量和内存消耗。在Chrome 68 中推出的页面生命周期 API 提供了生命周期钩子，这样就给你更多自由度，在页面可以安全地处理这些浏览器的干预，而不影响用户体验。看一下 API，这是今天主要想要介绍的内容。
背景
我们通常将组件页面都给予其一个生命周期，在设计一个框架时候我们对于一些跨越时间存活一定时间的组件也好，需要考虑将其按状态划分为几个阶段从而便于管理。
应用程序生命周期是现代操作系统管理资源的一个关键方式。在安卓、iOS和最近的 Windows 版本上，应用程序可以在任何时候由操作系统启动和停止。这使得这些平台能够精准地考虑如何分配资源，使其便于用户使用。
再过去并没有生命周期这样的概念，应用程序可以运行以及存活时间不会受到系统的限制。不过随着大量网页的运行，关键的系统资源，如内存、CPU、电池和网络可能会被超额占用，从而大大影响了用户的体验。
web 应用开发过程，可能了解到一些关于生命周期状态的事件，如加载、卸载和可见性变化。但这些事件只允许开发人员对用户发起的生命周期状态变化做出反应。为了使 web 应用可以在低功率设备上可靠地运行，浏览器需要一种方法来主动地回收和重新分配系统资源。
其实今天的浏览器已经采取了积极的优化策略，为后台标签中的网页节约资源，而且许多浏览器（尤其是Chrome）希望在这方面做得更多--以减少其总体资源占用。
问题是开发人员目前没有办法为这些类型的系统发起的干预进行措施，甚至都不知道这些系统的干预什么时候发生。这意味着浏览器需要采取一些，否则就会有破坏网页的风险。
页面生命周期 API 试图通过以下方式来解决这个问题
-
在网络上引入生命周期状态的概念并使之标准化。
-
定义新的、由系统发起的状态，使浏览器能够限制隐藏或不活动的标签所能消耗的资源。
-
创建新的 API 和事件，使网络开发者能够对这些新的系统启动状态的改变做出反应。
这个解决方案提供了网络开发者所需的可预测性，以建立对系统干预有弹性的应用程序，允许浏览器更积极地优化系统资源，这样为使用应用的用户提供了良好的体验。
将介绍 Chrome 68 中的新页面生命周期功能，并探讨生命周期与所有现有网络平台状态和事件的关系。还将就开发人员在每种状态下应该（或不应该）进行的工作类型给出建议和最佳实践。
页面生命周期的状态和事件概述
所有的页面生命周期状态都是离散的、相互排斥的，这意味着一个页面在同一时间只能处于一种状态。而且，页面生命周期状态的大多数变化一般都可以通过DOM事件观察到（例外情况见每个状态的开发者建议）。
也许解释页面生命周期状态的最简单的方法是用一张图来说明--以及表明它们之间转换的事件。
| state | 描述 |
|---|---|
| Active | 当页面可见并输入焦点，前一个状态可能是 passive(通过 focus 事件) 下一个状态可能是 passive（通过 blur 事件) |
| passive | 如果一个页面是可见的并且没有输入焦点，那么就处于 passive 状态。 |
