Progressive Tooling

An accessibility visualization toolkit

CSS file that provides warnings for possible risks and mistakes and can help evaluate a site's quality

Color combination contrast tester

Automated accessibility testing using HTML CodeSniffer

Warns about potential accessibility issues with your React elements

A library of accessibility-related testing and utility code

An automated accessibility testing tool which crawls and tests pages to produce detailed reports

Run tests on actual devices with different locations, browsers, and connection speeds

An open-source auditing tool that you can use to test and improve your webpage

Track and monitor performance of webpages during ongoing development

A devtool for inspecting the performance of React Components

A devtool for inspecting the performance of Vue Components

Monitor web performance and how real users experience your site

Service by Netlify that rates your site based on its initial global load times and its security settings

An easy way to measure site performance across devices powered by WebPageTest

Get speed field data and suggestions for optimization improvements

Compare your mobile site speed with 10 other domains as well as estimate your revenue impact

Generate a node map visualization of all third-party interactions

Linting tool that can help improve accessibility, speed and more by checking for best practices

Progressive web metrics at your fingertipz

Google PageSpeed Reports sent directly to your inbox every week

A tool for speed and SEO optimization checks and guides

Find the cost of adding a npm package to your bundle

Visual Studio Code extension that displays the size of imported packages inline

Visualize the size of webpack output files with a treemap

Visualize the size of parcel output files with a treemap

CLI dashboard for your webpack dev server

Electron Desktop GUI for Webpack Dashboard

An intelligent browser-based Webpack dashboard

An online visualization tool for webpack bundles

Analyze and debug code bloat through source maps

Tool to help you find source code duplication across your javascript chunks/splits

Tool for monitoring webpack optimization metrics through the development process

Interactive pie chart for webpack stats

Keep an eye on your bundle size through a CI hook

Prevent library bloat by having error checks when including large dependencies

Automatically track the size of your build artifacts with a CircleCI integration

Minify images seamlessly

Reduce JPEG file sizes while retaining quality and compatibility

Save disk space & bandwidth by compressing images without losing quality

A GUI tool for losslessly optimizing PNG and JPG files

A free tool for optimizing JPEG and PNG files

Convert videos from live sources and resize them on the fly

Higher order component for loading components with dynamic imports

A fast, flexible, and small image lazy loader

High performance and SEO friendly lazy loader for images, iframes and more

Detect if a DOM element intersects with another element such as the document viewport

Split bundles for lazy loading using entry points or dynamic imports

Use dynamic imports to split application code into separate bundles

Set of tools that simplify process of caching assets

Tiny JavaScript library that makes sure your users can always access your site's content

A webpack plugin that uses ServiceWorker (and AppCache) to provide an offline experience

Node module to generate a ServiceWorker that will precache specific resources

Collection of service worker tools for offlining runtime requests

Minimize flash of unstyled text by comparing between a fallback and an intended font

Track download progress and define lazy loading behavior of font faces

Control how a font is displayed while it is still being fetched

A fast and simple web font loader

Universal javascript support for Angular

Zero-configuration framework-agnostic static prerendering for SPAs

React.js server-side rendering optimization with component memoization and templatization

Create a Preact PWA quickly with built-in pre-rendering

Add server-side rendering capabilities to a web server using Headless Chrome

Libraries and tools for enabling data-driven user-experiences on the web