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 FID, CLS, and LCP.

Getting Started

Requires Storybook 6.1 or later

First, install the addon

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

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

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

See toolbar for feedback

Name		Name	Last commit message	Last commit date
Latest commit History 48 Commits
.github		.github
.storybook		.storybook
src		src
stories		stories
.all-contributorsrc		.all-contributorsrc
.babelrc.js		.babelrc.js
.gitignore		.gitignore
.nvmrc		.nvmrc
CHANGELOG.md		CHANGELOG.md
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
CONTRIBUTING.md		CONTRIBUTING.md
LICENSE		LICENSE
README.md		README.md
SECURITY.md		SECURITY.md
package-lock.json		package-lock.json
package.json		package.json
preset.js		preset.js