5 lines
25 KiB
JSON
5 lines
25 KiB
JSON
|
{
|
||
|
|
"id": "guide/service-worker-devops",
|
||
|
|
"title": "Service worker in production",
|
||
|
|
"contents": "\n\n\n<div class=\"github-links\">\n <a href=\"https://github.com/angular/angular/edit/master/aio/content/guide/service-worker-devops.md?message=docs%3A%20describe%20your%20change...\" aria-label=\"Suggest Edits\" title=\"Suggest Edits\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">mode_edit</i></a>\n</div>\n\n\n<div class=\"content\">\n <h1 id=\"service-worker-in-production\">Service worker in production<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/service-worker-devops#service-worker-in-production\"><i class=\"material-icons\">link</i></a></h1>\n<p>This page is a reference for deploying and supporting production apps that use the Angular service worker. It explains how the Angular service worker fits into the larger production environment, the service worker's behavior under various conditions, and available resources and fail-safes.</p>\n<h4 id=\"prerequisites\">Prerequisites<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/service-worker-devops#prerequisites\"><i class=\"material-icons\">link</i></a></h4>\n<p>A basic understanding of the following:</p>\n<ul>\n<li><a href=\"guide/service-worker-communications\">Service Worker Communication</a>.</li>\n</ul>\n<h2 id=\"service-worker-and-caching-of-app-resources\">Service worker and caching of app resources<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/service-worker-devops#service-worker-and-caching-of-app-resources\"><i class=\"material-icons\">link</i></a></h2>\n<p>Conceptually, you can imagine the Angular service worker as a forward cache or a CDN edge that is installed in the end user's web browser. The service worker's job is to satisfy requests made by the Angular app for resources or data from a local cache, without needing to wait for the network. Like any cache, it has rules for how content is expired and updated.</p>\n<a id=\"versions\"></a>\n<h3 id=\"app-versions\">App versions<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/service-worker-devops#app-versions\"><i class=\"material-icons\">link</i></a></h3>\n<p>In the context of an Angular service worker, a \"version\" is a collection of resources that represent a specific build of the Angular app. Whenever a new build of the app is deployed, the service worker treats that build as a new version of the app. This is true even if only a single file is updated. At any given time, the service worker may have multiple versions of the app in its cache and it may be serving them simultaneously. For more information, see the <a href=\"guide/service-worker-devops#tabs\">App tabs</a> section below.</p>\n<p>To preserve app integrity, the Angular service worker groups all files into a version together. The files grouped into a version usually include HTML, JS, and CSS files. Grouping of these files is essential for integrity because HTML, JS, and CSS files frequently refer to each other and depend on specific content. For example, an <code>index.html</code> file might have a <code><script></code> tag that references <code>bundle.js</code> and it might attempt to call a function <code>startApp()</code> from within that script. Any time this version of <code>index.html</code> is served, the corresponding <code>bundle.js</code> must be served with it. For example, assume that the <code>startApp()</code> function is renamed to <code>runApp()</code> in both files. In this scenario, it is not valid to serve the old <code>index.html</code>, which calls <code>startApp()</code>, along with the new bundle, which defines <code>runApp()</code>.</p>\n<p>This file integrity is especially important when lazy loading modules.\nA JS bundle may reference many lazy chunks, and the filenames of the\nlazy chunks are unique to the particular build of the app. If a running\napp at version <code>X</code> attempts to load a lazy chunk, but the server has\nupdated to version <code>X + 1</code> already, the lazy loading operation will fail.</p>
|
||
|
|
}
|