bdefeb1f11
The HTML for the docs pages is generated by Dgeni based on some [Nunjucks][1] templates. Previously, these templates were set up in a way that introduced a lot excess whitespace in the generated HTML, unnecessarily bloating the corresponding JSON files that need to be downloaded in order to view a certain docs page. This has been discussed in #28105 and was again observed while investigating #43285. This commit refactors some of the templates related to API docs (which seem to be the most affected ones) to drastically reduce the amount of excess whitespace. More specifically, the total size of all files in `generated/docs/api/` was reduced from ~13MB to ~7MB. Besides the reduced payload size for each API page, this change will also reduce the amount of memory needed by the ServiceWorker to cache the API pages that have been visited by a user. NOTE: The affected files are not eagerly downloaded when navigating to angular.io. Instead, each file is downloaded individually, as soon as a user visits the corresponding API docs page. Therefore, the impact of this change will be relatively small for most users. [1]: https://mozilla.github.io/nunjucks/ PR Close #43435 |
||
|---|---|---|
| .. | ||
| angular-api-package | ||
| angular-base-package | ||
| angular-content-package | ||
| angular-errors-package | ||
| angular.io-package | ||
| authors-package | ||
| cli-docs-package | ||
| content-package | ||
| examples-package | ||
| helpers | ||
| links-package | ||
| remark-package | ||
| target-package | ||
| templates | ||
| .eslintignore | ||
| .eslintrc.js | ||
| config.js | ||
| README.md | ||
| test.js | ||
Overview
All the content that is rendered by the AIO application, and some of its configuration files, are generated from source files by Dgeni. Dgeni is a general purpose documentation generation tool.
Markdown files in /aio/content, code comments in the core Angular source files and example files are processed and transformed into files that are consumed by the AIO application.
Dgeni is configured by "packages", which contain services and processors.
Some of these packages are installed as node_modules from the dgeni-packages and some are specific to the AIO project.
The project specific packages are stored in this folder (aio/tools/transforms).
If you are an author and want to know how to generate the documentation, the steps are outlined in the top level README.md.
Root packages
To run Dgeni, you must specify a root package, which acts as the entry point to the documentation generation.
This root package, in turn requires a number of other packages, some are defined locally in the tools/transforms folder, such as tools/transforms/cheatsheet-package and tools/transforms/content-package, etc.
And some are brought in from the dgeni-packages node modules, such as jsdoc and nunjucks.
- The primary root package is defined in
tools/transforms/angular.io-package/index.js. This package is used to run a full generation of all the documentation. - There are also root packages defined in
tools/transforms/authors-package/*-package.js. These packages are used by the documentation authors when writing docs, since it allows them to run partial doc generation, which is not complete but is faster for quickly seeing changes to the document that you are working on.
Other packages
- angular-base-package
- angular-api-package
- angular-content-package
- content-package
- examples-package
- links-package
- post-process-package
- remark-package
- target-package
Templates
All the templates for the angular.io dgeni transformations are stoted in the tools/transforms/templates folder.
See the README.