image-optimization-helper

Image Optimization Helper - Auto-activating skill for Frontend Development. Triggers on: image optimization helper, image optimization helper Part of the Frontend Development skill category.

1.01x

Quality

Does it follow best practices?

Impact

92%

1.01x

Average score across 3 eval scenarios

Securityby

Passed

No known issues

Optimize this skill with Tessl

npx tessl skill review --optimize ./planned-skills/generated/05-frontend-dev/image-optimization-helper/SKILL.md

Evaluation results

100%

17%

E-Commerce Product Gallery Performance

React image optimization with best practices

Criteria

Without context

With context

Lazy loading applied

100%

Modern image format support

100%

Responsive image sizing

100%

Layout shift prevention

100%

Production-ready component

100%

React-idiomatic patterns

80%

100%

Performance documentation

100%

Validation or standards reference

50%

100%

Alt text preserved

100%

Step-by-step guidance

100%

Without context: $0.1966 · 57s · 12 turns · 13 in / 2,772 out tokens

With context: $0.4669 · 1m 59s · 26 turns · 25 in / 6,220 out tokens

100%

Photography Portfolio Image Performance Overhaul

Vue image optimization with guided workflow

Criteria

Without context

With context

Vue-idiomatic syntax

100%

Lazy loading in grid

100%

Hero image eagerness

100%

Modern format usage

100%

Responsive image technique

100%

Dimension stability

100%

Step-by-step workflow

100%

Workflow covers compression

100%

Validation guidance

100%

Production-ready components

100%

Alt text preserved

100%

Without context: $0.4625 · 2m 12s · 20 turns · 21 in / 7,747 out tokens

With context: $0.4802 · 2m 13s · 24 turns · 313 in / 7,169 out tokens

78%

-12%

Nonprofit Website Image Accessibility and Performance Audit

Accessible CSS image optimization and validation

Criteria

Without context

With context

Decorative background role

80%

60%

Content image alt text

100%

Team member alt text

100%

Sponsor logo alt text

100%

Lazy loading for below-fold images

100%

Team image dimensions

100%

Modern format reference

Step-by-step audit structure

100%

Accessibility standards validation

100%

Performance improvement documented

100%

Production-ready HTML/CSS output

100%

Without context: $0.4752 · 2m 31s · 19 turns · 20 in / 8,669 out tokens

With context: $0.5807 · 2m 32s · 26 turns · 28 in / 8,810 out tokens

Repository: jeremylongshore/claude-code-plugins-plus-skills
Commit: 994edc4

Evaluated: 17 days ago
Agent: Claude Code
Model: Claude Sonnet 4.6

Table of Contents

E-Commerce Product Gallery Performance Photography Portfolio Image Performance Overhaul Nonprofit Website Image Accessibility and Performance Audit

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.