asset-optimization

Optimize and validate media delivery in the TotalCross Astro website. Use when adding or replacing raster images, animation, or video; changing Astro Image, Picture, or getImage usage; investigating asset-size or page-payload budget failures; or reviewing source-versus-generated media provenance.

Aller à l'installation

Dépôt: TotalCross/totalcross.github.io
Dernière activité de la source: 11 août 2026 à 01:38
Langue détectée de SKILL.md: anglais
Étoiles: 0
Forks: 2

Options d'installation

Le prompt qui vérifie d'abord la source est sélectionné par défaut. Vous pouvez passer à une commande directe ou télécharger une copie locale.

Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.

Une commande directe contourne le prompt de vérification. Examinez la source avant de l'exécuter.

npx skills add https://github.com/TotalCross/totalcross.github.io --skill asset-optimization

La commande reste sur une seule ligne. Faites défiler horizontalement pour la vérifier avant de la copier.

Vous préférez une copie locale ? Téléchargez les fichiers actuellement disponibles dans SkillsMP.

Vérifiez les fichiers source

Lisez SKILL.md et les fichiers associés affichés par SkillsMP avant de décider de l'installer.

Explorateur de fichiers

2 fichiers

SKILL.md

Instructions source · Aperçu en lecture seule

Retour à la recherche Retour à l’installation

license-validation

Validate and conservatively repair SPDX copyright and license metadata in the TotalCross website repository. Use when creating, moving, splitting, or relicensing files; when license CI fails; before closing a milestone that changes tracked files; or when ownership and REUSE mappings need review.

2026-08-10

logical-commits

Prepare coherent, reviewable Conventional Commits while preserving unrelated work in the TotalCross website repository. Use before staging or committing any repository change, when separating mixed diffs, or when recording an ExecPlan milestone or completed implementation slice.

2026-08-10

Tout voir dans ce dépôt

Asset optimization

Measure generated delivery, preserve provenance, and keep optimization changes tied to the page that consumes each asset.

Workflow

Read the active ExecPlan state and inspect the current asset report before editing.

Locate page references with rg; do not scan or rewrite unrelated media.

Preserve historical src/assets/** provenance under REUSE.toml. Run the license-validation skill for new derivatives or moved files.

Prefer Astro Picture for responsive AVIF/WebP photographic content, Image for optimized local images, and getImage for CSS backgrounds. Size responsive candidates from the maximum rendered CSS width multiplied by the target device pixel ratio; provide approximately 2x coverage for important imagery when the source resolution permits it. Never upscale a low-resolution source to create a fake quality improvement: obtain a better source or constrain the rendered CSS width instead. Keep intrinsic sizes, eager-load only the LCP asset, and lazy-load below-fold images.

Replace large animated GIF delivery with WebM plus MP4 fallback and a compact poster. Record deterministic conversion commands; do not add ffmpeg to normal builds.

Complete the coherent slice before final validation. Run npm run assets:test, npm run license:check, npm run workflow:check, npm run check, one fresh npm run build, npm run assets:check, then npm run validate as required by the active milestone.

Budget policy

Treat scripts/assets/budgets.mjs as canonical. Hard limits apply to generated dist/ output and representative fallback-resource proxies. Source masters remain report-only when normal page delivery is transformed. Keep warnings visible; add a reviewed path-specific exception only when measured visual quality justifies one.