Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/andersonba/puppeteer-assets
Measuring and monitor assets metrics using Puppeteer and Prometheus
https://github.com/andersonba/puppeteer-assets
assets grafana metrics monitoring prometheus puppeteer
Last synced: 2 months ago
JSON representation
Measuring and monitor assets metrics using Puppeteer and Prometheus
- Host: GitHub
- URL: https://github.com/andersonba/puppeteer-assets
- Owner: andersonba
- License: mit
- Created: 2018-03-25T14:31:19.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T22:23:42.000Z (almost 2 years ago)
- Last Synced: 2024-09-30T08:02:55.769Z (3 months ago)
- Topics: assets, grafana, metrics, monitoring, prometheus, puppeteer
- Language: JavaScript
- Homepage:
- Size: 3.02 MB
- Stars: 28
- Watchers: 3
- Forks: 4
- Open Issues: 16
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Puppeteer Assets [](https://badge.fury.io/js/puppeteer-assets) [](https://travis-ci.org/andersonba/puppeteer-assets)
> Measuring your assets with metrics using [Puppeteer](https://github.com/googlechrome/puppeteer).
Want to know which scripts are loaded in your page? This module allows you to extract and audit the metrics.
## Install
```bash
yarn add puppeteer-assets
```
## Usage
Using CLI
```bash
puppeteer-assets www.google.com
```
Advanced usage:
```bash
puppeteer-assets www.google.com -t javascript -t css --ignore gooogle-analytics
```
Run `puppeteer-assets --help` to more options.
Using on Node.js
```javascript
import assetsMetrics from 'puppeteer-assets';
await assetsMetrics('https://www.andersonba.com');
{
assets: {
'https://www.andersonba.com/scripts/main.js': {
mimeType: 'javascript',
rawMimeType: 'application/javascript',
type: 'internal',
gzip: 1621,
size: 1621
},
'https://www.andersonba.com/scripts/vendor.js': {
mimeType: 'javascript',
rawMimeType: 'application/javascript',
type: 'internal',
gzip: 213438,
size: 213438
},
'https://www.google-analytics.com/analytics.js': {
mimeType: 'javascript',
rawMimeType: 'text/javascript',
type: 'external',
gzip: 0,
size: 44470
}
},
count: {
internal: { total: 2, javascript: 2 },
external: { total: 1, javascript: 1 },
total: 3
},
size: {
internal: { total: 215059, javascript: 215059 },
external: { total: 44470, javascript: 44470 },
total: 259529
},
gzip: {
internal: { total: 215059, javascript: 215059 },
external: { total: 0, javascript: 0 },
total: 215059
}
}
```
## Prometheus
Explore and monitor your assets metrics using [Prometheus](https://prometheus.io) and [Grafana](https://grafana.com).
You need to configure a webservice to be the Prometheus target.
You can use the [official built-in server](./prometheus/README.md).
## Reference API
#### `assetsMetrics(url, options)`
| Parameter | Description | Type | Default |
| -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------- | ---------------------------------------------- |
| `url` | **Required.** Page URL | `string` |
| `options.mimeTypes` | MimeTypes to be filtered in the metrics. You can use mapped mimeTypes from `options.mimeTypePatterns` | `Array ` | `['javascript']` |
| `options.mimeTypePatterns` | Map the mimeTypes based on regex patterns | `Array` | `{ javascript: ['javascript'], css: ['css'] }` |
| `options.ignorePatterns` | Ignore assets based on regex patterns | `Array` | `[]` |
| `options.internalPatterns` | Mark asset as internal type based on regex patterns | `Array` | `[/^(\/\|.\/)/]` |
| `options.cookies` | Define cookies on the browser using the standard cookie format. Fields `name` and `value` are required in the string. Example: `name=current_user; value=123456; domain=andersonba.com; path=/`. | `Array` | `[]` |
| `options.userAgent` | Define the userAgent to the browser | `string` |