css-production-cache-debug

Diagnose production CSS breakage from stale caches and template mismatches.

5|Updated Jun 3, 2026

Search Tags:#debugging #production #css #cloudflare #express #ejs #cache busting

Ready to run

npx skills add https://github.com/rafael-fae/agent-ops-worflow --skill css-production-cache-debug

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: css-production-cache-debug
Source: https://github.com/rafael-fae/agent-ops-worflow/tree/main/archive/skills/devops/css-production-cache-debug
Command: npx skills add https://github.com/rafael-fae/agent-ops-worflow --skill css-production-cache-debug

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps diagnose and fix CSS changes that do not appear in production, especially when cache layers, template versioning, or missing style rules cause pages to render incorrectly.

Core Features & Use Cases

Production Cache Diagnosis: Checks origin CSS, CDN cache status, and template cache-busting values to find where stale styles are being served.
Style Regression Recovery: Identifies missing classes and restores broken layouts, buttons, cards, syntax highlighting, and other shared UI elements.
Safe Change Workflow: Reinforces a disciplined process for updating CSS across multiple pages, including version bumps, restarts, and full-page verification.
Use Case: A site deploys a new stylesheet, but the homepage still looks broken in Cloudflare; this Skill guides the investigation and verification needed to make the update visible everywhere.

Quick Start

Use this skill to troubleshoot why my production CSS changes are not appearing and give me the exact checks and fixes to verify the origin, cache, and template version.

Frequently Asked Questions about css-production-cache-debug

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

Why does my production CSS not update after a deploy behind Cloudflare?▼

Production CSS not updating is typically caused by stale CDN cache layers serving old stylesheets instead of the origin's latest version. This requires validating cache-busting headers, checking origin CSS, and verifying template versioning to restore consistent rendering.

How do I debug broken CSS layouts in an Express and EJS site?▼

Debugging broken CSS in Express and EJS involves auditing missing style classes and checking for template version mismatches after a stylesheet edit. You must verify cache-busting values and perform end-to-end page verification to identify divergent layouts.

What is the best way to implement cache busting for CSS changes in production?▼

The best way to implement cache busting for CSS changes is following a disciplined workflow of version bumps, server restarts, and full-page verification. This ensures origin updates are recognized by CDN layers and served correctly across homepage and post layouts.

How do I fix broken buttons and cards when my stylesheet changes do not appear?▼

Fixing broken buttons and cards requires style regression recovery to identify missing CSS classes. You must diagnose whether stale cache or template version mismatches are preventing stylesheet updates from rendering shared UI elements correctly.

Can I use this cache debugging process for sites without Cloudflare?▼

Yes, this cache debugging process applies to Express and EJS sites behind Cloudflare or similar CDN layers. It diagnoses production CSS breakage by checking origin styles, CDN cache status, and template cache-busting values regardless of the specific CDN provider.

How do I verify if a CDN is serving stale CSS instead of the origin file?▼

To verify if a CDN is serving stale CSS, you must check the origin CSS file directly, inspect the CDN cache status, and validate template cache-busting values. This end-to-end page verification identifies exactly where stale styles are being served.