$ show catchpoint/WebPageTest.docs
The WebPageTest documentation repository serves as the source for generating the official WebPageTest documentation website. Built with Eleventy, a modern static site generator, it transforms Markdown content into HTML with various optimizations including syntax highlighting, automatic table of contents generation, and image processing to prevent Cumulative Layout Shift. The site follows a standard Eleventy architecture with content stored in Markdown files under /src, reusable components and layouts in /_includes, and site data in /_data. The .eleventy.js file configures the Eleventy instance with plugins for navigation, syntax highlighting, table of contents, and custom image dimension processing. Netlify functions handle specific integrations like deploying succeeded test notifications and retrieving latest test URLs. Key external dependencies include Eleventy and its plugins (@11ty/eleventy-navigation, @11ty/eleventy-plugin-syntaxhighlight, eleventy-plugin-nesting-toc), image processing libraries (clean-css, terser, image-size, jsdom), and deployment via Netlify. The repository demonstrates good practices in dependency management, modular structure, and includes a reusable Eleventy plugin for automatic image dimension addition that solves a common web performance issue.
The LLM identified 1 files worth highlighting for reuse:
Eleventy plugin that automatically adds width and height attributes to images in HTML output to prevent Cumulative Layout Shift (CLS). Processes local images by resolving paths and reading dimensions, ignores remote images, and gracefully handles errors. Demonstrates skill in DOM manipulation with JSDOM and async image processing.