chore(docs): add profile time upfront estimation

a11ywatch · Sep 30, 2023 · 9472162 · 9472162
1 parent 732e849
commit 9472162
Show file tree

Hide file tree

Showing 9 changed files with 348 additions and 9 deletions.
diff --git a/README.md b/README.md
@@ -21,6 +21,7 @@ const page = await browser.newPage();
 const results = await kayle({
   page,
   browser,
+  runners: ["htmlcs"] // options are  "htmlcs", "axe", and "ace"
   origin: "https://a11ywatch.com",
   // html: "<html>...</html>"
 });
@@ -54,6 +55,23 @@ const results = await autoKayle({
 });
 ```
 
+```sh
+# Output of time between runners with a realistic run - Rust/WASM is in the making and not yet ready.
+# Measurement is only calculated from the runner and not the extra latency to get the page initially. View the `innate` test to see more detals.
+
+# puppeteer - speed is stable across most versions
+# Rust/WASM 18.43487498164177
+# FAST_HTMLCS 29.915208011865616
+# FAST_AXE 162.87204200029373
+# ACE 512.5237080156803
+
+# playwright - the speed depends on the version
+# Rust/WASM TIME  17.60895800590515
+# FAST_HTMLCS TIME 33.50962498784065
+# FAST_AXE TIME 203.2565419971943
+# ACE TIME 905.6748749911785
+```
+
 ## Clips
 
 You can include base64 images with the audits to get a visual of the exact location of the issue.

diff --git a/kayle/package.json b/kayle/package.json
@@ -1,6 +1,6 @@
 {
   "name": "kayle",
-  "version": "0.7.10",
+  "version": "0.7.11",
   "description": "Extremely fast and accurate accessibility engine built for any headless tool like playwright or puppeteer.",
   "main": "./build/index.js",
   "keywords": [
@@ -47,6 +47,7 @@
     "test:playwright:axe": "npm run compile:test && npx playwright test ./tests/basic-axe-playwright.spec.ts",
     "test:playwright:htmlcs": "npm run compile:test && npx playwright test ./tests/basic-htmlcs-playwright.spec",
     "test:playwright:clips": "npm run compile:test && npx playwright test ./tests/clips-playwright.spec.ts",
+    "test:playwright:innate": "npm run compile:test &&  npx playwright test ./tests/innate-playwright.spec.ts",
     "test:puppeteer:wasm": "npm run compile:test && node _tests/tests/wasm.js",
     "test:puppeteer:automa": "npm run compile:test && node _tests/tests/automa.js",
     "test:puppeteer:extension": "npm run compile:test && yarn build:extension && node _tests/tests/extension.js",

diff --git a/kayle/tests/innate-playwright.spec.ts b/kayle/tests/innate-playwright.spec.ts
@@ -0,0 +1,66 @@
+import { innateBuilder, kayle } from "kayle";
+import { drakeMock } from "./mocks/html-mock";
+import { performance } from "perf_hooks";
+import { test } from "@playwright/test";
+import { _audit_not_ready } from "kayle_innate";
+
+test("kayle_innate, fast_htmlcs, fast_axecore, and ace audit drakeMock profiling compare", async ({
+  page,
+  browser,
+}, testInfo) => {
+  if (process.env.LOG_ENABLED) {
+    page.on("console", (msg) => console.log("PAGE LOG:", msg.text()));
+  }
+  const { html, css } = await innateBuilder({
+    page,
+    browser,
+    runners: ["htmlcs"],
+    includeWarnings: true,
+    origin: "https://www.drake.com",
+    html: drakeMock,
+  });
+  const startTime = performance.now();
+  // 8 - after building end engine optimized most likely will be at 12 ms
+  await _audit_not_ready(html, css);
+  const nextTime = performance.now() - startTime;
+  console.log("Rust/WASM TIME ", nextTime);
+
+  const st = performance.now();
+  await kayle({
+    page,
+    browser,
+    runners: ["htmlcs"],
+    includeWarnings: true,
+    origin: "https://www.drake.com",
+    html: drakeMock,
+    noIntercept: true,
+  });
+  const nt = performance.now() - st;
+  console.log("FAST_HTMLCS TIME", nt);
+
+  const s = performance.now();
+  await kayle({
+    page,
+    browser,
+    runners: ["axe"],
+    includeWarnings: true,
+    origin: "https://www.drake.com",
+    html: drakeMock,
+    noIntercept: true,
+  });
+  const n = performance.now() - s;
+  console.log("FAST_AXE TIME", n);
+
+  const a = performance.now();
+  await kayle({
+    page,
+    browser,
+    runners: ["ace"],
+    includeWarnings: true,
+    origin: "https://www.drake.com",
+    html: drakeMock,
+    noIntercept: true,
+  });
+  const an = performance.now() - a;
+  console.log("ACE TIME", an);
+});
diff --git a/kayle/tests/innate.ts b/kayle/tests/innate.ts
@@ -2,7 +2,7 @@ import puppeteer from "puppeteer";
 import { innateBuilder, kayle } from "kayle";
 import { drakeMock } from "./mocks/html-mock";
 import { performance } from "perf_hooks";
-import { audit } from "kayle_innate";
+import { _audit_not_ready } from "kayle_innate";
 
 // setup test for rust wasm auditing
 (async () => {
@@ -21,12 +21,11 @@ import { audit } from "kayle_innate";
   });
   const startTime = performance.now();
   // 8 - after building end engine optimized most likely will be at 12 ms
-  await audit(html, css);
+  await _audit_not_ready(html, css);
   const nextTime = performance.now() - startTime;
   console.log("Rust/WASM TIME ", nextTime);
 
   const st = performance.now();
-  // 28 ms
   await kayle({
     page,
     browser,
@@ -37,7 +36,33 @@ import { audit } from "kayle_innate";
     noIntercept: true,
   });
   const nt = performance.now() - st;
-  console.log("JS TIME", nt);
+  console.log("FAST_HTMLCS TIME", nt);
+
+  const s = performance.now();
+  await kayle({
+    page,
+    browser,
+    runners: ["axe"],
+    includeWarnings: true,
+    origin: "https://www.drake.com",
+    html: drakeMock,
+    noIntercept: true,
+  });
+  const n = performance.now() - s;
+  console.log("FAST_AXE TIME", n);
+
+  const a = performance.now();
+  await kayle({
+    page,
+    browser,
+    runners: ["ace"],
+    includeWarnings: true,
+    origin: "https://www.drake.com",
+    html: drakeMock,
+    noIntercept: true,
+  });
+  const an = performance.now() - a;
+  console.log("ACE TIME", an);
 
   await browser.close();
 })();
diff --git a/kayle/tests/mocks/large-mock.ts b/kayle/tests/mocks/large-mock.ts
diff --git a/kayle_innate/Cargo.lock b/kayle_innate/Cargo.lock
diff --git a/kayle_innate/Cargo.toml b/kayle_innate/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "kayle_innate"
-version = "0.0.19"
+version = "0.0.20"
 authors = ["j-mendez"]
 edition = "2018"
 license = "MIT"

diff --git a/kayle_innate/README.md b/kayle_innate/README.md
@@ -31,4 +31,4 @@ In order to test the accessibility parser in Rust run.
 
 1. Port expensive functions to wasm with preloading capabilities injection into browsers.
 1. Reborn the accessibility testing in rust.
-1. Write a web accessibility engine in Rust/Wasm.
+1. Write a web accessibility engine in Rust/Wasm.
diff --git a/kayle_innate/src/lib.rs b/kayle_innate/src/lib.rs
@@ -188,8 +188,10 @@ pub fn parse_accessibility_tree(
 
 #[wasm_bindgen]
 /// audit a web page passing the html and css rules.
-pub fn audit(html: &str, _css_rules: &str) {
+pub fn _audit_not_ready(html: &str, _css_rules: &str) {
     let _tree = parse_accessibility_tree(&html);
+    let _css_nodes = parse_css(_css_rules);
+    // reference the css model when in the tree to get style information
 }
 
 /// parse css tree to maps