dphelper 4.6.1 → 4.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +445 -225
- package/index.cjs +3 -3
- package/index.js +3 -3
- package/llms.txt +487 -45
- package/markdown/ai.md +345 -0
- package/markdown/anchor.md +156 -0
- package/markdown/array.md +208 -0
- package/markdown/audio.md +113 -0
- package/markdown/avoid.md +53 -0
- package/markdown/biometric.md +338 -0
- package/markdown/browser.md +203 -0
- package/markdown/check.md +65 -0
- package/markdown/color.md +159 -0
- package/markdown/compress.md +310 -0
- package/markdown/cookie.md +115 -0
- package/markdown/coords.md +127 -0
- package/markdown/credits.md +56 -0
- package/markdown/date.md +260 -0
- package/markdown/disable.md +109 -0
- package/markdown/dispatch.md +108 -0
- package/markdown/element.md +53 -0
- package/markdown/event.md +85 -0
- package/markdown/fetch.md +122 -0
- package/markdown/form.md +302 -0
- package/markdown/format.md +122 -0
- package/markdown/i18n.md +292 -0
- package/markdown/image.md +298 -0
- package/markdown/json.md +269 -0
- package/markdown/load.md +133 -0
- package/markdown/logging.md +99 -0
- package/markdown/math.md +172 -0
- package/markdown/memory.md +85 -0
- package/markdown/navigation.md +152 -0
- package/markdown/net.md +60 -0
- package/markdown/obj.md +242 -0
- package/markdown/path.md +46 -0
- package/markdown/promise.md +94 -0
- package/markdown/sanitize.md +129 -0
- package/markdown/screen.md +78 -0
- package/markdown/scrollbar.md +82 -0
- package/markdown/security.md +289 -0
- package/markdown/shortcut.md +100 -0
- package/markdown/socket.md +134 -0
- package/markdown/sse.md +120 -0
- package/markdown/svg.md +167 -0
- package/markdown/sync.md +171 -0
- package/markdown/system.md +78 -0
- package/markdown/terminal.md +73 -0
- package/markdown/text.md +245 -0
- package/markdown/timer.md +98 -0
- package/markdown/tools.md +111 -0
- package/markdown/translators.md +65 -0
- package/markdown/trigger.md +99 -0
- package/markdown/triggers.md +133 -0
- package/markdown/type.md +109 -0
- package/markdown/types.md +102 -0
- package/markdown/ui.md +45 -0
- package/markdown/window.md +211 -0
- package/markdown/worker.md +223 -0
- package/modules/ai.cjs +1 -1
- package/modules/ai.js +1 -1
- package/modules/anchor.cjs +1 -1
- package/modules/anchor.js +1 -1
- package/modules/array.cjs +1 -1
- package/modules/array.js +1 -1
- package/modules/audio.cjs +1 -1
- package/modules/audio.js +1 -1
- package/modules/avoid.cjs +1 -1
- package/modules/avoid.js +1 -1
- package/modules/biometric.cjs +1 -1
- package/modules/biometric.js +1 -1
- package/modules/browser.cjs +1 -1
- package/modules/browser.js +1 -1
- package/modules/check.cjs +1 -1
- package/modules/check.js +1 -1
- package/modules/color.cjs +1 -1
- package/modules/color.js +1 -1
- package/modules/compress.cjs +1 -1
- package/modules/compress.js +1 -1
- package/modules/cookie.cjs +1 -1
- package/modules/cookie.js +1 -1
- package/modules/coords.cjs +1 -1
- package/modules/coords.js +1 -1
- package/modules/credits.cjs +1 -1
- package/modules/credits.js +1 -1
- package/modules/date.cjs +1 -1
- package/modules/date.js +1 -1
- package/modules/disable.cjs +1 -1
- package/modules/disable.js +1 -1
- package/modules/dispatch.cjs +1 -1
- package/modules/dispatch.js +1 -1
- package/modules/elements.cjs +1 -1
- package/modules/elements.js +1 -1
- package/modules/events.cjs +1 -1
- package/modules/events.js +1 -1
- package/modules/fetch.cjs +1 -1
- package/modules/fetch.js +1 -1
- package/modules/form.cjs +1 -1
- package/modules/form.js +1 -1
- package/modules/format.cjs +1 -1
- package/modules/format.js +1 -1
- package/modules/i18n.cjs +1 -1
- package/modules/i18n.js +1 -1
- package/modules/image.cjs +1 -1
- package/modules/image.js +1 -1
- package/modules/json.cjs +1 -1
- package/modules/json.js +1 -1
- package/modules/load.cjs +1 -1
- package/modules/load.js +1 -1
- package/modules/logging.cjs +1 -1
- package/modules/logging.js +1 -1
- package/modules/math.cjs +1 -1
- package/modules/math.js +1 -1
- package/modules/memory.cjs +1 -1
- package/modules/memory.js +1 -1
- package/modules/navigation.cjs +1 -1
- package/modules/navigation.js +1 -1
- package/modules/net.cjs +1 -1
- package/modules/net.js +1 -1
- package/modules/objects.cjs +1 -1
- package/modules/objects.js +1 -1
- package/modules/path.cjs +1 -1
- package/modules/path.js +1 -1
- package/modules/promise.cjs +1 -1
- package/modules/promise.js +1 -1
- package/modules/sanitize.cjs +1 -1
- package/modules/sanitize.js +1 -1
- package/modules/screen.cjs +1 -1
- package/modules/screen.js +1 -1
- package/modules/scrollbar.cjs +1 -1
- package/modules/scrollbar.js +1 -1
- package/modules/security.cjs +1 -1
- package/modules/security.js +1 -1
- package/modules/shortcut.cjs +1 -1
- package/modules/shortcut.js +1 -1
- package/modules/socket.cjs +1 -1
- package/modules/socket.js +1 -1
- package/modules/sse.cjs +1 -1
- package/modules/sse.js +1 -1
- package/modules/svg.cjs +1 -1
- package/modules/svg.js +1 -1
- package/modules/sync.cjs +1 -1
- package/modules/sync.js +1 -1
- package/modules/system.cjs +1 -1
- package/modules/system.js +1 -1
- package/modules/text.cjs +1 -1
- package/modules/text.js +1 -1
- package/modules/timer.cjs +1 -1
- package/modules/timer.js +1 -1
- package/modules/tools.cjs +1 -1
- package/modules/tools.js +1 -1
- package/modules/translators.cjs +1 -1
- package/modules/translators.js +1 -1
- package/modules/triggers.cjs +1 -1
- package/modules/triggers.js +1 -1
- package/modules/types.cjs +1 -1
- package/modules/types.js +1 -1
- package/modules/ui.cjs +1 -1
- package/modules/ui.js +1 -1
- package/modules/window.cjs +1 -1
- package/modules/window.js +1 -1
- package/modules/worker.cjs +1 -1
- package/modules/worker.js +1 -1
- package/package.json +4 -2
- package/sbom.json +8 -8
package/README.md
CHANGED
|
@@ -4,20 +4,25 @@
|
|
|
4
4
|
|
|
5
5
|
> **The supercharged toolkit for modern web development, AI engineering & DevTools.**
|
|
6
6
|
|
|
7
|
+
**The stateless, zero-dependency capability toolkit for Web, Node.js, Bun, Deno and AI systems.**
|
|
8
|
+
|
|
9
|
+
**Modules.**
|
|
10
|
+
**One namespace.**
|
|
11
|
+
**One consistent API.**
|
|
12
|
+
|
|
13
|
+
---
|
|
14
|
+
|
|
7
15
|
[](https://npmjs.org/package/dphelper)
|
|
8
16
|
[](https://npmjs.org/package/dphelper)
|
|
9
17
|
|
|
10
18
|

|
|
11
19
|

|
|
12
|
-
|
|
13
20
|

|
|
14
21
|

|
|
15
|
-

|
|
17
23
|

|
|
18
|
-

|
|
19
25
|
[](https://playwright.dev/)
|
|
20
|
-
|
|
21
26
|

|
|
22
27
|

|
|
23
28
|
|
|
@@ -25,388 +30,603 @@
|
|
|
25
30
|
|
|
26
31
|
## Table of Contents
|
|
27
32
|
|
|
28
|
-
1. [
|
|
29
|
-
2. [
|
|
30
|
-
3. [
|
|
31
|
-
4. [
|
|
32
|
-
5. [
|
|
33
|
-
6. [
|
|
34
|
-
7. [
|
|
33
|
+
1. [What is dphelper?](#what-is-dphelper)
|
|
34
|
+
2. [Why dphelper?](#why-dphelper)
|
|
35
|
+
3. [Installation](#installation)
|
|
36
|
+
4. [The Capability Model](#the-capability-model)
|
|
37
|
+
5. [AI Power User Guide](#ai-power-user-guide)
|
|
38
|
+
6. [Modular Architecture](#modular-architecture)
|
|
39
|
+
7. [Web Worker Module](#web-worker-module)
|
|
40
|
+
8. [UI Mirror & Auto-Recovery](#ui-mirror--auto-recovery)
|
|
41
|
+
9. [Browser Extension](#browser-extension)
|
|
42
|
+
10. [Environment Compatibility](#environment-compatibility)
|
|
43
|
+
11. [Security](#security)
|
|
44
|
+
12. [State Architecture](#state-architecture)
|
|
45
|
+
13. [License](#license)
|
|
35
46
|
|
|
36
47
|
---
|
|
37
48
|
|
|
38
|
-
##
|
|
49
|
+
## What is dphelper?
|
|
39
50
|
|
|
40
|
-
**dphelper** is a
|
|
51
|
+
**dphelper** is a **stateless, zero-dependency capability toolkit** for modern JavaScript and TypeScript applications.
|
|
41
52
|
|
|
42
|
-
|
|
53
|
+
It provides a consistent collection of production-oriented capabilities for:
|
|
43
54
|
|
|
44
|
-
|
|
55
|
+
* Web development
|
|
56
|
+
* Node.js, Bun and Deno
|
|
57
|
+
* AI and LLM applications
|
|
58
|
+
* DevTools
|
|
59
|
+
* Browser applications
|
|
60
|
+
* Security and cryptography
|
|
61
|
+
* Networking
|
|
62
|
+
* Workers and parallel processing
|
|
63
|
+
* Data transformation
|
|
64
|
+
* Internationalization
|
|
65
|
+
* Runtime utilities
|
|
45
66
|
|
|
46
|
-
|
|
47
|
-
- **🤖 AI-First Design** - Built for LLM apps with TOON optimization, token counting, and RAG support.
|
|
48
|
-
- **🌐 Universal** - Works in browser, Node.js, Bun, and Deno.
|
|
49
|
-
- **🔒 Type-Safe** - Full TypeScript definitions auto-generated for every tool.
|
|
50
|
-
- **📦 Tiny Bundle** - Only ~171KB minified, tree-shakeable.
|
|
51
|
-
- **🔐 Security First** - NIST/NSA compliant, CNSA algorithms, PBKDF2 310k iterations
|
|
67
|
+
Instead of maintaining many small utility dependencies, applications can expose the capabilities they need through a single, consistent API.
|
|
52
68
|
|
|
53
|
-
|
|
54
|
-
|
|
69
|
+
### The core idea
|
|
70
|
+
|
|
71
|
+
A **capability** is a self-contained operation exposed through a predictable namespace and API.
|
|
55
72
|
|
|
56
|
-
|
|
73
|
+
For example:
|
|
74
|
+
|
|
75
|
+
```javascript
|
|
76
|
+
dphelper.security.ulid();
|
|
77
|
+
dphelper.format.currency(1234.56, "en-US", "USD");
|
|
78
|
+
dphelper.ai.tokenCount(data);
|
|
79
|
+
dphelper.worker.create("worker.js");
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
The same capabilities can also be imported individually when modularity and tree-shaking are preferred.
|
|
57
83
|
|
|
58
84
|
---
|
|
59
85
|
|
|
60
|
-
##
|
|
86
|
+
## Why dphelper?
|
|
61
87
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
88
|
+
### ⚡ Zero Dependencies
|
|
89
|
+
|
|
90
|
+
Pure JavaScript/TypeScript with no runtime dependency chain.
|
|
91
|
+
|
|
92
|
+
### 🧩 Modular
|
|
93
|
+
|
|
94
|
+
Every tool is exposed as an independent module and can be imported separately.
|
|
95
|
+
|
|
96
|
+
### 🌐 Universal
|
|
97
|
+
|
|
98
|
+
Tools are classified according to their execution environment and can target:
|
|
99
|
+
|
|
100
|
+
* Browser
|
|
101
|
+
* Node.js
|
|
102
|
+
* Bun
|
|
103
|
+
* Deno
|
|
104
|
+
* Isomorphic environments
|
|
66
105
|
|
|
67
|
-
|
|
106
|
+
### 🔒 Type-Safe
|
|
68
107
|
|
|
69
|
-
|
|
70
|
-
|
|
108
|
+
TypeScript definitions are generated and synchronized with the available tools.
|
|
109
|
+
|
|
110
|
+
### 📦 Compact
|
|
111
|
+
|
|
112
|
+
Approximately **171 KB minified**, with modular entry points available for smaller application bundles.
|
|
113
|
+
|
|
114
|
+
### 🤖 AI Ready
|
|
115
|
+
|
|
116
|
+
AI-oriented capabilities include:
|
|
117
|
+
|
|
118
|
+
* TOON structured representation
|
|
119
|
+
* Context-aware token counting
|
|
120
|
+
* RAG-oriented chunking
|
|
121
|
+
* Semantic similarity
|
|
122
|
+
* AI response processing
|
|
123
|
+
* Runtime snapshots optimized for LLM consumption
|
|
124
|
+
|
|
125
|
+
### 🔐 Security-Oriented
|
|
126
|
+
|
|
127
|
+
Uses established cryptographic primitives including:
|
|
128
|
+
|
|
129
|
+
* AES-256-GCM
|
|
130
|
+
* SHA-256
|
|
131
|
+
* PBKDF2
|
|
132
|
+
|
|
133
|
+
Security-sensitive functionality should always be evaluated according to the application's threat model and deployment environment.
|
|
134
|
+
|
|
135
|
+
> [!NOTE]
|
|
136
|
+
> **Network Access:** `dphelper` includes networking primitives such as `fetch`, `sse` and `socket`. Applications remain responsible for validating and sanitizing externally supplied URLs and other inputs.
|
|
71
137
|
|
|
72
138
|
---
|
|
73
139
|
|
|
74
140
|
## Installation
|
|
75
141
|
|
|
76
142
|
```shell
|
|
77
|
-
npm
|
|
143
|
+
npm install dphelper
|
|
78
144
|
```
|
|
79
145
|
|
|
80
146
|
### Usage
|
|
81
147
|
|
|
82
|
-
Import
|
|
148
|
+
Import the package once at the application entry point when using the global namespace:
|
|
83
149
|
|
|
84
|
-
```
|
|
85
|
-
//
|
|
150
|
+
```javascript
|
|
151
|
+
// Import once at your application entry point
|
|
86
152
|
|
|
87
153
|
import "dphelper";
|
|
88
154
|
```
|
|
89
155
|
|
|
90
|
-
|
|
156
|
+
After initialization, capabilities are available through the global `dphelper` namespace.
|
|
157
|
+
|
|
158
|
+
```javascript
|
|
159
|
+
dphelper.format.currency(1234.56, "en-US", "USD");
|
|
160
|
+
dphelper.security.ulid();
|
|
161
|
+
```
|
|
162
|
+
|
|
163
|
+
---
|
|
91
164
|
|
|
92
|
-
|
|
165
|
+
## Modular Imports
|
|
93
166
|
|
|
94
|
-
|
|
95
|
-
import { sanitize } from "dphelper/sanitize"
|
|
96
|
-
import { format } from "dphelper/format"
|
|
97
|
-
import { fetch } from "dphelper/fetch"
|
|
98
|
-
import { security } from "dphelper/security"
|
|
167
|
+
For smaller bundles and explicit dependencies, import individual capabilities:
|
|
99
168
|
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
169
|
+
```typescript
|
|
170
|
+
import { sanitize } from "dphelper/sanitize";
|
|
171
|
+
import { format } from "dphelper/format";
|
|
172
|
+
import { fetch } from "dphelper/fetch";
|
|
173
|
+
import { security } from "dphelper/security";
|
|
105
174
|
|
|
106
|
-
|
|
175
|
+
sanitize.html("<strong>safe text</strong>");
|
|
107
176
|
|
|
108
|
-
|
|
109
|
-
import "dphelper/format"
|
|
177
|
+
format.currency(1234.56, "en-US", "USD");
|
|
110
178
|
|
|
111
|
-
|
|
112
|
-
|
|
179
|
+
await fetch.get("https://api.example.com");
|
|
180
|
+
|
|
181
|
+
security.ulid();
|
|
113
182
|
```
|
|
114
183
|
|
|
115
|
-
|
|
116
|
-
> Every tool under `tools/` is published as `dphelper/<tool>` (e.g. `dphelper/array`, `dphelper/i18n`, `dphelper/worker`). The full list is generated automatically from the `tools/` directory at build time, so adding a new tool creates its modular entry point with no extra configuration.
|
|
184
|
+
The same capability remains available through the global namespace after importing the module:
|
|
117
185
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
>
|
|
121
|
-
> To fix it, either:
|
|
122
|
-
> - keep `"resolvePackageJsonExports": true` (the default for `moduleResolution: "bundler"`), or
|
|
123
|
-
> - import from the physical path: `import { sanitize } from "dphelper/modules/sanitize"`.
|
|
124
|
-
>
|
|
125
|
-
> Note: this is a TypeScript-only resolution issue. Vite and other bundlers resolve the subpath correctly at build/runtime via the `exports` map regardless of that flag.
|
|
186
|
+
```typescript
|
|
187
|
+
import "dphelper/format";
|
|
126
188
|
|
|
127
|
-
|
|
189
|
+
dphelper.format.currency(1234.56, "en-US", "USD");
|
|
190
|
+
```
|
|
191
|
+
|
|
192
|
+
### Automatic Module Generation
|
|
128
193
|
|
|
129
|
-
|
|
130
|
-
<script src="https://unpkg.com/dphelper/dphelper.js"></script>
|
|
194
|
+
Every tool under `tools/` is published as a corresponding package subpath:
|
|
131
195
|
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
196
|
+
```text
|
|
197
|
+
dphelper/array
|
|
198
|
+
dphelper/i18n
|
|
199
|
+
dphelper/worker
|
|
200
|
+
dphelper/security
|
|
201
|
+
dphelper/...
|
|
137
202
|
```
|
|
138
203
|
|
|
139
|
-
|
|
204
|
+
The build system automatically discovers tools and generates their modular entry points and TypeScript interfaces.
|
|
140
205
|
|
|
141
|
-
|
|
206
|
+
Adding a tool therefore does not require manually maintaining a separate export registry.
|
|
142
207
|
|
|
143
|
-
|
|
144
|
-
// Create worker from file
|
|
145
|
-
const worker = dphelper.worker.create('worker.js', {
|
|
146
|
-
onmessage: (e) => console.log(e.data)
|
|
147
|
-
});
|
|
208
|
+
### TypeScript and `resolvePackageJsonExports`
|
|
148
209
|
|
|
149
|
-
|
|
150
|
-
const inlineWorker = dphelper.worker.createInline(`
|
|
151
|
-
self.onmessage = e => postMessage(e.data * 2);
|
|
152
|
-
`);
|
|
210
|
+
Modular subpath imports are resolved through the `exports` map in `dphelper/package.json`.
|
|
153
211
|
|
|
154
|
-
|
|
155
|
-
const pool = dphelper.worker.pool('worker.js', 4);
|
|
156
|
-
const results = await dphelper.worker.poolExec(pool, [1, 2, 3, 4]);
|
|
212
|
+
If your `tsconfig.json` explicitly sets:
|
|
157
213
|
|
|
158
|
-
|
|
159
|
-
|
|
214
|
+
```json
|
|
215
|
+
{
|
|
216
|
+
"resolvePackageJsonExports": false
|
|
217
|
+
}
|
|
160
218
|
```
|
|
161
219
|
|
|
162
|
-
|
|
220
|
+
TypeScript may fall back to physical path resolution and fail with:
|
|
163
221
|
|
|
164
|
-
|
|
222
|
+
```text
|
|
223
|
+
TS2307: Cannot find module 'dphelper/<tool>'
|
|
224
|
+
```
|
|
165
225
|
|
|
166
|
-
|
|
167
|
-
// Set locale
|
|
168
|
-
dphelper.i18n.setLocale('it');
|
|
226
|
+
Keep:
|
|
169
227
|
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
items: '{count, plural, one{# item} other{# items}}'
|
|
174
|
-
});
|
|
228
|
+
```json
|
|
229
|
+
"resolvePackageJsonExports": true
|
|
230
|
+
```
|
|
175
231
|
|
|
176
|
-
|
|
177
|
-
dphelper.i18n.t('hello', { name: 'World' }); // "Ciao World!"
|
|
232
|
+
or use the physical module path when required:
|
|
178
233
|
|
|
179
|
-
|
|
180
|
-
|
|
234
|
+
```typescript
|
|
235
|
+
import { sanitize } from "dphelper/modules/sanitize";
|
|
236
|
+
```
|
|
181
237
|
|
|
182
|
-
|
|
183
|
-
dphelper.i18n.number(1234.56, 'de-DE', { style: 'currency', currency: 'EUR' });
|
|
238
|
+
This is a TypeScript resolution issue. Modern bundlers such as Vite resolve the package through the `exports` map at build/runtime.
|
|
184
239
|
|
|
185
|
-
// Relative time
|
|
186
|
-
dphelper.i18n.relativeTime(Date.now() - 3600000); // "1 hour ago"
|
|
187
|
-
```
|
|
188
240
|
---
|
|
189
241
|
|
|
190
|
-
##
|
|
242
|
+
## The Capability Model
|
|
191
243
|
|
|
192
|
-
|
|
193
|
-
// Gzip compression
|
|
194
|
-
const compressed = await dphelper.compress.gzip('Hello World');
|
|
195
|
-
const decompressed = await dphelper.compress.gunzip(compressed);
|
|
244
|
+
`dphelper` is organized around three architectural principles.
|
|
196
245
|
|
|
197
|
-
|
|
198
|
-
const encoded = dphelper.compress.base64Encode('Hello');
|
|
199
|
-
const decoded = dphelper.compress.base64Decode(encoded);
|
|
246
|
+
### Stateless
|
|
200
247
|
|
|
201
|
-
|
|
202
|
-
const urlEncoded = dphelper.compress.urlEncode('Hello World!');
|
|
203
|
-
const urlDecoded = dphelper.compress.urlDecode(urlEncoded);
|
|
248
|
+
`dphelper` does not own application state.
|
|
204
249
|
|
|
205
|
-
|
|
206
|
-
const htmlEncoded = dphelper.compress.htmlEncode('<script>');
|
|
207
|
-
const htmlDecoded = dphelper.compress.htmlDecode('<script>');
|
|
208
|
-
```
|
|
250
|
+
Its capabilities perform operations without becoming the authoritative store for application data.
|
|
209
251
|
|
|
210
|
-
|
|
252
|
+
### Modular
|
|
211
253
|
|
|
212
|
-
|
|
254
|
+
Each capability is independently addressable.
|
|
213
255
|
|
|
214
|
-
```
|
|
215
|
-
|
|
216
|
-
|
|
256
|
+
```text
|
|
257
|
+
dphelper/<capability>
|
|
258
|
+
```
|
|
259
|
+
|
|
260
|
+
This makes the system easier to compose, test and tree-shake.
|
|
261
|
+
|
|
262
|
+
### Consistent
|
|
217
263
|
|
|
218
|
-
|
|
219
|
-
const support = dphelper.biometric.getWebAuthnSupport();
|
|
264
|
+
Capabilities follow a common namespace model:
|
|
220
265
|
|
|
221
|
-
|
|
222
|
-
|
|
266
|
+
```text
|
|
267
|
+
dphelper.<domain>.<operation>
|
|
268
|
+
```
|
|
223
269
|
|
|
224
|
-
|
|
225
|
-
const { success } = await dphelper.biometric.authenticate('user123');
|
|
270
|
+
For example:
|
|
226
271
|
|
|
227
|
-
|
|
228
|
-
|
|
272
|
+
```text
|
|
273
|
+
dphelper.ai.toon()
|
|
274
|
+
dphelper.security.ulid()
|
|
275
|
+
dphelper.i18n.t()
|
|
276
|
+
dphelper.worker.create()
|
|
277
|
+
dphelper.sync.pulse()
|
|
229
278
|
```
|
|
230
279
|
|
|
280
|
+
This consistency is intended to make capabilities easier to discover, integrate and reason about.
|
|
281
|
+
|
|
231
282
|
---
|
|
232
283
|
|
|
233
284
|
## AI Power User Guide
|
|
234
285
|
|
|
235
|
-
The
|
|
286
|
+
The `dphelper.ai` module provides utilities for modern AI applications, including LLM, RAG and vector-oriented workflows.
|
|
287
|
+
|
|
288
|
+
### TOON
|
|
289
|
+
|
|
290
|
+
Generate a compact structured representation suitable for LLM prompts:
|
|
236
291
|
|
|
237
292
|
```javascript
|
|
238
|
-
// ⚡ TOON: The ultimate JSON alternative for prompts
|
|
239
293
|
const toonData = dphelper.ai.toon(myJsonObject);
|
|
240
|
-
|
|
294
|
+
```
|
|
241
295
|
|
|
242
|
-
|
|
296
|
+
### Context-Aware Token Counting
|
|
297
|
+
|
|
298
|
+
```javascript
|
|
243
299
|
const tokens = dphelper.ai.tokenCount(myJsonObject);
|
|
244
|
-
|
|
300
|
+
```
|
|
301
|
+
|
|
302
|
+
Token estimation can take the resulting representation into account rather than treating the original object as the only representation.
|
|
303
|
+
|
|
304
|
+
### RAG-Oriented Chunking
|
|
305
|
+
|
|
306
|
+
```javascript
|
|
307
|
+
const chunks = dphelper.ai.chunker(longText, {
|
|
308
|
+
size: 1000,
|
|
309
|
+
overlap: 200
|
|
310
|
+
});
|
|
311
|
+
```
|
|
312
|
+
|
|
313
|
+
### Semantic Similarity
|
|
245
314
|
|
|
246
|
-
|
|
247
|
-
const
|
|
315
|
+
```javascript
|
|
316
|
+
const score = dphelper.ai.similarity(
|
|
317
|
+
embeddingA,
|
|
318
|
+
embeddingB
|
|
319
|
+
);
|
|
320
|
+
```
|
|
321
|
+
|
|
322
|
+
### Reasoning Extraction
|
|
323
|
+
|
|
324
|
+
```javascript
|
|
325
|
+
const { reasoning, content } =
|
|
326
|
+
dphelper.ai.extractReasoning(rawAiReply);
|
|
327
|
+
```
|
|
248
328
|
|
|
249
|
-
|
|
250
|
-
const score = dphelper.ai.similarity(embeddingA, embeddingB);
|
|
329
|
+
Designed to process model responses that expose separate reasoning/content representations.
|
|
251
330
|
|
|
252
|
-
|
|
253
|
-
const { reasoning, content } = dphelper.ai.extractReasoning(rawAiReply);
|
|
331
|
+
### AI Runtime Snapshot
|
|
254
332
|
|
|
255
|
-
|
|
333
|
+
```javascript
|
|
256
334
|
const appStateToon = dphelper.ai.snapshot();
|
|
257
|
-
// Generates a complete app "mental dump" (URL, gState, Logs) optimized for LLMs.
|
|
258
335
|
```
|
|
259
336
|
|
|
337
|
+
The snapshot capability generates a compact runtime representation intended for AI-assisted inspection, debugging and recovery.
|
|
338
|
+
|
|
339
|
+
Depending on the application environment, this can include information such as:
|
|
340
|
+
|
|
341
|
+
* URL
|
|
342
|
+
* runtime/global state
|
|
343
|
+
* application logs
|
|
344
|
+
* relevant runtime context
|
|
345
|
+
|
|
260
346
|
---
|
|
261
347
|
|
|
262
348
|
## Modular Architecture
|
|
263
349
|
|
|
264
|
-
Every tool in `dphelper` is
|
|
350
|
+
Every tool in `dphelper` is maintained as a self-contained module.
|
|
351
|
+
|
|
352
|
+
The build system:
|
|
265
353
|
|
|
266
354
|
1. Scans the `tools/` directory.
|
|
267
|
-
2. Generates
|
|
268
|
-
3.
|
|
355
|
+
2. Generates module entry points.
|
|
356
|
+
3. Generates dynamic imports for the core.
|
|
357
|
+
4. Synchronizes TypeScript interfaces.
|
|
358
|
+
5. Keeps the public API aligned with the available tools.
|
|
269
359
|
|
|
270
|
-
This
|
|
360
|
+
This makes the module system extensible without requiring a manually maintained central registry.
|
|
271
361
|
|
|
272
362
|
---
|
|
273
363
|
|
|
274
|
-
##
|
|
364
|
+
## Web Worker Module
|
|
275
365
|
|
|
276
|
-
`dphelper`
|
|
366
|
+
`dphelper.worker` provides worker creation, inline workers, worker pools and SharedWorker support.
|
|
367
|
+
|
|
368
|
+
### Worker
|
|
369
|
+
|
|
370
|
+
```javascript
|
|
371
|
+
const worker = dphelper.worker.create("worker.js", {
|
|
372
|
+
onmessage: (e) => console.log(e.data)
|
|
373
|
+
});
|
|
374
|
+
```
|
|
375
|
+
|
|
376
|
+
### Inline Worker
|
|
377
|
+
|
|
378
|
+
```javascript
|
|
379
|
+
const inlineWorker = dphelper.worker.createInline(`
|
|
380
|
+
self.onmessage = e => postMessage(e.data * 2);
|
|
381
|
+
`);
|
|
382
|
+
```
|
|
383
|
+
|
|
384
|
+
### Worker Pool
|
|
385
|
+
|
|
386
|
+
```javascript
|
|
387
|
+
const pool = dphelper.worker.pool("worker.js", 4);
|
|
388
|
+
|
|
389
|
+
const results = await dphelper.worker.poolExec(
|
|
390
|
+
pool,
|
|
391
|
+
[1, 2, 3, 4]
|
|
392
|
+
);
|
|
393
|
+
```
|
|
394
|
+
|
|
395
|
+
### SharedWorker
|
|
396
|
+
|
|
397
|
+
```javascript
|
|
398
|
+
const shared = dphelper.worker.shared(
|
|
399
|
+
"worker.js",
|
|
400
|
+
{ name: "my-shared" }
|
|
401
|
+
);
|
|
402
|
+
```
|
|
403
|
+
|
|
404
|
+
---
|
|
405
|
+
|
|
406
|
+
## UI Mirror & Auto-Recovery
|
|
407
|
+
|
|
408
|
+
`dphelper` provides browser capabilities designed to make web applications behave more like persistent desktop applications.
|
|
409
|
+
|
|
410
|
+
### Auto-Recovery
|
|
411
|
+
|
|
412
|
+
Persist useful UI context across reloads and crashes:
|
|
277
413
|
|
|
278
414
|
```javascript
|
|
279
|
-
// ⚓ Auto-Recovery: Save scroll and input values across reloads/crashes
|
|
280
415
|
dphelper.UI.anchorContext();
|
|
416
|
+
```
|
|
417
|
+
|
|
418
|
+
### Cross-Tab Event Bus
|
|
281
419
|
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
420
|
+
Use `BroadcastChannel`-based synchronization without requiring a backend:
|
|
421
|
+
|
|
422
|
+
```javascript
|
|
423
|
+
const bus = dphelper.sync.pulse(
|
|
424
|
+
"my-app",
|
|
425
|
+
(msg) => {
|
|
426
|
+
console.debug(
|
|
427
|
+
"Received from another tab:",
|
|
428
|
+
msg
|
|
429
|
+
);
|
|
430
|
+
}
|
|
431
|
+
);
|
|
432
|
+
|
|
433
|
+
bus.emit({
|
|
434
|
+
action: "theme-change",
|
|
435
|
+
value: "dark"
|
|
285
436
|
});
|
|
286
|
-
|
|
437
|
+
```
|
|
287
438
|
|
|
288
|
-
|
|
439
|
+
### Browser Interlock
|
|
440
|
+
|
|
441
|
+
Monitor the number of active application tabs:
|
|
442
|
+
|
|
443
|
+
```javascript
|
|
289
444
|
dphelper.browser.interlock((count) => {
|
|
290
445
|
console.debug(`Active tabs: ${count}`);
|
|
291
446
|
});
|
|
447
|
+
```
|
|
448
|
+
|
|
449
|
+
### Server-Sent Events
|
|
450
|
+
|
|
451
|
+
```javascript
|
|
452
|
+
const stream = dphelper.sse.open("/api/ai", {
|
|
453
|
+
method: "POST",
|
|
454
|
+
headers: {
|
|
455
|
+
"Authorization": "Bearer ..."
|
|
456
|
+
},
|
|
457
|
+
body: JSON.stringify({
|
|
458
|
+
prompt: "Hello AI"
|
|
459
|
+
})
|
|
460
|
+
});
|
|
292
461
|
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
method: 'POST',
|
|
296
|
-
headers: { 'Authorization': 'Bearer ...' },
|
|
297
|
-
body: JSON.stringify({ prompt: 'Hello AI' })
|
|
462
|
+
stream.on("message", (data) => {
|
|
463
|
+
console.debug("Chunk:", data);
|
|
298
464
|
});
|
|
299
465
|
|
|
300
|
-
stream.on(
|
|
301
|
-
|
|
466
|
+
stream.on("error", (err) => {
|
|
467
|
+
console.error("Stream failure:", err);
|
|
468
|
+
});
|
|
302
469
|
```
|
|
303
470
|
|
|
304
471
|
---
|
|
305
472
|
|
|
306
|
-
## Browser Extension
|
|
307
|
-
|
|
308
|
-

|
|
473
|
+
## Browser Extension
|
|
309
474
|
|
|
310
|
-
|
|
475
|
+
The **dphelper Manager** browser extension provides tools for managing the `dphelper` environment, monitoring memory usage and accessing documentation.
|
|
311
476
|
|
|
312
|
-
|
|
313
|
-
|
|
477
|
+
* [Chrome Web Store](https://chrome.google.com/webstore/detail/dphelper-manager-dev-tool/oppppldaoknfddeikfloonnialijngbk)
|
|
478
|
+
* [Microsoft Edge Add-ons](https://microsoftedge.microsoft.com/addons/detail/dphelper-manager-dev-to/kphabkbdpaljlfagldhojilhfammepnk)
|
|
314
479
|
|
|
315
480
|
---
|
|
316
481
|
|
|
317
482
|
## Environment Compatibility
|
|
318
483
|
|
|
319
|
-
|
|
484
|
+
Tools are classified according to their execution target.
|
|
320
485
|
|
|
321
|
-
|
|
|
322
|
-
|
|
|
323
|
-
| 🌐
|
|
324
|
-
| 🖥️
|
|
325
|
-
| 🧬
|
|
486
|
+
| Type | Description |
|
|
487
|
+
| ----------------- | ------------------------------------------------------------------------------------- |
|
|
488
|
+
| 🌐 **Client** | Browser-only capabilities requiring DOM, `window`, `navigator` or other browser APIs. |
|
|
489
|
+
| 🖥️ **Server** | Node.js, Bun or Deno capabilities requiring server-side APIs. |
|
|
490
|
+
| 🧬 **Isomorphic** | Capabilities designed to work across browser and server environments. |
|
|
326
491
|
|
|
327
492
|
### Core Module Status
|
|
328
493
|
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
494
|
+
| Module | Environment |
|
|
495
|
+
| ----------------- | --------------------------- |
|
|
496
|
+
| `dphelper.ai` | 🧬 Isomorphic |
|
|
497
|
+
| `dphelper.fetch` | 🧬 Isomorphic — Node.js 18+ |
|
|
498
|
+
| `dphelper.sse` | 🌐 Client |
|
|
499
|
+
| `dphelper.socket` | 🌐 Client |
|
|
500
|
+
| `dphelper.sync` | 🌐 Client |
|
|
501
|
+
| `dphelper.UI` | 🌐 Client |
|
|
335
502
|
|
|
336
503
|
---
|
|
337
504
|
|
|
338
505
|
## Security
|
|
339
506
|
|
|
340
|
-
|
|
507
|
+
Security-sensitive functionality should be evaluated according to the application's own threat model and deployment requirements.
|
|
508
|
+
|
|
509
|
+
### Cryptography
|
|
510
|
+
|
|
511
|
+
`dphelper` uses established cryptographic primitives including:
|
|
512
|
+
|
|
513
|
+
* **AES-256-GCM**
|
|
514
|
+
* **SHA-256**
|
|
515
|
+
* **PBKDF2**
|
|
516
|
+
* **310,000 PBKDF2 iterations** where applicable
|
|
341
517
|
|
|
342
|
-
|
|
343
|
-
- **AES-256-GCM** encryption
|
|
344
|
-
- **SHA-256** only (SHA-1 deprecated)
|
|
345
|
-
- **PBKDF2** with 310,000 iterations (OWASP 2023)
|
|
518
|
+
These choices are intended to align with widely recognized security guidance; they should not be interpreted as a blanket certification or compliance claim for every application using the library.
|
|
346
519
|
|
|
347
520
|
### Network Security
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
521
|
+
|
|
522
|
+
Networking capabilities include:
|
|
523
|
+
|
|
524
|
+
* HTTPS for `fetch` and SSE where required by the application
|
|
525
|
+
* `wss://` for secure WebSocket connections
|
|
526
|
+
* URL validation capabilities
|
|
351
527
|
|
|
352
528
|
> [!IMPORTANT]
|
|
353
|
-
> **
|
|
529
|
+
> **Library users remain responsible for input validation.**
|
|
530
|
+
>
|
|
531
|
+
> Always validate and sanitize externally supplied URLs before passing them to networking capabilities.
|
|
354
532
|
|
|
355
533
|
```javascript
|
|
356
|
-
// Correct
|
|
357
534
|
const safeUrl = dphelper.sanitize.url(userInput);
|
|
535
|
+
|
|
358
536
|
await dphelper.fetch.get(safeUrl);
|
|
537
|
+
```
|
|
359
538
|
|
|
360
|
-
|
|
361
|
-
|
|
539
|
+
Avoid:
|
|
540
|
+
|
|
541
|
+
```javascript
|
|
542
|
+
await dphelper.fetch.get(userInput);
|
|
362
543
|
```
|
|
363
544
|
|
|
364
545
|
### Web Workers
|
|
365
546
|
|
|
366
|
-
|
|
547
|
+
Worker APIs execute supplied scripts in the Worker context and therefore require trusted input.
|
|
367
548
|
|
|
368
|
-
|
|
369
|
-
- `dphelper.worker.importScripts(worker, scripts)` genera un wrapper `importScripts(...)` interno. La libreria **filtra i protocolli** (solo `http:`, `https:`, `blob:`, `data:` o percorsi relativi) e **escape dei caratteri `'` e `\`** per ridurre il rischio di injection, ma comunque affidabilità il contenuto e le URL alle pagine chiamanti.
|
|
370
|
-
- `dphelper.worker.shared(src)` crea un `SharedWorker`; `src` deve puntare a uno script fidato servito con `http:`/`https:` o percorso relativo.
|
|
549
|
+
Do not pass untrusted user-controlled code directly to:
|
|
371
550
|
|
|
372
|
-
|
|
373
|
-
|
|
551
|
+
```javascript
|
|
552
|
+
dphelper.worker.createInline(code);
|
|
553
|
+
dphelper.worker.create(src);
|
|
554
|
+
dphelper.worker.pool(src);
|
|
555
|
+
dphelper.worker.importScripts(worker, scripts);
|
|
556
|
+
```
|
|
557
|
+
|
|
558
|
+
For example:
|
|
374
559
|
|
|
375
560
|
```javascript
|
|
376
|
-
//
|
|
561
|
+
// Trusted static worker
|
|
377
562
|
dphelper.worker.create("./my-trusted-worker.js");
|
|
378
|
-
dphelper.worker.importScripts(w, ["https://cdn.example.com/lib.js"]);
|
|
379
563
|
|
|
380
|
-
//
|
|
381
|
-
dphelper.worker.
|
|
564
|
+
// Trusted external resource
|
|
565
|
+
dphelper.worker.importScripts(
|
|
566
|
+
worker,
|
|
567
|
+
["https://cdn.example.com/lib.js"]
|
|
568
|
+
);
|
|
382
569
|
```
|
|
383
570
|
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
571
|
+
Never treat user-supplied code or URLs as trusted merely because they are passed through a library API.
|
|
572
|
+
|
|
573
|
+
### Security Testing
|
|
574
|
+
|
|
575
|
+
The project uses automated security scanning as part of its development workflow.
|
|
388
576
|
|
|
389
577
|
---
|
|
390
578
|
|
|
391
|
-
|
|
579
|
+
## State Architecture
|
|
392
580
|
|
|
393
|
-
`dphelper`
|
|
581
|
+
`dphelper` is intentionally **stateless**.
|
|
394
582
|
|
|
395
|
-
|
|
583
|
+
Application state management is separated into dedicated libraries to keep capability execution independent from application state.
|
|
396
584
|
|
|
397
|
-
|
|
398
|
-
| :--- | :--- | :--- | :--- |
|
|
399
|
-
| **Stateless Utilities & AI Tools** | `dphelper` | Isomorphic (Browser, Node.js, Bun, Deno) | **Zero-Dependency Universal Core.** Packs 303 production-ready modules including `ai` (TOON optimization, smart chunking), `worker` multi-threaded pools, `biometric` WebAuthn, `i18n`, desktop-grade cross-tab `sync.pulse`, and NIST-compliant cryptography. |
|
|
400
|
-
| **Simple Global State** | `memorio` | Application-Wide Runtime | **Global Singleton Pattern.** High-performance, lightweight state management that eliminates boilerplate. It registers globally upon initial import and removes the need for custom context providers, actions, or dispatch files. |
|
|
401
|
-
| **Enterprise State Architecture** | `Argis RGS` | Distributed / Complex SaaS Systems | **Heavy-Duty Reactive Structure.** Built for multi-module, enterprise-grade applications requiring strict state rules, relational data synchronization, and heavy concurrent data pipelines. |
|
|
585
|
+
### Architecture
|
|
402
586
|
|
|
403
|
-
|
|
587
|
+
| Layer | Package | Operational Target | Design Philosophy |
|
|
588
|
+
| ---------------------------------- | ----------- | --------------------------- | ----------------------------------------------- |
|
|
589
|
+
| **Stateless Utilities & AI Tools** | `dphelper` | Browser, Node.js, Bun, Deno | Zero-dependency universal capability layer |
|
|
590
|
+
| **Simple Global State** | `memorio` | Application runtime | Lightweight global state management |
|
|
591
|
+
| **Enterprise State Architecture** | `Argis RGS` | Distributed / complex SaaS | Reactive state and complex data synchronization |
|
|
592
|
+
|
|
593
|
+
### Why separate state?
|
|
404
594
|
|
|
405
|
-
|
|
595
|
+
Keeping application state outside `dphelper` provides a clear separation between:
|
|
406
596
|
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
597
|
+
```text
|
|
598
|
+
CAPABILITIES
|
|
599
|
+
│
|
|
600
|
+
▼
|
|
601
|
+
dphelper
|
|
602
|
+
│
|
|
603
|
+
│ stateless operations
|
|
604
|
+
▼
|
|
605
|
+
APPLICATION
|
|
606
|
+
│
|
|
607
|
+
▼
|
|
608
|
+
STATE
|
|
609
|
+
│
|
|
610
|
+
┌───┴────┐
|
|
611
|
+
▼ ▼
|
|
612
|
+
Memorio RGS
|
|
613
|
+
```
|
|
614
|
+
|
|
615
|
+
This avoids coupling utility execution to application-specific state ownership.
|
|
616
|
+
|
|
617
|
+
### Integration Guidance
|
|
618
|
+
|
|
619
|
+
Do not rely on legacy state APIs such as:
|
|
620
|
+
|
|
621
|
+
```text
|
|
622
|
+
dphelper.store
|
|
623
|
+
```
|
|
624
|
+
|
|
625
|
+
Migrate state management to the appropriate dedicated state system.
|
|
626
|
+
|
|
627
|
+
For cross-tab communication, `dphelper.sync` can provide the transport/event mechanism while a dedicated state manager remains responsible for application state.
|
|
628
|
+
|
|
629
|
+
---
|
|
410
630
|
|
|
411
631
|
## License
|
|
412
632
|
|
|
@@ -414,4 +634,4 @@ MIT License
|
|
|
414
634
|
|
|
415
635
|
## Credits
|
|
416
636
|
|
|
417
|
-
|
|
637
|
+
Copyright (c) [Dario Passariello](https://dario.passariello.ca/)
|