@vernikr/size-report 2.5.0 → 2.6.0

package/src/page/state.js

@@ -1,3 +1,5 @@
+import { appDecode } from './payload.js';
+
 /* The page's choice state: what is switched on, how it survives a closing and how it travels as a link.
  *
  * An ordinary source file rather than a string inside the engine: a linter sees it, and it is pasted into the assembled
@@ -14,26 +16,45 @@
  * not applied while a vanished name simply means nothing. The same record goes into the address — which is what one
  * sends to a colleague.
  *
- * The page does not derive a number's accuracy itself: the marks of approximate cells arrive in the data, from the same
- * rule that names a metric's accuracy. The page draws no such conclusion from paths and formats — there will be no
- * second rule of accuracy. */
+ * The page draws no conclusion about how a number was obtained: the method of each metric arrives in the data, and the
+ * page prints it. There is no second rule of counting here, and no vocabulary of precision either. */
 
-export const appData = JSON.parse(document.getElementById('data').textContent);
 export const appUi = JSON.parse(document.getElementById('ui').textContent);
-export const appView = { metrics: {}, files: [], folded: {} };
-appData.metrics.forEach((m) => { appView.metrics[m.key] = true; });
-appData.files.forEach(() => { appView.files.push(true); });
 
-/* A metric's description by key: the tooltip of an approximate cell names the way its number was obtained — the same one
- * that stands in the metric's caption, so the page holds no two answers about "counted with what". */
-export const appMetric = {};
-appData.metrics.forEach((m) => { appMetric[m.key] = m; });
+/* The model is not a constant any longer: the block in the file is **packed** (gzipped and base64 encoded,
+ * `appUnpack` of the payload chapter), so unpacking is asynchronous and the model is set once, by `appBoot`,
+ * before anything is drawn and before any chapter below reads it. The names, their shapes and their order are what
+ * they were; only their appearance moved — from the parse to that one call. */
+export let appData = null;
+export let appView = null;
+export let appMetric = null;
+export let appMeasured = null;
+let appKey = null;
+let appFoldKey = null;
 
-/* A column by a file's path: the page's tree is the project's tree (every path of the catalogue) while the numbers
- * belong to columns only, so this pointer is what decides whether a leaf is a checkbox or a caption. The name follows the
- * same rule as the choice's record (`appFileAt`), so the tree and the reader's memory cannot drift apart. */
-export const appMeasured = {};
-appData.files.forEach((_f, i) => { appMeasured[appFileAt(i)] = i; });
+/* One place that turns the unpacked block into what the chapters speak: the sparse form is unrolled by the payload
+ * chapter into the dense contract every number comes from — snapshots per commit, the texts themselves, "now" as
+ * the state at HEAD — and the view starts switched on whole.
+ *
+ * A metric's description by key stands here too: the way the number was obtained is text under the switches, so the
+ * page holds no second answer about "counted with what".
+ *
+ * A column by a file's path is the pointer that decides whether a leaf of the tree is a checkbox or a caption (the
+ * page's tree is the project's tree while the numbers belong to columns only); the name follows the same rule as the
+ * choice's record (`appFileAt`), so the tree and the reader's memory cannot drift apart.
+ *
+ * The key the reader's memory lives under is counted here as well, because it is the report's passport: it depends
+ * on the data, and until the block is unpacked there is nothing to count it from. */
+export function appBoot(text) {
+  appData = appDecode(JSON.parse(text));
+  appView = { metrics: {}, files: [], folded: {} };
+  appMetric = {};
+  appMeasured = {};
+  appData.metrics.forEach((m) => { appView.metrics[m.key] = true; appMetric[m.key] = m; });
+  appData.files.forEach((_f, i) => { appView.files.push(true); appMeasured[appFileAt(i)] = i; });
+  appKey = 'size-report:' + appPassport();
+  appFoldKey = appKey + ':tree';
+}
 
 /* A link is that same choice in the address, under a name of its own: someone else's anchor on the page does not count
  * as a link, and there is nothing to argue with it about. */
