@jsenv/core 27.0.0-alpha.58 → 27.0.0-alpha.60

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "27.0.0-alpha.58",
+  "version": "27.0.0-alpha.60",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "repository": {
@@ -33,18 +33,18 @@
   ],
   "scripts": {
     "eslint": "npx eslint . --ext=.js,.mjs,.cjs,.html",
-    "dev": "node ./script/dev/dev.mjs",
-    "build": "node ./script/build/build.mjs",
-    "test": "node ./script/test/test.mjs",
+    "dev": "node ./scripts/dev/dev.mjs",
+    "build": "node ./scripts/build/build.mjs",
+    "test": "node ./scripts/test/test.mjs",
     "test-packages": "npm run test --workspaces --if-present",
-    "start_file_server": "node ./script/dev/start_file_server.mjs",
-    "workspace-versions": "node ./script/publish/workspace_versions.mjs",
-    "workspace-publish": "node ./script/publish/workspace_publish.mjs",
-    "performances": "node --expose-gc ./script/performance/generate_performance_report.mjs --log --once",
-    "file-size": "node ./script/file_size/file_size.mjs --log",
+    "start_file_server": "node ./scripts/dev/start_file_server.mjs",
+    "workspace-versions": "node ./scripts/publish/workspace_versions.mjs",
+    "workspace-publish": "node ./scripts/publish/workspace_publish.mjs",
+    "performances": "node --expose-gc ./scripts/performance/generate_performance_report.mjs --log --once",
+    "file-size": "node ./scripts/file_size/file_size.mjs --log",
     "prettier": "prettier --write .",
     "playwright-install": "npx playwright install-deps && npx playwright install",
-    "certificate-install": "node ./script/dev/install_certificate_authority.mjs",
+    "certificate-install": "node ./scripts/dev/install_certificate_authority.mjs",
     "test-with-coverage": "npm run test -- --coverage",
     "prepublishOnly": "npm run build"
   },
@@ -68,7 +68,7 @@
     "@jsenv/node-esm-resolution": "0.0.6",
     "@jsenv/server": "12.6.2",
     "@jsenv/uneval": "1.6.0",
-    "@jsenv/utils": "1.7.4",
+    "@jsenv/utils": "1.7.5",
     "construct-style-sheets-polyfill": "3.1.0",
     "cssnano": "5.1.7",
     "cssnano-preset-default": "5.2.7",

package/readme.md

@@ -263,8 +263,8 @@ The presence of a jsenv configuration file is **optional**.
 /*
  * This file exports configuration reused by other files such as
  *
- * script/test/test.mjs
- * script/build/build.mjs
+ * scripts/test/test.mjs
+ * scripts/build/build.mjs
  *
  * Read more at https://github.com/jsenv/jsenv-core#configuration
  */

package/src/build/build.js

@@ -796,6 +796,12 @@ ${Object.keys(finalGraph.urlInfos).join("\n")}`,
     return runBuild({ signal: operation.signal, logLevel })
   }
 
+  let resolveFirstBuild
+  let rejectFirstBuild
+  const firstBuildPromise = new Promise((resolve, reject) => {
+    resolveFirstBuild = resolve
+    rejectFirstBuild = reject
+  })
   const watchLogger = createLogger({ logLevel: "info" })
   let buildAbortController
   let watchFilesTask
@@ -803,8 +809,12 @@ ${Object.keys(finalGraph.urlInfos).join("\n")}`,
     const buildTask = createTaskLog(watchLogger, "build")
     buildAbortController = new AbortController()
     try {
-      await runBuild({ signal: buildAbortController.signal, logLevel: "warn" })
+      const result = await runBuild({
+        signal: buildAbortController.signal,
+        logLevel: "warn",
+      })
       buildTask.done()
+      resolveFirstBuild(result)
       watchFilesTask = createTaskLog(watchLogger, "watch files")
     } catch (e) {
       if (Abort.isAbortError(e)) {
@@ -815,6 +825,7 @@ ${Object.keys(finalGraph.urlInfos).join("\n")}`,
         watchFilesTask = createTaskLog(watchLogger, "watch files")
       } else {
         buildTask.fail()
+        rejectFirstBuild(e)
         throw e
       }
     }
@@ -853,6 +864,7 @@ ${Object.keys(finalGraph.urlInfos).join("\n")}`,
   operation.addAbortCallback(() => {
     stopWatchingClientFiles()
   })
+  await firstBuildPromise
   return stopWatchingClientFiles
 }
 

package/src/omega/url_graph/url_graph_report.js

@@ -1,36 +1,35 @@
 import { ANSI } from "@jsenv/log"
 
 import { byteAsFileSize } from "@jsenv/utils/logs/size_log.js"
+import { distributeNumbers } from "@jsenv/utils/logs/number_distribution.js"
 
 export const createUrlGraphSummary = (
   urlGraph,
   { title = "graph summary" } = {},
 ) => {
   const graphReport = createUrlGraphReport(urlGraph)
-  const totalLabel = `Total`
   return `--- ${title} ---  
 ${createRepartitionMessage(graphReport)}
-${ANSI.color(totalLabel, ANSI.GREY)} ${
-    graphReport.total.count
-  } (${byteAsFileSize(graphReport.total.size)})
 --------------------`
 }
 
 const createUrlGraphReport = (urlGraph) => {
   const { urlInfos } = urlGraph
   const countGroups = {
+    sourcemaps: 0,
     html: 0,
     css: 0,
     js: 0,
+    json: 0,
     other: 0,
-    sourcemaps: 0,
     total: 0,
   }
   const sizeGroups = {
+    sourcemaps: 0,
     html: 0,
     css: 0,
     js: 0,
-    sourcemaps: 0,
+    json: 0,
     other: 0,
     total: 0,
   }
@@ -81,17 +80,67 @@ const createUrlGraphReport = (urlGraph) => {
       sizeGroups.js += urlContentSize
       return
     }
+    if (category === "json") {
+      countGroups.json++
+      sizeGroups.json += urlContentSize
+      return
+    }
     countGroups.other++
     sizeGroups.other += urlContentSize
     return
   })
