Site Quality

Quality overview

Performance

Lighthouse measures the deployable production build (the static output in dist/) by serving it through a temporary local server during the build pipeline. The route labels below are paths on that built site. These are lab measurements of the deployment candidate, not production Core Web Vitals and not live-network performance.

The CI pipeline enforces a Lighthouse performance budget: performance ≥ 95, accessibility ≥ 95, SEO ≥ 100, best-practices ≥ 95. See lighthouserc.js.

Production bundle

Bundle figures are from the Astro-only production build in dist/. Storybook assets under /design-system/lab/ are measured separately and are never loaded by ordinary site pages.

JavaScript files present in the deployment

These are all JavaScript files present in dist/ (source maps excluded). Not every file is loaded by every route. See the route-measurement tables below for per-page behavior.

All JavaScript files present in the Astro-only dist/ directory (source maps excluded). Not all files are loaded by every route. See routeMeasurements below for per-page loading behavior.

Route-level JavaScript references

Each row shows which JavaScript assets a route’s generated HTML references, their total size, and estimated inline script bytes.

Feature-specific assets

Component lab (Storybook)

The Storybook application at /design-system/lab/ is a separate application. Its JavaScript is not loaded by ordinary blog pages. The isolation verification below confirms this.

Storybook isolation

Storybook is built as a separate static application and copied intodist/design-system/lab/ during deployment. It is not part of the Astro build graph and is not imported by any production component.

static scan of JS/CSS files excluding dist/design-system/lab/ and confirmed by Playwright network-interception tests in tests/storybook-isolation.spec.ts.

The Storybook bundle is approximately 7.5 MB(uncompressed). This is the weight of a design-system development tool, not the blog. It is served only to users who explicitly visit/design-system/lab/.

Accessibility verification

Automated accessibility checks run against every Storybook component story and every primary site route. The tests use axe-core through Playwright. Results come from the last pnpm test:e2e run.

Component system (Storybook)

The component lab at /design-system/lab/documents every reusable Astro component in the KISS Design System. Stories cover default states, edge cases (long labels, narrow viewports), and fixture-backed composite layouts.

See the KISS Design System reference for component documentation, design tokens, and usage guidelines.

Build and validation

The following commands protect the site. Most run in CI on every push to main.

GitHub Actions on push to main. See .github/workflows/astro.yml.

Measurement limitations

• Lighthouse is a lab measurement. Results vary by environment, device, and network conditions.
• Automated accessibility tools detect only a subset of WCAG criteria. They do not replace manual review.
• Storybook accessibility tests check isolated components, not complete user journeys or page layouts.
• A passing build pipeline does not measure usability, content quality, or design consistency.
• Production Core Web Vitals require real-user monitoring (RUM) data, which this site does not currently collect.
• Static file sizes are raw bytes from the build output. Actual transfer size depends on hosting compression, cache state, and HTTP version.
• Browser-measured transfer sizes require running Playwright network-capture tests against a local preview.
• Storybook bundle weight is measured separately and is not loaded by ordinary blog pages.
• Route-level JavaScript is determined by inspecting generated HTML for <script> references. Dynamic or lazy-loaded scripts are not captured.
• Pagefind assets are present in the deployment but only requested by /search/.
• Partytown worker scripts are present in the deployment but loaded lazily by the Partytown library.
• Inline script bytes are estimated from HTML content. They exclude server-rendered JSON-LD and inline styles.

Methodology