From a05e1367ef1e1bc56bac47939b945b2d1e24409d Mon Sep 17 00:00:00 2001 From: Jason Dent Date: Sun, 29 Jun 2025 10:02:53 +0200 Subject: [PATCH 1/3] docs: Add some more explanation to the website. --- website/src/app.css | 13 ++++--------- website/src/lib/Playground.svelte | 4 +++- website/src/routes/+page.svelte | 15 ++++++++++++--- 3 files changed, 19 insertions(+), 13 deletions(-) diff --git a/website/src/app.css b/website/src/app.css index f551e23..d4ec7f1 100644 --- a/website/src/app.css +++ b/website/src/app.css @@ -6,12 +6,12 @@ --font-body: Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; --font-mono: 'Fira Mono', monospace; - --color-bg-0: rgb(202, 216, 228); - --color-bg-1: hsl(209, 36%, 86%); - --color-bg-2: hsl(224, 44%, 95%); + --color-bg-0: #fdfdfd; + --color-bg-1: #fdfdfd; + --color-bg-2: #fdfdfd; --color-theme-1: #00aa00; --color-theme-2: #4075a6; - --color-text: rgba(0, 0, 0, 0.7); + --color-text: rgba(0, 0, 0, 0.9); --column-width: 42rem; --column-margin-top: 4rem; font-family: var(--font-body); @@ -21,12 +21,7 @@ body { min-height: 100vh; margin: 0; - background-attachment: fixed; background-color: var(--color-bg-1); - background-size: 100vw 100vh; - background-image: - radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0) 100%), - linear-gradient(180deg, var(--color-bg-0) 0%, var(--color-bg-1) 15%, var(--color-bg-2) 50%); } h1, diff --git a/website/src/lib/Playground.svelte b/website/src/lib/Playground.svelte index 99a92f4..c145701 100644 --- a/website/src/lib/Playground.svelte +++ b/website/src/lib/Playground.svelte @@ -127,7 +127,7 @@ {#snippet snipFragments()}{#each fragments as frag (frag.id)}{#if frag.type === 'mark'}{frag.content}{:else}{frag.content}{/if}{/each}{/snippet} -{#snippet fixedWidth(value: number, fixed: number = 4, width: number = 9)} +{#snippet fixedWidth(value: number, fixed: number = 2, width: number = 9)} {value.toFixed(fixed).padStart(width, ' ')}{/snippet}
@@ -304,6 +304,7 @@ .header { grid-area: header; text-align: center; + border-radius: 5px 5px 0px 0px; } .header { @@ -316,6 +317,7 @@ box-sizing: border-box; padding: 10px; grid-area: footer; + border-radius: 0px 0px 5px 5px; /* min-height: 20px; */ } diff --git a/website/src/routes/+page.svelte b/website/src/routes/+page.svelte index 00fa7dd..0a20111 100644 --- a/website/src/routes/+page.svelte +++ b/website/src/routes/+page.svelte @@ -15,12 +15,17 @@ Execute Regular Expression Matches on a Node Worker Thread or in a Web Worker.

-

Regular Expressions can suffer from Catastrophic Backtracking . A very simple expression like /(x+x+)+y/ can cause your JavaScript application to freeze. This library allows you to run - these expressions on another thread. If they take to long to complete, they are terminated, protecting your application from locking - up. + these expressions in another thread, keeping your application responsive. If they take to long to complete, they are terminated, protecting + your application from locking up. +

+ The playground below allows you to test the worker with different regular expressions and content. It will show you the elapsed time for the the worker + to process the regular expression against the content. +

+

+ Note: The timings shown are rounded to the nearest 1/10 of a millisecond. This is due to the crossOriginIsolated property. See also: Performance: now() method - Web APIs | MDN.


@@ -40,6 +45,10 @@ text-align: left; } + p + p { + margin-top: 1em; + } + h1 { width: 100%; } From b32ef1a09d202ebea873930830cb539a7a3c8413 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Sun, 29 Jun 2025 08:04:01 +0000 Subject: [PATCH 2/3] [autofix.ci] apply automated fixes --- website/src/routes/+page.svelte | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/website/src/routes/+page.svelte b/website/src/routes/+page.svelte index 0a20111..565c927 100644 --- a/website/src/routes/+page.svelte +++ b/website/src/routes/+page.svelte @@ -20,12 +20,16 @@ A very simple expression like /(x+x+)+y/ can cause your JavaScript application to freeze. This library allows you to run these expressions in another thread, keeping your application responsive. If they take to long to complete, they are terminated, protecting your application from locking up. -

- The playground below allows you to test the worker with different regular expressions and content. It will show you the elapsed time for the the worker - to process the regular expression against the content.

- Note: The timings shown are rounded to the nearest 1/10 of a millisecond. This is due to the crossOriginIsolated property. See also: Performance: now() method - Web APIs | MDN. + The playground below allows you to test the worker with different regular expressions and content. It will show you the elapsed time + for the the worker to process the regular expression against the content. +

+

+ Note: The timings shown are rounded to the nearest 1/10 of a millisecond. This is due to the + crossOriginIsolated + property. See also: + Performance: now() method - Web APIs | MDN.


From 68a7d622737392560a2f8984e0529142d1b11a64 Mon Sep 17 00:00:00 2001 From: Jason Dent Date: Sun, 29 Jun 2025 10:12:42 +0200 Subject: [PATCH 3/3] Update README.md --- README.md | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 1ec2bdb..e24c845 100644 --- a/README.md +++ b/README.md @@ -89,7 +89,20 @@ let numbers = await worker.matchAll('Lots of text ...', /\b\w{3}\s+\w{3}/g, more // It is a good idea to dispose of the worker before shutdown. // The worker thread will stop on its own if left idle for more than 200ms. -worker.dispose(); +await worker.dispose(); +``` + +**Note:** The worker supports the proposed [`using`](https://github.com/tc39/proposal-explicit-resource-management) keyword. See also: [TypeScript: `using`](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-5-2.html). + +```ts +import { RegExpWorker } from 'regexp-worker'; + +async function run() { + await using worker = new RegExpWorker(); + // ... do some work. + let numbers = await worker.matchAll('Lots of text 123 ...', /\b\d+\b/g); + // The worker is auto cleaned up when when the function exits. +} ``` ## Handling Timeouts