diff --git a/.github/scripts/analyze-builds.js b/.github/scripts/analyze-builds.js index 7cc526291..eb6423a1a 100644 --- a/.github/scripts/analyze-builds.js +++ b/.github/scripts/analyze-builds.js @@ -102,7 +102,7 @@ const execLogErr = async (command) => { const outputPath = resolve(METRICS_PATH, `${jsapiVersion}.csv`); const stream = createWriteStream(outputPath); stream.write( - "Sample,Build size (MB),Build file count,Main bundle file,Main bundle size (MB),Main bundle gzipped size (MB),Main bundle brotli compressed size (MB),Load time (ms),Total runtime (ms),Loaded size (MB),Total JS requests,JS heap size (MB)\n" + "Sample,Build size (MB),Build file count,Main bundle file,Main bundle size (MB),Main bundle gzipped size (MB),Main bundle brotli compressed size (MB),Load time (ms),Total runtime (ms),Loaded size (MB),Total JS requests,Total HTTP requests,JS heap size (MB)\n" ); for (const [itemCount, sample] of sampleDirectories.entries()) { @@ -145,7 +145,7 @@ const execLogErr = async (command) => { const pageTotalMB = (perfResults.pageTotalBytes / 1024 ** 2).toFixed(2); const JSHeapUsedSizeMB = (perfResults.JSHeapUsedSizeBytes / 1024 ** 2).toFixed(2); - const output = `${sampleName} ${packageVersion},${buildSizeMB},${buildFileCount},${mainBundleName},${mainBundleSizeMB},${mainBundleSizeGzipMB},${mainBundleSizeBrotliMB},${perfResults.elapsedRuntimeMS},${perfResults.totalScriptTimeMS},${pageTotalMB},${perfResults.totalJSRequests},${JSHeapUsedSizeMB}\n`; + const output = `${sampleName} ${packageVersion},${buildSizeMB},${buildFileCount},${mainBundleName},${mainBundleSizeMB},${mainBundleSizeGzipMB},${mainBundleSizeBrotliMB},${perfResults.elapsedRuntimeMS},${perfResults.totalScriptTimeMS},${pageTotalMB},${perfResults.totalJSRequests},${perfResults.totalHTTPRequests},${JSHeapUsedSizeMB}\n`; console.log("Writing results to CSV:", output); stream.write(output); diff --git a/.github/scripts/build-perf.js b/.github/scripts/build-perf.js index cb475036b..b62e05c48 100644 --- a/.github/scripts/build-perf.js +++ b/.github/scripts/build-perf.js @@ -3,8 +3,10 @@ const puppeteer = require("puppeteer"); const WebServer = require("./WebServer"); let go, webserver; +let test = 0; let pageTotalBytes = 0; let totalJSRequests = 0; +let totalHTTPRequests = 0; let performanceMarkStart, performanceMarkEnd; const PORT = 3000; // Used for both WebServer and TEST_URL const TEST_URL = "http://localhost:" + PORT; @@ -14,6 +16,7 @@ const TEST_URL = "http://localhost:" + PORT; * @param {Object} response */ const addResponseSize = async (response) => { + totalHTTPRequests++; const url = response.url(); const str = url.substring(url.length - 3, url.length); if (str === ".js") { @@ -103,6 +106,7 @@ const capturePageMetrics = async (page, sampleName) => { * Useful for comparing against the `elapsedRuntimeMS`. Should not be used as an indicator of * application performance, it's most useful for troubleshooting. * totalJSRequests - total number of JavaScript files requested by the app + * totalRequests = the total number of HTTP requests */ return { sampleName, @@ -110,7 +114,8 @@ const capturePageMetrics = async (page, sampleName) => { pageTotalBytes, JSHeapUsedSizeBytes, totalScriptTimeMS, - totalJSRequests + totalJSRequests, + totalHTTPRequests }; }; @@ -137,7 +142,7 @@ const browserPerformanceTest = async (path, sampleName = "") => { totalJSRequests = 0; startWebServer(path, PORT); - const browser = await puppeteer.launch({ headless: true }); + const browser = await puppeteer.launch({ headless: "new", args: ["--use-angle=default"] }); const page = await browser.newPage(); errorLogging(page); await pageSetup(page); @@ -171,7 +176,6 @@ const browserPerformanceTest = async (path, sampleName = "") => { // Close it because we may need to test multiple directories const shutdown = await webserver.stop(); console.log("Shutting down webserver:", shutdown); - return pageMetrics; } else { console.log("\x1b[41m\x1b[30mERROR page did not load:", path); @@ -181,4 +185,5 @@ const browserPerformanceTest = async (path, sampleName = "") => { } }; -module.exports = browserPerformanceTest; +// browserPerformanceTest("../../esm-samples/jsapi-angular-cli/dist/"); +module.exports = browserPerformanceTest; \ No newline at end of file diff --git a/.github/scripts/build-size.js b/.github/scripts/build-size.js index 1e19845ec..5178a2038 100644 --- a/.github/scripts/build-size.js +++ b/.github/scripts/build-size.js @@ -356,6 +356,8 @@ if (require.main === module) { performanceInfo.totalScriptTimeMS, `\n --> total JS requests:`, performanceInfo.totalJSRequests, + `\n --> total HTTP requests:`, + performanceInfo.totalHTTPRequests, `\n --> app load size:`, formatBytes(performanceInfo.pageTotalBytes, decimals, binary), `\n --> jsheap size:`, diff --git a/.github/scripts/package.json b/.github/scripts/package.json index a419de544..f406ccd81 100644 --- a/.github/scripts/package.json +++ b/.github/scripts/package.json @@ -1,9 +1,9 @@ { "name": "analysis", "description": "Run analysis against ESM samples", - "version": "0.1.0", + "version": "0.2.0", "dependencies": { - "puppeteer": "^20.3.0", + "puppeteer": "^21.3.8", "express": "^4.18.2" } }