Skip to content

Commit 6f1d2cc

Browse files
committed
simplify readme
1 parent 15c2982 commit 6f1d2cc

1 file changed

Lines changed: 9 additions & 27 deletions

File tree

packages/javascript/README.md

Lines changed: 9 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ Initialization settings:
9393
| `consoleTracking` | boolean | optional | Initialize console logs tracking |
9494
| `breadcrumbs` | false or BreadcrumbsOptions object | optional | Configure breadcrumbs tracking (see below) |
9595
| `beforeSend` | function(event) => event \| false \| void | optional | Filter data before sending. Return modified event, `false` to drop the event. |
96-
| `issues` | IssuesOptions object | optional | Issues config: `errors`, `webVitals`, `longTasks.thresholdMs`, `longAnimationFrames.thresholdMs` |
96+
| `issues` | IssuesOptions object | optional | Issues config. See [Issues configuration](#issues-configuration). |
9797

9898
Other available [initial settings](types/hawk-initial-settings.d.ts) are described at the type definition.
9999

@@ -236,28 +236,18 @@ const breadcrumbs = hawk.breadcrumbs.get();
236236
hawk.breadcrumbs.clear();
237237
```
238238
239-
## Issues Detection
239+
## Issues configuration
240240
241-
`issues` is an umbrella option for problems detected by the catcher.
242-
Browser support depends on the specific detector:
243-
- `errors` — works in all supported browsers
244-
- `webVitals` — via `web-vitals` package
245-
- `longTasks` / `longAnimationFrames` — Chromium-only (`long-animation-frame` requires Chrome/Edge 123+)
246-
247-
It currently includes three groups:
241+
The `issues` option is used to configure different tracking features
248242
249243
- `issues.errors` — global runtime errors handling
250-
- `issues.webVitals` — aggregated Core Web Vitals report
251-
- `issues.longTasks` and `issues.longAnimationFrames` — freeze-related detectors
244+
- `issues.webVitals` — Core Web Vitals reports
245+
- `issues.longTasks` — reports about tasks taking longer than specified time (50 ms by default)
246+
- `issues.longAnimationFrames` — reporst about framges taking longer that specified time (200ms by default)
252247
253-
Freeze detectors use two complementary APIs:
254248
255-
- **Long Tasks API** — browser reports tasks taking longer than 50 ms.
256-
- **Long Animation Frames (LoAF)** — browser reports frames taking longer than 50 ms with richer script attribution (Chrome 123+, Edge 123+).
249+
All issues are enabled by default. If user browser does not support some metric, it won't be sent.
257250
258-
Both freeze detectors are enabled by default. If one API is unsupported, the other still works.
259-
Each detected freeze is reported immediately with detailed context (duration, blocking time, scripts involved, etc.).
260-
`thresholdMs` is an additional Hawk filter on top of browser reporting. Hawk emits an issue when measured duration is equal to or greater than this value. Values below `50ms` are clamped to `50ms`.
261251
262252
### Web Vitals
263253
@@ -268,7 +258,8 @@ Each Web Vitals issue context contains metric fields:
268258
- `rating`
269259
- `delta`
270260
271-
`web-vitals` is optional and used only when `issues.webVitals: true`:
261+
**You need to install the `web-vitals` package if you enable `webVitals=true` (by default).**
262+
272263
- NPM/ESM setup: install `web-vitals` as dependency.
273264
- CDN setup: expose global `window.webVitals` before Hawk initialization.
274265
@@ -305,15 +296,6 @@ const hawk = new HawkCatcher({
305296
});
306297
```
307298
308-
### Options
309-
310-
| Option | Type | Default | Description |
311-
|--------|------|---------|-------------|
312-
| `errors` | `boolean` | `true` | Enable global errors handling (`window.onerror` and `unhandledrejection`). |
313-
| `webVitals` | `boolean` | `true` | Listen to Core Web Vitals and send one issue event per metric when that metric is rated `poor`. Requires optional `web-vitals` dependency. |
314-
| `longTasks` | `boolean` or `{ thresholdMs?: number }` | `true` | `false` disables. `true` enables with default threshold. Object enables and uses `thresholdMs` when valid; otherwise fallback threshold `70ms` is used (minimum effective value `50ms`). |
315-
| `longAnimationFrames` | `boolean` or `{ thresholdMs?: number }` | `true` | `false` disables. `true` enables with default threshold. Object enables and uses `thresholdMs` when valid; otherwise fallback threshold `200ms` is used (minimum effective value `50ms`). Requires Chrome 123+ / Edge 123+. |
316-
317299
## Source maps consuming
318300
319301
If your bundle is minified, it is useful to pass source-map files to the Hawk. After that you will see beautiful

0 commit comments

Comments
 (0)