open-index/open-npm huggingface dataset:
npm package: @johfe/perfsee-bundle-analyzer
Description: Bundle analyzer by perfsee
Latest version: 1.13.1

# `@johfe/perfsee-bundle-analyzer`

## Usage

```ts
import { StatsParser } from '@johfe/perfsee-bundle-analyzer'

// or const parser = StatsParser.FromStatsFile(webpackStatsFile)
const parser = StatsParser.FromStats(webpackStats, outputPath)

const { result, content } = await parser.parse()

// reference
console.log(result)

// module references tree
console.log(content)
```

## Credits

The module tree part is forked from [webpack-bundle-analyzer](https://github.com/webpack-contrib/webpack-bundle-analyzer)
npm package: @johfe/perfsee-chrome-finder
Description: Chrome executable bin finder
Latest version: 1.13.1

# `@johfe/perfsee-chrome-finder`

Find local installed Google Chrome(Chromium) executable path or download it.

## Usage

```
const { findChrome } = require('chrome-finder');

findChrome(({ executablePath, browser }) => {
  // absolute path to the chrome executable
  console.log(executablePath)
  // result of `chrome --version`, e.g. `Google Chrome xx.xx.xx.xx`
  console.log(browser)
})
```

## Credits

This package is a fork of [mbalabash/find-chrome-bin](https://github.com/mbalabash/find-chrome-bin) which only works with `node>=16` (specified in engines)
npm package: @johfe/perfsee-jsonr
Description: JSON with references
Latest version: 1.13.1

## jsonr

JSON with references

# Example

```
import JSONR from '@johfe/perfsee-jsonr'

const jsonrStr = JSONR.stringify({ hello: "world" })
const obj = JSONR.parse(jsonrStr)
```

# Format

```JS
const obj = { a: { hello: 'world', foooobar: 1 }, b: [] as any[] }
obj.b.push(obj.a, obj.a, obj.a)

const jsonrStr = JSONR.stringify(obj)

jsonrStr ->

{
  "a": {
    "hello": "world",
    "foooobar"$0: 1
  },
  "b": [
    {
      "hello"$1: "world"$2,
      $0: 1
    },
    {
      $1:$2,
      $0: 1
    },
    {
      $1:$2,
      $0: 1
    }
  ]
}
```
npm package: @johfe/perfsee-package
Description: package analyzer sdk by perfsee
Latest version: 1.13.1

# `@johfe/perfsee-package`

[Repo](https://github.com/perfsee/perfsee) | [Docs](https://perfsee.com/docs)

Perfsee SDK to analyze packages and upload results to perfsee platform.

## Usage

### Analyze package and upload to platform

If there are benchmark files described below which named `xxx.bench.{js,ts}`(by default), this command will run benchmarks before uploading.

```bash
PERFSEE_TOKEN=<your-token> npx @johfe/perfsee-package <path-to-package> --project=<perfsee-project-id>
```

Environment `PERFSEE_TOKEN` and option `project` are necessary.

### Create benchmark file

Create a file named `test.bench.js` under the project.

```js
const Benchmark = require('@johfe/perfsee-package')

Benchmark('foo', () => {
  bar()
})

Benchmark('bar', [
  {
    test: () => {
      baz()
    },
    options: { name: 'baz' },
  },
  {
    test: async () => {
      await setup()
      return () => {
        quz()
      }
    },
    options: { name: 'quz with async setup' },
  },
])
```

All benchmark files will be run during the analysis phase (if target is not `browser`).

## CLI Options

### project

Id of your perfsee project on the platform.

### target: `'browser'` | `'node'`

#### default: `'node'`

If target is `browser`, benchmarks will be bundled and run in headless chrome on server.

### benchmarkPattern

#### default: `'*.{bench|benchmark}.{js|ts}'`

Glob pattern to find benchmark files.
npm package: @johfe/perfsee-sdk
Description: perfsee sdk
Latest version: 1.13.1

# `@johfe/perfsee-sdk`

> Perfsee sdk and command line tools

## Installation

```
npm install -g @johfe/perfsee-sdk
```

## Usage

### Take snapshot

Take a snapshot for all pages of the project.

```
perfsee take-snapshot -p <your-project-id> --token <your-access-token>
```

This command requires the project id from `-p, --project` and the access token
from `--token` or environment variable `PERFSEE_TOKEN`, you can create the token
from [https://perfsee.com/access-token](https://perfsee.com/access-token).

You can filter the pages by appending page names to the command.

For example take a snapshot for `Home Page` and `User Page`:

```
perfsee take-snapshot -p <your-project-id> --token <your-access-token> "Home Page" "User Page"
```

### Webhook type

This package also provides TypeScript definitions for the Perfsee webhook.

You can use it on your webhook server with the code below. Learn more in our [Webhook Guide](https://perfsee.com/docs/settings/webhook-setting).

```ts
import express from 'express'
import { WebhookEvent } from '@johfe/perfsee-sdk'

const app = express()

app.post('/callback', express.json(), function (req, res) {
  const json = req.body as WebhookEvent
  console.log(json)
})

app.listen(3001)
```

## License

This project is licensed under the [Apache-2.0 License](LICENSE).
npm package: @johfe/perfsee-treemap
Description: Web tree map chart, based on webgl.
Latest version: 1.13.1

# Treemap

Web tree map chart, based on webgl.

[![](https://user-images.githubusercontent.com/13579374/224657148-9125c3ba-6716-492e-afc9-72a102f4f2f7.png)](https://codesandbox.io/s/treemap-demo-4dehlh?file=/src/index.js)

[CodeSandbox Demo](https://codesandbox.io/s/treemap-demo-4dehlh?file=/src/index.js)

## Usage

```ts
import { hierarchy, TreeMap } from '@johfe/perfsee-treemap'

const treemapData = hierarchy({
  name: 'root',
  children: [
    {
      name: 'a',
      value: 30,
    },
    {
      name: 'b',
      value: 70,
    },
  ],
}).sum((d) => (d.children ? 0 : d.value || 0))

const treeMap = new TreeMap(canvasRef.current!, treemapData)
```

Notion:

- The `hierarchy()` function is re-export from `d3-hierarchy` module, you can find the document from [here](https://github.com/d3/d3-hierarchy).