npmpackage.info

Gathering detailed insights and metrics for @washingtonpost/storybook-addon-web-vitals

Gathering detailed insights and metrics for @washingtonpost/storybook-addon-web-vitals

@washingtonpost/storybook-addon-web-vitals - 0.4.0 | npmpackage.info

@washingtonpost/storybook-addon-web-vitals

A storybook addon for instant feedback on loading, interactivity, and layout shift metrics.

0.4.0

2

MIT

JavaScript

6.40 kB

Installations

npm install @washingtonpost/storybook-addon-web-vitals

Developer Guide

BETA

Typescript

No

Module System

CommonJS

Node Version

22.13.1

NPM Version

10.9.2

Score

70

Supply Chain

74.7

Quality

87.2

Maintenance

100

Vulnerability

100

License

Pull Requests

Open

3

Total

35

Closed

27

Merged

5

Issues

Open

1

Total

2

Closed

1

Releases

6

v0.4.0

Updated on Feb 26, 2025

v0.3.0

Updated on Mar 08, 2022

v0.2.1

Updated on Dec 23, 2021

v0.2.0

Updated on Dec 23, 2021

v0.1.1

Updated on Jan 15, 2021

v0.1.0

Updated on Jan 15, 2021

View All 6 releases

Languages

1

JavaScript

JavaScript (100%)

Developer

Download Statistics

Total Downloads

153,650

Last Day

1

Last Week

95

Last Month

480

Last Year

9,770

GitHub Statistics

MIT License

2 Stars

61 Commits

1 Forks

17 Watchers

4 Branches

5 Contributors

Updated on Feb 26, 2025

Bundle Size

20.02 kB

Minified

6.40 kB

Minified + Gzipped

Bundlephobia

Maintainers

235

View All 5 Contributors

Package Meta Information

Latest Version

0.4.0

Package Id

@washingtonpost/storybook-addon-web-vitals@0.4.0

Unpacked Size

16.94 kB

Size

5.71 kB

File Count

11

NPM Version

10.9.2

Node Version

22.13.1

Published on

Feb 26, 2025

Total Downloads

Cumulative downloads

Total Downloads

153,650

Last Day

0%

1

Compared to previous day

Last Week

-31.7%

95

Compared to previous week

Last Month

-21.2%

480

Compared to previous month

Last Year

-63.7%

9,770

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Storybook Addon Web Vitals

Storybook Addon Web Vitals can be used for instant feedback on loading, interactivity, and layout shift metric for each story. We use the web-vitals.

We report on INP, CLS, and LCP.

React Storybook Screenshot

Getting Started

Requires Storybook 8

First, install the addon

1npm i -D @washingtonpost/storybook-addon-web-vitals

Then, add following content to .storybook/main.js:

1module.exports = {
2  addons: ["@washingtonpost/storybook-addon-web-vitals"],
3};

Usage

See toolbar for feedback on INP, CLS and LCP

CLS changes will highlight offending elements based on results from web-vitals

New results are logged to the console as they come in to provide the full data object from web-vitals

Empty State

No vulnerabilities found.

Empty State

No security vulnerabilities found.