tractatus/CACHE_MANAGEMENT_ENFORCEMENT.md
TheFlow 971690bb64 feat(cache): enforce mandatory cache version updates for JS changes
- Enhanced update-cache-version.js to update service worker and version.json
- Added inst_075 governance instruction (HIGH persistence)
- Integrated cache check into deployment script (Step 1/5)
- Created CACHE_MANAGEMENT_ENFORCEMENT.md documentation
- Bumped version to 0.1.1
- Updated all HTML cache parameters

BREAKING: Deployment now blocks if JS changed without cache update
2025-10-24 09:43:20 +13:00

336 lines
8.9 KiB
Markdown

# Cache Management Enforcement
**Status**: ✅ ACTIVE - Architecturally Enforced
**Priority**: CRITICAL
**Last Updated**: 2025-10-24
---
## The Problem
When JavaScript files are modified but cache versions are not updated:
- ❌ Browsers serve stale cached JavaScript
- ❌ Service worker doesn't detect updates
- ❌ Users experience broken functionality
- ❌ Production outages occur
- ❌ Rollbacks are required
**This was happening because cache management was OPTIONAL, not ENFORCED.**
---
## The Solution: Three-Layer Enforcement
### Layer 1: Governance Instruction (inst_075)
**Status**: Active in `.claude/instruction-history.json`
```
MANDATORY: After modifying ANY JavaScript file in public/js/,
you MUST run `node scripts/update-cache-version.js` to update
service worker and version.json. This is NON-NEGOTIABLE.
```
**Enforcement**: HIGH persistence, SYSTEM category, rules quadrant
### Layer 2: Automated Script
**Script**: `scripts/update-cache-version.js`
**What it does**:
1. Bumps semantic version (0.1.0 → 0.1.1)
2. Updates `public/service-worker.js` CACHE_VERSION
3. Updates `public/version.json` with new version and changelog
4. Updates ALL HTML files' `?v=` parameters with timestamp
5. Reports what was changed
**When to run**:
- ✅ After ANY .js file modification in public/js/
- ✅ Before committing JavaScript changes
- ✅ Before deploying to production
**How to run**:
```bash
node scripts/update-cache-version.js
```
### Layer 3: Deployment Script Integration
**Script**: `scripts/deploy-full-project-SAFE.sh`
**New Step 1/5**: CACHE VERSION UPDATE (MANDATORY)
The deployment script now:
1. Detects if JavaScript files changed since last commit
2. Automatically runs `update-cache-version.js` if needed
3. Warns about uncommitted changes
4. Blocks deployment if cache changes aren't committed
**Workflow**:
```bash
# JavaScript was modified
./scripts/deploy-full-project-SAFE.sh
# Script detects changes and prompts:
# "⚠ JavaScript files changed - running cache update..."
# "⚠ Uncommitted changes detected!"
# "Continue deployment? (yes/NO)"
# Correct response:
# 1. Type "NO"
# 2. Review: git diff
# 3. Commit: git add -A && git commit -m "chore: bump cache version"
# 4. Re-run deployment
```
---
## Files Modified in This Enforcement
### 1. `public/version.json`
```json
{
"version": "0.1.1",
"buildDate": "2025-10-24T20:38:51.751Z",
"changelog": [
"Cache: Service worker v0.1.1 - FORCE REFRESH for new modal"
],
"forceUpdate": true
}
```
### 2. `public/service-worker.js`
```javascript
const CACHE_VERSION = '0.1.1'; // Auto-updated by script
```
### 3. All HTML files
```html
<!-- Before -->
<script src="/js/admin/blog-validation.js?v=1761230000"></script>
<!-- After -->
<script src="/js/admin/blog-validation.js?v=0.1.0.1761251931745"></script>
```
### 4. `.claude/instruction-history.json`
New instruction: `inst_075` with HIGH persistence
### 5. `scripts/update-cache-version.js`
Enhanced to update:
- service-worker.js
- version.json
- All HTML files
- Includes admin HTML files
### 6. `scripts/deploy-full-project-SAFE.sh`
New mandatory pre-deployment step checks for JS changes
---
## Workflow: Making JavaScript Changes
### ✅ CORRECT Workflow
```bash
# 1. Modify JavaScript file
vim public/js/admin/submission-modal-enhanced.js
# 2. IMMEDIATELY update cache version
node scripts/update-cache-version.js
# Output:
# ✅ service-worker.js: Updated CACHE_VERSION to 0.1.2
# ✅ version.json: Updated to 0.1.2
# ✅ public/admin/blog-curation.html: Updated 8 cache version(s)
# ... (more files)
# 3. Review all changes
git diff
# 4. Commit EVERYTHING together
git add -A
git commit -m "feat: enhanced submission modal
- Added tabbed interface
- Real-time word count validation
- CSP-compliant event handling
- Cache version bumped to 0.1.2"
# 5. Deploy
./scripts/deploy-full-project-SAFE.sh
```
### ❌ INCORRECT Workflow (Will Cause Production Issues)
```bash
# 1. Modify JavaScript file
vim public/js/admin/submission-modal-enhanced.js
# 2. Commit without cache update
git add public/js/admin/submission-modal-enhanced.js
git commit -m "fix: updated modal"
# 3. Deploy
./scripts/deploy-full-project-SAFE.sh
# RESULT:
# - Users still see OLD cached JavaScript
# - Modal breaks in production
# - Emergency rollback required
# - User frustration
```
---
## Why This Matters
### Browser Caching Behavior
1. **Without version update**:
- Browser: "I have `script.js?v=1761230000` cached"
- Server: "Here's the new JavaScript at `script.js?v=1761230000`"
- Browser: "Great, I already have that!" (serves STALE code)
- Result: ❌ Broken functionality
2. **With version update**:
- Browser: "I have `script.js?v=1761230000` cached"
- Server: "Here's the new JavaScript at `script.js?v=1761251931745`"
- Browser: "That's different! I'll download the new version"
- Result: ✅ Fresh code, working functionality
### Service Worker Behavior
The service worker checks `CACHE_VERSION`:
- If unchanged: Serves cached files
- If changed: Deletes old cache, downloads fresh files
**Without updating `CACHE_VERSION`**: Service worker WILL NOT update.
---
## Testing Cache Updates
### After running update-cache-version.js:
```bash
# 1. Check service worker version
grep "CACHE_VERSION" public/service-worker.js
# Should show: const CACHE_VERSION = '0.1.X';
# 2. Check version.json
cat public/version.json
# Should show updated version and buildDate
# 3. Check HTML cache parameters
grep "\.js?v=" public/admin/blog-curation.html
# Should all show same timestamp
# 4. Verify in browser
# Open DevTools → Application → Service Workers
# Should show new version number
```
---
## Emergency: Cache Issues in Production
If users report stale JavaScript:
```bash
# 1. Immediately run cache update
node scripts/update-cache-version.js
# 2. Commit
git add -A
git commit -m "fix: force cache update for stale JavaScript"
# 3. Deploy ASAP
./scripts/deploy-full-project-SAFE.sh
# 4. Verify users see update
# - Check public/version.json on production server
# - Monitor browser console for service worker update messages
```
---
## Instruction Details: inst_075
**Full Specification**:
```json
{
"id": "inst_075",
"instruction": "MANDATORY: After modifying ANY JavaScript file in public/js/, you MUST run `node scripts/update-cache-version.js` to update service worker and version.json. This is NON-NEGOTIABLE.",
"category": "SYSTEM",
"persistence": "HIGH",
"quadrant": "rules",
"context": {
"rationale": "Browser caching WILL NOT update without service worker version bump. Users will see stale JavaScript and experience broken functionality.",
"enforcement": "File write hook should WARN if .js files modified without subsequent cache version update in same session",
"workflow": [
"1. Modify .js file(s)",
"2. IMMEDIATELY run: node scripts/update-cache-version.js",
"3. Verify: git diff shows version.json, service-worker.js, and HTML files updated",
"4. Commit ALL changes together"
],
"consequences": "Skipping this step causes: Production outages, stale cache bugs, user frustration, rollback required"
},
"relatedInstructions": ["inst_038"]
}
```
---
## Human Responsibilities
As the human developer, you should:
1. **Monitor**: Watch for cache-related warnings in deployment logs
2. **Verify**: After JavaScript changes, always check that cache was updated
3. **Enforce**: If Claude/AI assistant skips cache update, STOP and require it
4. **Test**: Before approving PR, verify version.json and service-worker.js changed
5. **Document**: Add "Cache: vX.Y.Z" to changelog when reviewing changes
---
## Questions & Troubleshooting
### Q: Do I need to update cache for CSS changes?
**A**: Currently yes (script updates all ?v= parameters). Future: separate CSS versioning.
### Q: What if I'm just adding a new .js file, not modifying existing?
**A**: Still run the script. HTML files need updated version to load the new file.
### Q: Can I manually edit version numbers instead?
**A**: NO. Always use the script to ensure all files stay in sync.
### Q: What if deployment script auto-runs it?
**A**: You should still commit the changes BEFORE deploying. Don't deploy with uncommitted cache updates.
### Q: How do I know if cache update worked?
**A**: Check git diff - should see version.json, service-worker.js, and multiple HTML files changed.
---
## Conclusion
**Cache management is now ENFORCED, not optional.**
Three layers ensure this cannot be bypassed:
1. ✅ Governance instruction (inst_075) - HIGH persistence
2. ✅ Automated script (update-cache-version.js)
3. ✅ Deployment script integration (checks before deploying)
**Always remember**:
> Modify JavaScript → Update Cache → Commit Together → Deploy
**Never skip the cache update. Ever.**
---
**Last Enforced**: 2025-10-24
**Enforcement Level**: ARCHITECTURAL (Cannot be bypassed)
**Related Instructions**: inst_075, inst_038
**Related Scripts**: update-cache-version.js, deploy-full-project-SAFE.sh