@@ -70,12 +91,19 @@ function appHash(text) {
  * report's order. It is what tells one report from another — the record's key is chosen by it, so a choice made in
  * someone else's report is not picked up. The package version and the top of the history are absent on purpose: this is
  * the same report — updating the tool does not change what a column means, while a grown history is the very history the
- * reader comes back to. */
+ * reader comes back to.
+ *
+ * Counted once per document: it is a constant of the report, which depends on nothing the reader can change, and every
+ * click asks for it (the key of the memory and the passport of the record). A second count would be a second answer
+ * waiting to happen, and the labels it reads do not change while the page is open. */
+let appPassportValue = null;
 function appPassport() {
-  return appHash([appData.tool.name, appData.schema, appData.report.artifact,
-    appData.report.title, appData.files.map((f) => f.label).join('|')].join('\n'));
+  if (appPassportValue === null) {
+    appPassportValue = appHash([appData.tool.name, appData.schema, appData.report.artifact,
+      appData.report.title, appData.files.map((f) => f.label).join('|')].join('\n'));
+  }
+  return appPassportValue;
 }
-const appKey = 'size-report:' + appPassport();
 
 /* One record of the choice for everything: it goes both into the memory and into the address, so there are no two formats
  * of one state. Only what is switched off is kept, by name: "switched on" and "no record" are the same state, which is
@@ -93,27 +121,54 @@ function appRecordOk(rec) {
   return rec !== null && typeof rec === 'object' && rec.v === 1 && rec.passport === appPassport();
 }
 
+/* The address is the link for a colleague, while the memory is the reader's own: the memory is written on the click
+ * itself — that is what survives a closing — and the address 200 ms after the last of a burst of switches, because a
+ * burst is one link rather than five history entries and five URL parses. The delay is short enough for a person and
+ * long enough to swallow a run of clicks; a timer that fires after the page is gone writes nothing useful, which is the
+ * price of not writing the address five times. */
+const APP_ADDRESS_DELAY = 200;
+let appAddressTimer = null;
+
+/* An address that came in from outside wins over a write this page has not made yet: a click arms a write, a link
+ * arrives within the delay, and the choice left behind must not land on the address the reader was sent — a refused link
+ * arms nothing to replace it, so without this the page would rewrite someone else's address a fifth of a second later. */
+export function appAddressDrop() {
+  if (appAddressTimer === null) return;
+  clearTimeout(appAddressTimer);
+  appAddressTimer = null;
+}
+
+function appAddressLater(text) {
+  appAddressDrop();
+  appAddressTimer = setTimeout(() => {
+    appAddressTimer = null;
+    try {
+      window.history.replaceState(null, '', APP_LINK + encodeURIComponent(text));
+    } catch (_e) {
+      /* The browser grants no change of the address: the link is then taken from the browser's memory. */
+    }
+  }, APP_ADDRESS_DELAY);
+}
+
+/* One record for a click and two destinations: the same text goes into the memory and — a moment later — into the
+ * address, so the two cannot describe different choices. */
 export function appWrite() {
   const rec = appRecord();
+  const text = JSON.stringify(rec);
   const empty = Object.keys(rec.metrics).length === 0 && Object.keys(rec.files).length === 0;
   if (!appTransient) {
     try {
       if (empty) window.localStorage.removeItem(appKey);
-      else window.localStorage.setItem(appKey, JSON.stringify(rec));
+      else window.localStorage.setItem(appKey, text);
     } catch (_e) {
       /* There is no memory (the browser grants this page none): the choice will not survive a closing, while the numbers
        * and the markup do not depend on it. */
     }
   }
-  /* The address is the link for a colleague, which is why it repeats the choice. But not during the first drawing and not
-   * when the link turned out to be someone else's: an address that came in is not ours, and the reader has yet to read
-   * it. */
+  /* But not during the first drawing and not when the link turned out to be someone else's: an address that came in is
+   * not ours, and the reader has yet to read it. */
   if (appStartup || appForeign) return;
-  try {
-    window.history.replaceState(null, '', APP_LINK + encodeURIComponent(JSON.stringify(rec)));
-  } catch (_e) {
-    /* The browser grants no change of the address: the link is then taken from the browser's memory. */
-  }
+  appAddressLater(text);
 }
 
 /* A reset to "everything on": the border between "this is no longer in the report" and "switched off" is the record
@@ -220,12 +275,12 @@ export function appApply(rec) {
 
 /* -------- the folded tree -------- */
 
+
 /* Folded folders are a memory of the same kind as the choice, but of a record of their own: it is about how much of the
  * tree is visible rather than about which numbers are read. Hence it does not go into the address: a link is sent for the
  * sake of the numbers, while an unfolded tree is the onlooker's business. As with the choice, only what is folded is kept
- * (`true`), and a folder's name is its path ("src/page"), so a vanished name simply means nothing. */
-const appFoldKey = appKey + ':tree';
-
+ * (`true`), and a folder's name is its path ("src/page"), so a vanished name simply means nothing. `appFoldKey` is
+ * set with the rest of the model (`appBoot`), for the reason the key itself is. */
 export function appFoldRead() {
   let text = null;
   try {

package/src/page/table.js

@@ -1,45 +1,47 @@
-import { cellParts, commitParts, nowModel, rowModel, valueParts } from '../derived.js';
+import { cellParts, commitParts, deltaOf, nowModel, rowModel, valueParts } from '../derived.js';
 import { appEl } from './dom.js';
-import { appData, appUi, appView, appMetric } from './state.js';
+import { appData, appUi, appView } from './state.js';
 
-/* An approximate cell: the mark comes from the engine's data rather than being derived here from a file's path — the rule
- * of accuracy lives where the numbers are counted. For a file's cell it is that number itself, for a total the worst of
- * what went into it, or the sum would promise an accuracy its terms do not have. Returns the metric's description (its way
- * of counting is what goes into the cell's tooltip) or nothing. */
-export function appApprox(where, files, key) {
-  const marks = appData.approx[key];
-  if (marks === undefined) return null;
-  const row = where === 'now' ? marks.now : marks.rows;
-  const base = where === 'now' ? 0 : where * appData.files.length;
-  for (let i = 0; i < files.length; i++) {
-    if (row.charAt(base + files[i]) === '1') return appMetric[key];
-  }
-  return null;
-}
+/* The table is built once and then only shown and hidden. That rests on three things that do not depend on the
+ * reader: a cell's content and colour come from the pair (commit, file) and a metric (`cellParts`, `valueParts`),
+ * the order of the columns comes from the files alone, and only the visibility and the totals are the choice's.
+ * Hence nothing below builds a node after the first drawing — a click writes a class and a number.
+ *
+ * What makes this cheap is a cache of references to the nodes of every column (`appTable` returns it): reaching a
+ * cell through the markup costs several times what changing it does (measured: `tr.children[i]` 0.0254 ms against
+ * `classList.toggle` 0.0070 ms), and the first drawing creates every node anyway, so collecting them is free. The
+ * columns of the fixed layout — a `<col>` per column, carrying the counted width — are collected there too.
+ *
+ * The totals are the only numbers that move with the choice, and they are carried rather than recounted: a sum is
+ * linear, so a file switched off subtracts exactly its own numbers — the same integers the first drawing wrote.
+ */
 
-/* The cell's class is assembled in one place: both the mark of approximation and the gap ("no such file") are properties
- * of the cell itself rather than of its content. */
-function appCellClass(first, miss, approx) {
-  return 'num' + (first ? ' g' : '') + (miss ? ' miss' : '') + (approx === null ? '' : ' approx');
+/* The cell's class: the metric's track (`m0`, `m1`, … — one class per metric, which is what hides a whole metric
+ * at once), the group it belongs to (every cell of a group, not the first one: the group's left border is carried
+ * by the first *enabled* metric, and the styling decides which that is), and the gap ("no such file"). */
+function appCellClass(mi, miss) {
+  return 'num g m' + mi + (miss ? ' miss' : '');
 }
 
-// The markup of a commit row's cell: the rules live in cellParts, only the node is here.
-export function appCell(cell, first, approx) {
-  const parts = cellParts(cell.value, cell.delta, '−');
-  const td = appEl('td', appCellClass(first, parts.miss, approx));
-  if (approx !== null) td.title = appUi.approxCell + approx.method;
+/* A cell filled where it stands: the totals are written again on every click, and a cell has to forget its own
+ * content first — a delta is a node of its own, so `textContent` alone would leave it behind. */
+function appFill(td, parts) {
+  td.textContent = '';
   if (parts.dir === null) td.textContent = parts.text;
   else td.appendChild(appEl('span', 'delta ' + parts.dir, parts.text));
   return td;
 }
 
+// The markup of a commit row's cell: the rules live in cellParts, only the node is here.
+export function appCell(cell, mi) {
+  const parts = cellParts(cell.value, cell.delta, '−');
+  return appFill(appEl('td', appCellClass(mi, parts.miss)), parts);
+}
+
 // The markup of the top row's cell: the rules live in valueParts.
-export function appValueCell(value, first, approx) {
+export function appValueCell(value, mi) {
   const parts = valueParts(value);
-  const td = appEl('td', appCellClass(first, parts.miss, approx));
-  if (approx !== null) td.title = appUi.approxCell + approx.method;
-  td.textContent = parts.text;
-  return td;
+  return appFill(appEl('td', appCellClass(mi, parts.miss)), parts);
 }
 
 /* A commit's caption: the date, the subject, the journal section's mark. The column's width and the clipping of a long
@@ -61,15 +63,9 @@ export function appCommit(row) {
   return th;
 }
 
-export function appSubHead(metrics) {
-  const tr = appEl('tr');
-  metrics.forEach((m, mi) => tr.appendChild(appEl('th', mi === 0 ? 'g' : '', m.label)));
-  return tr;
-}
-
 /* The empty states: when there will be no numbers at all, the page says so in words rather than showing a grid without
  * columns. Every file can be switched off — then the total volume remains, and the note explains why there are no
- * columns. */
+ * columns. The table itself stands there either way: this is about what is shown, not about what exists. */
 export function appState(metricsCount, filesCount) {
   const state = document.getElementById('state');
   const text = metricsCount === 0 ? appUi.empty : (filesCount === 0 ? appUi.noFiles : '');
@@ -78,26 +74,44 @@ export function appState(metricsCount, filesCount) {
   document.getElementById('shell').hidden = metricsCount === 0;
 }
 
-/* The header: a row of groups (the total and the files) and a row of metrics under it. The metrics repeat for every file,
- * so the sub-header is assembled once and its nodes then move on into the following ones — no copies of the markup are
- * made. */
-export function appHead(shown, files, metrics) {
+/* The order of the columns: the files the last commit touched come first — the report is rebuilt after every
+ * commit, and a reader's first question is what that edit brought. Inside each part the order stays as it comes
+ * from the settings, and it depends on the files rather than on the choice: that is what lets a column be hidden
+ * without moving the others. */
+export function appOrder() {
+  const files = [];
+  appData.files.forEach((_f, i) => files.push(i));
+  files.sort((a, b) => (appData.last[a] === true ? 0 : 1) - (appData.last[b] === true ? 0 : 1));
+  return files;
+}
+
+/* The header: a row of groups (the total and the files) and a row of metrics under it — every metric of every file,
+ * because nothing here knows the choice. The headings whose `colSpan` follows the number of enabled metrics and the
+ * headings of each file's column are collected in the cache: they are the nodes a click has to touch. */
+export function appHead(files, metrics, cache) {
   const head = appEl('tr');
   const commit = appEl('th', 'c-commit', appUi.commit);
   commit.rowSpan = 2;
   head.appendChild(commit);
-  const total = appEl('th', 'g', appUi.total);
-  total.colSpan = metrics.length;
-  head.appendChild(total);
-  files.forEach((i) => {
-    const th = appEl('th', 'g', appData.files[i].label);
+  const subs = appEl('tr');
+  const group = (label, i) => {
+    const th = appEl('th', 'gh', label);
     th.colSpan = metrics.length;
     head.appendChild(th);
-  });
-  const subs = appSubHead(shown);
-  files.forEach(() => {
-    const more = appSubHead(shown);
-    while (more.firstChild) subs.appendChild(more.firstChild);
+    cache.spans.push(th);
+    /* The group's own heading belongs to the column: hiding a file has to take its caption with it, or the header
+     * would keep a name over numbers that are gone. */
+    if (i !== null) cache.cols[i].push(th);
+    metrics.forEach((_key, mi) => {
+      const cell = appEl('th', 'g m' + mi, appData.metrics[mi].label);
+      subs.appendChild(cell);
+      if (i !== null) cache.cols[i].push(cell);
+    });
+  };
+  group(appUi.total, null);
+  files.forEach((i) => {
+    cache.cols[i] = [];
+    group(appData.files[i].label, i);
   });
   const thead = appEl('thead');
   thead.appendChild(head);
@@ -105,38 +119,211 @@ export function appHead(shown, files, metrics) {
   return thead;
 }
 
-/* A commit row: the caption and the numbers. The deltas come from the shared calculation (`rowModel`) rather than from
- * here — two ways to count one row would be two answers. The mark of approximation is each cell's own: for a total it
- * covers every file that went into it, for a file that file alone. */
-export function appRow(r, metrics, files) {
+/* A text's breadth in `ch`, the unit a column is measured in: a digit is exactly one `ch` in this table's font
+ * (measured in Chrome: 8.67px against 8.67px), and a thin space is counted as a third of a digit — nothing else is
+ * discounted. Without that one fraction every number column would come out a fifth wider than the number in it (the
+ * grouping makes a text 21 % narrower than its characters, measured), which would give back more than the padding and
+ * the clipping of this step save. What is left over-measures — a letter is 0.84 of a `ch`, a slash 0.48 — and that is
+ * the safe side: a cell clips nothing, so a column a character short would show a number running over its neighbour. */
+function appBreadth(text) {
+  let wide = 0;
+  for (let i = 0; i < text.length; i++) wide += text[i] === '\u2009' ? 0.35 : 1;
+  return wide;
+}
+
+/* The widest text of every column, counted before a single node is made: the numbers of the commit rows — through
+ * `rowModel`, the very model the cells are drawn from, so a column cannot be sized for a number other than the one
+ * that will stand in it — the absolute sizes of the "now" row and the metric's own caption. */
+function appWidest(files, keys) {
+  const wide = files.map(() => keys.map(() => 0));
+  const total = keys.map(() => 0);
+  const put = (into, mi, breadth) => { if (breadth > into[mi]) into[mi] = breadth; };
+  const delta = (cell) => appBreadth(cellParts(cell.value, cell.delta, '−').text);
+  const value = (v) => appBreadth(valueParts(v).text);
+  appData.rows.forEach((row, r) => {
+    const model = rowModel(row.values, r === 0 ? null : appData.rows[r - 1].values, keys);
+    model.total.forEach((cell, mi) => put(total, mi, delta(cell)));
+    files.forEach((i) => model.files[i].forEach((cell, mi) => put(wide[i], mi, delta(cell))));
+  });
+  const now = nowModel(appData.now, keys);
+  now.total.forEach((v, mi) => put(total, mi, value(v)));
+  files.forEach((i) => now.files[i].forEach((v, mi) => put(wide[i], mi, value(v))));
+  keys.forEach((_key, mi) => {
+    const caption = appBreadth(appData.metrics[mi].label);
+    put(total, mi, caption);
+    wide.forEach((per) => put(per, mi, caption));
+  });
+  return { total: total, files: wide };
+}
+
+/* A group's heading — a file's name, the word over the total — is one line over the columns of that group
+ * (`white-space: nowrap` in the shared styling), so the group as a whole has to be wide enough for it, or the names of
+ * two neighbouring groups would run into one another. The caption is divided among the metrics of the group rather than
+ * weighed against their sum: every column carries at least its share, so the group can never come out narrower than the
+ * caption, while a column that is wider anyway keeps its own count. */
+function appGroupWide(per, label) {
+  const share = Math.ceil(appBreadth(label) / per.length);
+  return per.map((n) => Math.max(n, share));
+}
+
+/* The columns, before the rows: `table-layout: fixed` reads the first row of the table and takes the widths from there,
+ * so they are known while the table is built rather than measured by the browser over every cell of it. A column
+ * carries the metric's class (`m0`, `m1`, …) — which is what hides a whole metric at once — and its counted width in
+ * `ch`; the styling adds the padding and the border to it (`#grid col`), because a count and a drawing are one sum
+ * rather than two. The columns of a file are collected where its cells are, so one switch writes one class over both. */
+function appCols(files, wide, cache) {
+  const group = appEl('colgroup');
+  const add = (n, mi) => {
+    const col = appEl('col', 'm' + mi);
+    col.style.setProperty('--ch', n + 'ch');
+    group.appendChild(col);
+    return col;
+  };
+  group.appendChild(appEl('col', 'c-commit'));
+  appGroupWide(wide.total, appUi.total).forEach(add);
+  files.forEach((i) => appGroupWide(wide.files[i], appData.files[i].label)
+    .forEach((n, mi) => { cache.cols[i].push(add(n, mi)); }));
+  return group;
+}
+
+/* A file's share of a row: one cell per metric, in the order of the table's columns, and each is put into its
+ * column's cache while it is made. The maker is what tells a commit's delta from an absolute size at HEAD — the walk
+ * over the files is one, and there is no second one to drift away. */
+function appRowCells(tr, model, files, cache, make) {
+  files.forEach((i) => {
+    model.files[i].forEach((value, mi) => {
+      const td = make(value, mi);
+      cache.cols[i].push(td);
+      tr.appendChild(td);
+    });
+  });
+}
+
+/* A commit row: the caption and the numbers. The deltas come from the shared calculation (`rowModel`) rather than
+ * from here — two ways to count one row would be two answers. The model is taken whole (every file) because the
+ * table holds every column, and the column order of the table is applied by taking the model by the file's own
+ * index: the model lists the files the way the data does, not the way the columns stand. */
+export function appRow(r, files, metrics, cache) {
   const row = appData.rows[r];
   const prev = r === 0 ? null : appData.rows[r - 1];
-  const model = rowModel(row.values, prev === null ? null : prev.values, metrics, appView.files);
+  const model = rowModel(row.values, prev === null ? null : prev.values, metrics);
   const tr = appEl('tr');
   tr.appendChild(appCommit(row));
   model.total.forEach((cell, mi) => {
-    tr.appendChild(appCell(cell, mi === 0, appApprox(r, files, metrics[mi])));
+    const td = appCell(cell, mi);
+    cache.sums[mi][r] = cell.value;
+    cache.cells[mi][r] = td;
+    tr.appendChild(td);
   });
-  model.files.forEach((cells, fi) => cells.forEach((cell, mi) => {
-    tr.appendChild(appCell(cell, mi === 0, appApprox(r, [files[fi]], metrics[mi])));
-  }));
+  appRowCells(tr, model, files, cache, appCell);
   return tr;
 }
 
-/* The body: the commit rows built from the newest down, plus the "now" row with the absolute sizes at HEAD. The deltas
+/* The top row holds the absolute sizes at HEAD: an absolute number stands in the table once, and it is the one every
+ * delta below it adds up to. Its numbers are the state at HEAD rather than the last commit's cells, which is why the
+ * running sums take them from here instead of assuming they are the row above. */
+export function appNow(files, metrics, cache) {
+  const tr = appEl('tr', 'now');
+  tr.appendChild(appEl('th', 'c-commit', appUi.now));
+  const model = nowModel(appData.now, metrics);
+  const last = appData.rows.length;
+  model.total.forEach((v, mi) => {
+    const td = appValueCell(v, mi);
+    cache.sums[mi][last] = v;
+    cache.cells[mi][last] = td;
+    tr.appendChild(td);
+  });
+  appRowCells(tr, model, files, cache, appValueCell);
+  return tr;
+}
+
+/* The body: the commit rows from the newest down, plus the "now" row with the absolute sizes at HEAD. The deltas
  * under it add up to it, which is why it stands first. */
-export function appBody(metrics, files) {
+export function appBody(files, metrics, cache) {
   const body = appEl('tbody');
-  for (let r = appData.rows.length - 1; r >= 0; r--) body.appendChild(appRow(r, metrics, files));
-
-  const now = appEl('tr', 'now');
-  now.appendChild(appEl('th', 'c-commit', appUi.now));
-  const nowCells = nowModel(appData.now, metrics, appView.files);
-  nowCells.total.forEach((v, mi) => now.appendChild(appValueCell(v, mi === 0,
-    appApprox('now', files, metrics[mi]))));
-  nowCells.files.forEach((cells, fi) => cells.forEach((v, mi) => {
-    now.appendChild(appValueCell(v, mi === 0, appApprox('now', [files[fi]], metrics[mi])));
-  }));
-  body.insertBefore(now, body.firstChild);
+  for (let r = appData.rows.length - 1; r >= 0; r--) body.appendChild(appRow(r, files, metrics, cache));
+  body.insertBefore(appNow(files, metrics, cache), body.firstChild);
   return body;
 }
+
+/* The whole table, built once. What the cache holds is what the reader's choice works with: the nodes of each file's
+ * column — its cells, its headings and its `<col>` (`cols`), the group headings whose colSpan follows the enabled
+ * metrics (`spans`), the cells of the totals (`cells`), the running sums (`sums`) and those same sums with every
+ * column on (`all`) — the sums a view painted again starts from. */
+export function appTable(grid) {
+  const metrics = appData.metrics.map((m) => m.key);
+  const files = appOrder();
+  const cache = { grid: grid, keys: metrics, cols: [], spans: [], cells: [], sums: [], all: [] };
+  metrics.forEach(() => {
+    cache.cells.push([]);
+    cache.sums.push([]);
+  });
+  grid.textContent = '';
+  grid.appendChild(appHead(files, metrics, cache));
+  grid.appendChild(appBody(files, metrics, cache));
+  /* The columns stand before the rows rather than beside them: a `<colgroup>` is where the fixed layout reads its
+   * widths from, and it has to be in the markup before the browser settles on a layout — the drawing is one pass, not
+   * two. */
+  grid.insertBefore(appCols(files, appWidest(files, metrics), cache), grid.firstChild);
+  cache.all = cache.sums.map((row) => row.slice());
+  return cache;
+}
+
+/* A file's column shown or hidden: its cells and its headings together, one class per node and no new node. A hidden
+ * column keeps its place in the markup — the order of the columns is the files' business, not the choice's. */
+export function appColumn(cache, i, on) {
+  cache.cols[i].forEach((node) => node.classList.toggle('off', !on));
+}
+
+/* A file's share of the totals: switched off it takes exactly its own numbers out of the running sums, switched on
+ * it puts them back. Two rows per file are the whole of it — the numbers are the data's, and a sum of integers is
+ * exact in either direction. */
+export function appContribute(cache, i, on) {
+  const sign = on ? 1 : -1;
+  appData.rows.forEach((row, r) => {
+    const values = row.values[i];
+    if (values === null) return;
+    cache.keys.forEach((key, mi) => { cache.sums[mi][r] += sign * values[key]; });
+  });
+  const values = appData.now[i];
+  if (values === null) return;
+  const last = appData.rows.length;
+  cache.keys.forEach((key, mi) => { cache.sums[mi][last] += sign * values[key]; });
+}
+
+/* The totals written where they stand: a data row shows the change against the row below it, the "now" row the
+ * absolute size — the same rules the first drawing used (`cellParts`, `valueParts`), so the reader sees one kind of
+ * number and not two. */
+export function appTotals(cache) {
+  const last = appData.rows.length;
+  cache.cells.forEach((cells, mi) => {
+    cells.forEach((td, r) => {
+      if (r === last) { appFill(td, valueParts(cache.sums[mi][r])); return; }
+      appFill(td, cellParts(cache.sums[mi][r], deltaOf(cache.sums[mi][r], r === 0 ? null : cache.sums[mi][r - 1]), '−'));
+    });
+  });
+}
+
+/* The running sums of the whole view again: a link, a record from the memory and the first drawing change the choice
+ * as a whole rather than a column, so the sums start from the sums with every column on and take the switched-off
+ * ones out — one copy of the numbers instead of a recount. */
+export function appTotalsReset(cache) {
+  cache.sums = cache.all.map((row) => row.slice());
+  appData.files.forEach((_f, i) => { if (!appView.files[i]) appContribute(cache, i, false); });
+  appTotals(cache);
+}
+
+/* The metrics of the choice: a class on the table hides every cell of a metric at once, and the group headings follow
+ * how many are left — two things that change, instead of a pass over the metric's cells (measured: 2.20 ms and 265
+ * operations against 433 ms and 56 496 for walking them). `.m-none` is what the styling reads to drop the group's
+ * left border when there is nothing left to separate. */
+export function appMetrics(cache) {
+  let on = 0;
+  cache.keys.forEach((key, mi) => {
+    const visible = appView.metrics[key] === true;
+    if (visible) on++;
+    cache.grid.classList.toggle('m-off-' + mi, !visible);
+  });
+  cache.grid.classList.toggle('m-none', on === 0);
+  cache.spans.forEach((th) => { th.colSpan = on === 0 ? 1 : on; });
+}

package/src/parse.js

@@ -126,7 +126,7 @@ function onNodeCheck(text) {
   } catch (e) {
     const lines = String((e && e.stderr) || (e && e.message) || e).split('\n')
       .map((l) => l.trim()).filter((l) => l !== '');
-    // The fallback reason travels into a printed refusal, so it is Russian like the rest of the output.
+    // The fallback reason travels into a printed refusal, so it is worded like the rest of the output.
     return lines.find((l) => /^\w*Error\b/.test(l)) || lines[0] || 'the module does not parse';
   } finally {
     fs.rmSync(tmp, { force: true });

package/src/project.js

@@ -220,8 +220,8 @@ export function projectConfig(root) {
     output: output,
     fixCommand: fixCommandOf(root),
     metrics: ['raw', 'min', 'tok'],
-    // Real compression and a real dictionary rather than approximations: a new project must not start
-    // with numbers that are honest only by half. Without the optional dependency the metric falls back
+    // Real compression and a real dictionary rather than their cheaper substitutes: a new project must
+    // not start with numbers counted another way. Without the optional dependency the metric falls back
     // to another count and the run returns code 4 — said by the metric label rather than left to a
     // default.
     minify: { engine: 'esbuild' },

package/src/strip/guard.js

@@ -41,9 +41,10 @@ export function assertCompilable(min, rev, p, src) {
       + '  fix: remove this extension from minify.guard or give it '
       + 'minify.ext — for example { "' + path.extname(p).toLowerCase() + '": "strip-lines" }');
   }
-  // The reason comes from the parse the file actually was: blaming the other shape would
-  // explain nothing.
-  throw new Error('the stripper broke ' + p + ' at ' + rev.slice(0, 7) + ': '
+  /* The reason comes from the parse the file actually was: blaming the other shape would explain nothing.
+   * A revision is optional: the assembler of the report's page squeezes a text it built itself, and there is no
+   * revision to name it by — then the message says only what broke. */
+  throw new Error('the stripper broke ' + p + (rev === '' ? '' : ' at ' + rev.slice(0, 7)) + ': '
     + (shape ? asModule : asScript));
 }
 

package/src/strip.js

@@ -4,8 +4,7 @@ import { compactJson, stripCss, stripHtml, stripLines } from './strip/forms.js';
 
 /* Stripping ballast: which form of text applies to which file. Only text transformation —
  * the module knows no history and reads no settings, only the strategy it is handed. What
- * binds the forms to a file lives here: the extension, the strategy, and which strategies
- * count as exact.
+ * binds the forms to a file lives here: the extension and the strategy.
  *
  * The forms are re-exported from here, so that the package entry point has one address for
  * them and a move inside the parsing stays invisible to whoever relied on them. */
@@ -31,9 +30,9 @@ export const STRATEGIES = ['strip-js', 'strip-html', 'strip-css', 'json', 'strip
 
 /* The strategies that are minification itself: JSON loses only insignificant whitespace
  * (numbers take their shortest form) and nobody can make it shorter. The rest are a
- * simplification — they drop ballast but neither rename nor restructure code, so no exact
- * number can be promised for them. The list is owned here, next to the strategies, and the
- * metric reads it to decide whether its number is exact or approximate. */
+ * simplification — they drop ballast but neither rename nor restructure code. The list is owned
+ * here, next to the strategies, and the metric reads it to decide which formats it counts
+ * another way. */
 export const EXACT_STRATEGIES = ['json'];
 
 export function strategyFor(file, cfg) {