@afterpack/protection-map

The viewer for the AfterPack Protection Map: a single HTML file that shows your original source, shaded by how much transformation each part went through, with the weak spots a build left readable.

You usually do not need to install this package. The AfterPack CLI and every AfterPack plugin already use it to write .afterpack/protectionMap.html when your build has source maps. Open that file in a browser. It works offline, straight from disk. Two options control it: protectionMap.enabled turns it on or off, and protectionMap.detailed set to false leaves out the per-region list of transformations for a smaller file.

The Protection Map contains your original source. Keep it local: never deploy, publish or commit it. AfterPack tools write it under .afterpack/, which carries its own .gitignore and self-ignores.

Render one yourself

If you have Protection Map data as JSON, render it with the bundled command. The template ships with the package:

npx afterpack-protection-map report.json protection-map.html

Add --no-lineage for a smaller file without the per-region transform history.

Or from Node:

import { writeFileSync } from "node:fs";
import { renderProtectionMapHtml } from "@afterpack/protection-map";

const { html } = renderProtectionMapHtml(data);
writeFileSync("protection-map.html", html);

renderProtectionMapHtml(data, { template, includeLineage }) uses the bundled template unless you pass one, and includes lineage unless includeLineage is false.

Links

• How to read the Protection Map
• Presets and protection levels
• Complexity
• Directives for protecting specific code

License

Apache-2.0.

Feedback

Questions, suggestions and bug reports: afterpack.dev/contact. You can also file a bug on GitHub Issues.