@browserless/cli 13.6.13 → 13.7.1

package/README.md

@@ -47,7 +47,7 @@ The `@browserless/cli` package allows you to:
 | `html <url>` | Serialize the page content to HTML |
 | `text <url>` | Extract plain text content from the page |
 | `lighthouse <url>` | Run a Google Lighthouse audit and output JSON report |
-| `page-weight <url>` | Analyze network requests and resource sizes |
+| `page-weight <url>` | Analyze network requests, resource sizes, and basic load timings |
 | `ping <url>` | Get response info: status code, redirects, headers |
 | `status <url>` | Get the HTTP status code |
 | `goto <url>` | Navigate to a URL and return page/response info |

package/package.json

@@ -2,7 +2,7 @@
   "name": "@browserless/cli",
   "description": "Command-line interface for headless browser automation. Take screenshots, generate PDFs, and extract content from websites.",
   "homepage": "https://browserless.js.org",
-  "version": "13.6.13",
+  "version": "13.7.1",
   "bin": {
     "browserless": "src/index.js"
   },
@@ -34,9 +34,9 @@
     "web-scraping"
   ],
   "dependencies": {
-    "@browserless/capture": "13.6.13",
+    "@browserless/capture": "13.7.1",
     "beauty-error": "~1.2.22",
-    "browserless": "13.6.12",
+    "browserless": "13.7.1",
     "dark-mode": "~3.0.0",
     "dset": "~3.1.4",
     "mri": "~1.2.0",
@@ -59,5 +59,5 @@
     "test": "exit 0"
   },
   "license": "MIT",
-  "gitHead": "1120e2c58e9878f3197b603e5fa6ef5005a1bfe6"
+  "gitHead": "366c1854294079765b40ebc755981142ab78f1ac"
 }

package/src/commands/page-weight.js

@@ -2,17 +2,30 @@
 
 const prettyBytes = require('pretty-bytes')
 
+// Navigation Timing uses 0 for milestones that haven't been recorded.
+const timing = (ms, label) => (ms > 0 ? `${Math.round(ms)} ms ${label}` : null)
+
 module.exports = async ({ url, browserless, opts }) => {
-  const pageResources = browserless.evaluate(async page =>
-    page.evaluate(() =>
-      window.performance.getEntriesByType('resource').map(resource => ({
-        transferredSize: resource.transferSize,
-        decodedBodySize: resource.decodedBodySize
-      }))
-    )
+  const getPageWeight = browserless.evaluate(async page =>
+    page.evaluate(() => {
+      const nav = performance.getEntriesByType('navigation')[0]
+      const paint = performance.getEntriesByType('paint')
+      const fcp = paint.find(e => e.name === 'first-contentful-paint')
+
+      return {
+        resources: performance.getEntriesByType('resource').map(resource => ({
+          transferredSize: resource.transferSize,
+          decodedBodySize: resource.decodedBodySize
+        })),
+        ttfb: nav?.responseStart,
+        fcp: fcp?.startTime,
+        domContentLoaded: nav?.domContentLoadedEventEnd,
+        loadEventEnd: nav?.loadEventEnd
+      }
+    })
   )
 
-  const resources = await pageResources(url, opts)
+  const { resources, ttfb, fcp, domContentLoaded, loadEventEnd } = await getPageWeight(url, opts)
 
   const [transferSize, resourcesSize] = resources
     .reduce(
@@ -25,10 +38,15 @@ module.exports = async ({ url, browserless, opts }) => {
     )
     .map(prettyBytes)
 
-  const resume = `
-  ⬩ ${resources.length} network requests
-  ⬩ ${transferSize} transferred bytes
-  ⬩ ${resourcesSize} resources bytes`
+  const lines = [
+    `${resources.length} network requests`,
+    `${transferSize} transferred bytes`,
+    `${resourcesSize} resources bytes`,
+    timing(ttfb, 'TTFB'),
+    timing(fcp, 'FCP'),
+    timing(domContentLoaded, 'DOMContentLoaded'),
+    timing(loadEventEnd, 'load')
+  ].filter(Boolean)
 
-  return [resume]
+  return ['\n' + lines.map(line => `  ⬩ ${line}`).join('\n')]
 }