+
+  const sizesToDistribute = {}
+  Object.keys(sizeGroups).forEach((groupName) => {
+    if (groupName !== "sourcemaps" && groupName !== "total") {
+      sizesToDistribute[groupName] = sizeGroups[groupName]
+    }
+  })
+  const ratios = distributeNumbers(sizesToDistribute)
+  const percentageGroups = {}
+  Object.keys(ratios).forEach((groupName) => {
+    percentageGroups[groupName] = parseFloat(ratios[groupName]) * 100
+  })
+
   return {
-    html: { count: countGroups.html, size: sizeGroups.html },
-    css: { count: countGroups.css, size: sizeGroups.css },
-    js: { count: countGroups.js, size: sizeGroups.js },
-    sourcemaps: { count: countGroups.sourcemaps, size: sizeGroups.sourcemaps },
-    other: { count: countGroups.other, size: sizeGroups.other },
-    total: { count: countGroups.total, size: sizeGroups.total },
+    // sourcemaps are special, there size are ignored
+    // so there is no "percentage" associated
+    sourcemaps: {
+      count: countGroups.sourcemaps,
+      size: sizeGroups.sourcemaps,
+      percentage: undefined,
+    },
+
+    html: {
+      count: countGroups.html,
+      size: sizeGroups.html,
+      percentage: percentageGroups.html,
+    },
+    css: {
+      count: countGroups.css,
+      size: sizeGroups.css,
+      percentage: percentageGroups.css,
+    },
+    js: {
+      count: countGroups.js,
+      size: sizeGroups.js,
+      percentage: percentageGroups.js,
+    },
+    json: {
+      count: countGroups.json,
+      size: sizeGroups.json,
+      percentage: percentageGroups.json,
+    },
+    other: {
+      count: countGroups.other,
+      size: sizeGroups.other,
+      percentage: percentageGroups.other,
+    },
+    total: {
+      count: countGroups.total,
+      size: sizeGroups.total,
+      percentage: 100,
+    },
   }
 }
 
@@ -108,32 +157,22 @@ const determineCategory = (urlInfo) => {
   if (urlInfo.type === "js_module" || urlInfo.type === "js_classic") {
     return "js"
   }
+  if (urlInfo.type === "json") {
+    return "json"
+  }
   return "other"
 }
 
-const createRepartitionMessage = ({ html, css, js, other }) => {
-  const parts = []
-  if (html.count) {
-    parts.push(
-      `${ANSI.color(`html:`, ANSI.GREY)} ${html.count} (${byteAsFileSize(
-        html.size,
-      )})`,
-    )
-  }
-  if (css.count) {
+const createRepartitionMessage = ({ html, css, js, json, other, total }) => {
+  const addPart = (name, { count, size, percentage }) => {
     parts.push(
-      `${ANSI.color(`css:`, ANSI.GREY)} ${css.count} (${byteAsFileSize(
-        css.size,
-      )})`,
-    )
-  }
-  if (js.count) {
-    parts.push(
-      `${ANSI.color(`js:`, ANSI.GREY)} ${js.count} (${byteAsFileSize(
-        js.size,
-      )})`,
+      `${ANSI.color(`${name}:`, ANSI.GREY)} ${count} (${byteAsFileSize(
+        size,
+      )} / ${percentage} %)`,
     )
   }
+
+  const parts = []
   // if (sourcemaps.count) {
   //   parts.push(
   //     `${ANSI.color(`sourcemaps:`, ANSI.GREY)} ${
@@ -141,13 +180,22 @@ const createRepartitionMessage = ({ html, css, js, other }) => {
   //     } (${byteAsFileSize(sourcemaps.size)})`,
   //   )
   // }
+  if (html.count) {
+    addPart("html ", html)
+  }
+  if (css.count) {
+    addPart("css  ", css)
+  }
+  if (js.count) {
+    addPart("js   ", js)
+  }
+  if (json.count) {
+    addPart("json ", json)
+  }
   if (other.count) {
-    parts.push(
-      `${ANSI.color(`other:`, ANSI.GREY)} ${other.count} (${byteAsFileSize(
-        other.size,
-      )})`,
-    )
+    addPart("other", other)
   }
+  addPart("total", total)
   return `- ${parts.join(`
 - `)}`
 }