@rankcli/agent-runtime 0.0.14 → 0.0.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (199) hide show
  1. package/dist/index.d.mts +77 -393
  2. package/dist/index.d.ts +77 -393
  3. package/dist/index.js +417 -6443
  4. package/dist/index.mjs +296 -6313
  5. package/package.json +6 -1
  6. package/scripts/build-deno.ts +0 -134
  7. package/src/analyzers/core-web-vitals-analyzer.test.ts +0 -236
  8. package/src/analyzers/core-web-vitals-analyzer.ts +0 -557
  9. package/src/analyzers/geo-analyzer.test.ts +0 -310
  10. package/src/analyzers/geo-analyzer.ts +0 -814
  11. package/src/analyzers/image-optimization-analyzer.test.ts +0 -145
  12. package/src/analyzers/image-optimization-analyzer.ts +0 -348
  13. package/src/analyzers/index.ts +0 -233
  14. package/src/analyzers/internal-linking-analyzer.test.ts +0 -141
  15. package/src/analyzers/internal-linking-analyzer.ts +0 -419
  16. package/src/analyzers/mobile-seo-analyzer.test.ts +0 -140
  17. package/src/analyzers/mobile-seo-analyzer.ts +0 -455
  18. package/src/analyzers/security-headers-analyzer.test.ts +0 -115
  19. package/src/analyzers/security-headers-analyzer.ts +0 -318
  20. package/src/analyzers/structured-data-analyzer.test.ts +0 -210
  21. package/src/analyzers/structured-data-analyzer.ts +0 -590
  22. package/src/audit/ai/analyzer.ts +0 -347
  23. package/src/audit/ai/index.ts +0 -29
  24. package/src/audit/ai/prompts/content-analysis.ts +0 -271
  25. package/src/audit/ai/types.ts +0 -179
  26. package/src/audit/checks/additional-checks.ts +0 -439
  27. package/src/audit/checks/ai-citation-worthiness.ts +0 -399
  28. package/src/audit/checks/ai-content-structure.ts +0 -325
  29. package/src/audit/checks/ai-readiness.ts +0 -339
  30. package/src/audit/checks/anchor-text.ts +0 -179
  31. package/src/audit/checks/answer-conciseness.ts +0 -322
  32. package/src/audit/checks/asset-minification.ts +0 -270
  33. package/src/audit/checks/bing-optimization.ts +0 -206
  34. package/src/audit/checks/brand-mention-optimization.ts +0 -349
  35. package/src/audit/checks/caching-headers.ts +0 -305
  36. package/src/audit/checks/canonical-advanced.ts +0 -150
  37. package/src/audit/checks/canonical-domain.ts +0 -196
  38. package/src/audit/checks/citation-quality.ts +0 -358
  39. package/src/audit/checks/client-rendering.ts +0 -542
  40. package/src/audit/checks/color-contrast.ts +0 -342
  41. package/src/audit/checks/content-freshness.ts +0 -170
  42. package/src/audit/checks/content-science.ts +0 -589
  43. package/src/audit/checks/conversion-elements.ts +0 -526
  44. package/src/audit/checks/crawlability.ts +0 -220
  45. package/src/audit/checks/directory-listing.ts +0 -172
  46. package/src/audit/checks/dom-analysis.ts +0 -191
  47. package/src/audit/checks/dom-size.ts +0 -246
  48. package/src/audit/checks/duplicate-content.ts +0 -194
  49. package/src/audit/checks/eeat-signals.ts +0 -990
  50. package/src/audit/checks/entity-seo.ts +0 -396
  51. package/src/audit/checks/featured-snippet.ts +0 -473
  52. package/src/audit/checks/freshness-signals.ts +0 -443
  53. package/src/audit/checks/funnel-intent.ts +0 -463
  54. package/src/audit/checks/hreflang.ts +0 -174
  55. package/src/audit/checks/html-compliance.ts +0 -302
  56. package/src/audit/checks/image-dimensions.ts +0 -167
  57. package/src/audit/checks/images.ts +0 -160
  58. package/src/audit/checks/indexnow.ts +0 -275
  59. package/src/audit/checks/interactive-tools.ts +0 -475
  60. package/src/audit/checks/internal-link-graph.ts +0 -436
  61. package/src/audit/checks/keyword-analysis.ts +0 -239
  62. package/src/audit/checks/keyword-cannibalization.ts +0 -385
  63. package/src/audit/checks/keyword-placement.ts +0 -471
  64. package/src/audit/checks/links.ts +0 -273
  65. package/src/audit/checks/llms-txt.ts +0 -224
  66. package/src/audit/checks/local-seo.ts +0 -296
  67. package/src/audit/checks/mobile.ts +0 -167
  68. package/src/audit/checks/modern-images.ts +0 -226
  69. package/src/audit/checks/navboost-signals.ts +0 -395
  70. package/src/audit/checks/on-page.ts +0 -209
  71. package/src/audit/checks/page-resources.ts +0 -285
  72. package/src/audit/checks/pagination.ts +0 -180
  73. package/src/audit/checks/performance.ts +0 -153
  74. package/src/audit/checks/platform-presence.ts +0 -580
  75. package/src/audit/checks/redirect-analysis.ts +0 -153
  76. package/src/audit/checks/redirect-chain.ts +0 -389
  77. package/src/audit/checks/resource-hints.ts +0 -420
  78. package/src/audit/checks/responsive-css.ts +0 -247
  79. package/src/audit/checks/responsive-images.ts +0 -396
  80. package/src/audit/checks/review-ecosystem.ts +0 -415
  81. package/src/audit/checks/robots-validation.ts +0 -373
  82. package/src/audit/checks/security-headers.ts +0 -188
  83. package/src/audit/checks/security.ts +0 -144
  84. package/src/audit/checks/serp-preview.ts +0 -251
  85. package/src/audit/checks/site-maturity.ts +0 -453
  86. package/src/audit/checks/social-meta.test.ts +0 -275
  87. package/src/audit/checks/social-meta.ts +0 -134
  88. package/src/audit/checks/soft-404.ts +0 -151
  89. package/src/audit/checks/structured-data.ts +0 -238
  90. package/src/audit/checks/tech-detection.ts +0 -496
  91. package/src/audit/checks/topical-clusters.ts +0 -435
  92. package/src/audit/checks/tracker-bloat.ts +0 -462
  93. package/src/audit/checks/tracking-verification.test.ts +0 -371
  94. package/src/audit/checks/tracking-verification.ts +0 -636
  95. package/src/audit/checks/url-safety.ts +0 -682
  96. package/src/audit/deno-entry.ts +0 -66
  97. package/src/audit/discovery/index.ts +0 -15
  98. package/src/audit/discovery/link-crawler.ts +0 -233
  99. package/src/audit/discovery/repo-routes.ts +0 -347
  100. package/src/audit/engine.ts +0 -627
  101. package/src/audit/fixes/index.ts +0 -209
  102. package/src/audit/fixes/social-meta-fixes.test.ts +0 -329
  103. package/src/audit/fixes/social-meta-fixes.ts +0 -463
  104. package/src/audit/index.ts +0 -74
  105. package/src/audit/runner.test.ts +0 -299
  106. package/src/audit/runner.ts +0 -130
  107. package/src/audit/types.ts +0 -1963
  108. package/src/content/featured-snippet.ts +0 -367
  109. package/src/content/generator.test.ts +0 -534
  110. package/src/content/generator.ts +0 -501
  111. package/src/content/headline.ts +0 -317
  112. package/src/content/index.ts +0 -62
  113. package/src/content/intent.ts +0 -258
  114. package/src/content/keyword-density.ts +0 -349
  115. package/src/content/readability.ts +0 -262
  116. package/src/executor.ts +0 -336
  117. package/src/fixer/framework-fixes.test.ts +0 -489
  118. package/src/fixer/framework-fixes.ts +0 -5287
  119. package/src/fixer/index.ts +0 -6
  120. package/src/fixer/schemas.ts +0 -971
  121. package/src/fixer.ts +0 -642
  122. package/src/frameworks/detector.test.ts +0 -248
  123. package/src/frameworks/detector.ts +0 -899
  124. package/src/frameworks/index.ts +0 -68
  125. package/src/frameworks/recipes/angular.yaml +0 -171
  126. package/src/frameworks/recipes/astro.yaml +0 -206
  127. package/src/frameworks/recipes/django.yaml +0 -180
  128. package/src/frameworks/recipes/laravel.yaml +0 -137
  129. package/src/frameworks/recipes/nextjs.yaml +0 -268
  130. package/src/frameworks/recipes/nuxt.yaml +0 -175
  131. package/src/frameworks/recipes/rails.yaml +0 -188
  132. package/src/frameworks/recipes/react.yaml +0 -202
  133. package/src/frameworks/recipes/sveltekit.yaml +0 -154
  134. package/src/frameworks/recipes/vue.yaml +0 -137
  135. package/src/frameworks/recipes/wordpress.yaml +0 -209
  136. package/src/frameworks/suggestion-engine.ts +0 -357
  137. package/src/geo/geo-content.test.ts +0 -305
  138. package/src/geo/geo-content.ts +0 -266
  139. package/src/geo/geo-history.test.ts +0 -473
  140. package/src/geo/geo-history.ts +0 -433
  141. package/src/geo/geo-tracker.test.ts +0 -359
  142. package/src/geo/geo-tracker.ts +0 -411
  143. package/src/geo/index.ts +0 -11
  144. package/src/geo/llm-citation-checker.ts +0 -188
  145. package/src/git/commit-helper.test.ts +0 -261
  146. package/src/git/commit-helper.ts +0 -329
  147. package/src/git/index.ts +0 -12
  148. package/src/git/pr-helper.test.ts +0 -284
  149. package/src/git/pr-helper.ts +0 -307
  150. package/src/index.ts +0 -76
  151. package/src/keywords/ai-keyword-engine.ts +0 -1062
  152. package/src/keywords/ai-summarizer.ts +0 -387
  153. package/src/keywords/ci-mode.ts +0 -555
  154. package/src/keywords/engine.ts +0 -359
  155. package/src/keywords/index.ts +0 -151
  156. package/src/keywords/llm-judge.ts +0 -357
  157. package/src/keywords/nlp-analysis.ts +0 -706
  158. package/src/keywords/prioritizer.ts +0 -295
  159. package/src/keywords/site-crawler.ts +0 -342
  160. package/src/keywords/sources/autocomplete.ts +0 -139
  161. package/src/keywords/sources/competitive-search.ts +0 -450
  162. package/src/keywords/sources/competitor-analysis.ts +0 -374
  163. package/src/keywords/sources/dataforseo.ts +0 -206
  164. package/src/keywords/sources/free-sources.ts +0 -294
  165. package/src/keywords/sources/gsc.ts +0 -123
  166. package/src/keywords/topic-grouping.ts +0 -327
  167. package/src/keywords/types.ts +0 -144
  168. package/src/keywords/wizard.ts +0 -457
  169. package/src/loader.ts +0 -40
  170. package/src/ranking/index.ts +0 -5
  171. package/src/ranking/serp-client.ts +0 -348
  172. package/src/ranking/tracker.ts +0 -380
  173. package/src/ranking/types.ts +0 -123
  174. package/src/reports/index.ts +0 -7
  175. package/src/reports/report-generator.test.ts +0 -293
  176. package/src/reports/report-generator.ts +0 -713
  177. package/src/scheduler/alerts.test.ts +0 -458
  178. package/src/scheduler/alerts.ts +0 -328
  179. package/src/scheduler/index.ts +0 -8
  180. package/src/scheduler/scheduled-audit.test.ts +0 -377
  181. package/src/scheduler/scheduled-audit.ts +0 -149
  182. package/src/test/integration-test.ts +0 -325
  183. package/src/tools/analyzer.ts +0 -373
  184. package/src/tools/crawl.ts +0 -293
  185. package/src/tools/files.ts +0 -301
  186. package/src/tools/h1-fixer.ts +0 -249
  187. package/src/tools/index.ts +0 -67
  188. package/src/tracking/github-action.ts +0 -326
  189. package/src/tracking/google-analytics.ts +0 -265
  190. package/src/tracking/index.ts +0 -45
  191. package/src/tracking/report-generator.ts +0 -386
  192. package/src/tracking/search-console.ts +0 -335
  193. package/src/types.ts +0 -148
  194. package/src/utils/http.ts +0 -302
  195. package/src/wasm-adapter.ts +0 -297
  196. package/src/wasm-entry.ts +0 -14
  197. package/tsconfig.json +0 -17
  198. package/tsup.wasm.config.ts +0 -26
  199. package/vitest.config.ts +0 -15
@@ -1,145 +0,0 @@
1
- import { describe, it, expect } from 'vitest';
2
- import { analyzeImages, generateResponsiveImage } from './image-optimization-analyzer.js';
3
-
4
- describe('Image Optimization Analyzer', () => {
5
- describe('analyzeImages', () => {
6
- it('detects images with alt text', () => {
7
- const html = `
8
- <html><body>
9
- <img src="/photo1.jpg" alt="A beautiful sunset">
10
- <img src="/photo2.jpg" alt="Mountain landscape">
11
- </body></html>
12
- `;
13
- const result = analyzeImages(html, 'https://example.com');
14
- expect(result.totalImages).toBe(2);
15
- expect(result.imagesWithAlt).toBe(2);
16
- });
17
-
18
- it('detects images without alt text', () => {
19
- const html = `
20
- <html><body>
21
- <img src="/photo1.jpg">
22
- <img src="/photo2.jpg" alt="Has alt">
23
- </body></html>
24
- `;
25
- const result = analyzeImages(html, 'https://example.com');
26
- expect(result.missingAlt.length).toBe(1);
27
- expect(result.issues.some(i => i.code === 'IMG_MISSING_ALT')).toBe(true);
28
- });
29
-
30
- it('detects images with dimensions', () => {
31
- const html = `
32
- <html><body>
33
- <img src="/photo.jpg" alt="Test" width="800" height="600">
34
- </body></html>
35
- `;
36
- const result = analyzeImages(html, 'https://example.com');
37
- expect(result.imagesWithDimensions).toBe(1);
38
- });
39
-
40
- it('detects images without dimensions', () => {
41
- const html = `
42
- <html><body>
43
- <img src="/photo1.jpg" alt="Test">
44
- <img src="/photo2.jpg" alt="Test">
45
- </body></html>
46
- `;
47
- const result = analyzeImages(html, 'https://example.com');
48
- expect(result.issues.some(i => i.code === 'IMG_MISSING_DIMENSIONS')).toBe(true);
49
- });
50
-
51
- it('detects modern image formats', () => {
52
- const html = `
53
- <html><body>
54
- <img src="/photo.webp" alt="Test" width="800" height="600">
55
- <img src="/photo.avif" alt="Test" width="800" height="600">
56
- </body></html>
57
- `;
58
- const result = analyzeImages(html, 'https://example.com');
59
- expect(result.modernFormats).toBe(2);
60
- expect(result.legacyFormats).toBe(0);
61
- });
62
-
63
- it('detects legacy image formats', () => {
64
- const html = `
65
- <html><body>
66
- <img src="/photo.jpg" alt="Test" width="800" height="600">
67
- <img src="/photo.png" alt="Test" width="800" height="600">
68
- </body></html>
69
- `;
70
- const result = analyzeImages(html, 'https://example.com');
71
- expect(result.legacyFormats).toBe(2);
72
- expect(result.issues.some(i => i.code === 'IMG_NO_MODERN_FORMATS')).toBe(true);
73
- });
74
-
75
- it('detects lazy loading', () => {
76
- const html = `
77
- <html><body>
78
- <img src="/photo1.jpg" alt="Test" loading="lazy">
79
- <img src="/photo2.jpg" alt="Test">
80
- </body></html>
81
- `;
82
- const result = analyzeImages(html, 'https://example.com');
83
- expect(result.imagesWithLazyLoading).toBe(1);
84
- });
85
-
86
- it('warns about lazy loading hero images', () => {
87
- const html = `
88
- <html><body>
89
- <img src="/hero.jpg" alt="Hero" loading="lazy" width="1200" height="600">
90
- </body></html>
91
- `;
92
- const result = analyzeImages(html, 'https://example.com');
93
- expect(result.issues.some(i => i.code === 'IMG_HERO_LAZY')).toBe(true);
94
- });
95
-
96
- it('accepts decorative images with empty alt', () => {
97
- const html = `
98
- <html><body>
99
- <img src="/decoration.png" alt="" role="presentation">
100
- </body></html>
101
- `;
102
- const result = analyzeImages(html, 'https://example.com');
103
- expect(result.imagesWithAlt).toBe(1);
104
- expect(result.decorativeWithoutRole.length).toBe(0);
105
- });
106
-
107
- it('warns decorative images without role', () => {
108
- const html = `
109
- <html><body>
110
- <img src="/decoration.png" alt="">
111
- </body></html>
112
- `;
113
- const result = analyzeImages(html, 'https://example.com');
114
- expect(result.decorativeWithoutRole.length).toBe(1);
115
- });
116
- });
117
-
118
- describe('generateResponsiveImage', () => {
119
- it('generates responsive image HTML', () => {
120
- const html = generateResponsiveImage({
121
- src: '/images/hero.jpg',
122
- alt: 'Hero image',
123
- widths: [400, 800, 1200],
124
- sizes: '(max-width: 768px) 100vw, 50vw',
125
- });
126
-
127
- expect(html).toContain('<picture>');
128
- expect(html).toContain('srcset=');
129
- expect(html).toContain('type="image/webp"');
130
- expect(html).toContain('alt="Hero image"');
131
- expect(html).toContain('loading="lazy"');
132
- });
133
-
134
- it('respects loading option', () => {
135
- const html = generateResponsiveImage({
136
- src: '/images/hero.jpg',
137
- alt: 'Hero image',
138
- widths: [800],
139
- loading: 'eager',
140
- });
141
-
142
- expect(html).toContain('loading="eager"');
143
- });
144
- });
145
- });
@@ -1,348 +0,0 @@
1
- /**
2
- * Image Optimization Analyzer
3
- *
4
- * Analyzes images for SEO and performance optimization.
5
- * Checks formats, dimensions, alt text, lazy loading, and compression indicators.
6
- */
7
-
8
- import * as cheerio from 'cheerio';
9
- import type { AuditIssue } from '../audit/types.js';
10
-
11
- export interface ImageAnalysisResult {
12
- score: number;
13
- totalImages: number;
14
- imagesWithAlt: number;
15
- imagesWithDimensions: number;
16
- imagesWithLazyLoading: number;
17
- modernFormats: number;
18
- legacyFormats: number;
19
- oversizedImages: ImageInfo[];
20
- missingAlt: ImageInfo[];
21
- decorativeWithoutRole: ImageInfo[];
22
- issues: AuditIssue[];
23
- recommendations: string[];
24
- }
25
-
26
- export interface ImageInfo {
27
- src: string;
28
- alt?: string;
29
- width?: number;
30
- height?: number;
31
- format?: string;
32
- loading?: string;
33
- issues: string[];
34
- }
35
-
36
- const MODERN_FORMATS = ['webp', 'avif'];
37
- const LEGACY_FORMATS = ['jpg', 'jpeg', 'png', 'gif', 'bmp'];
38
- const MAX_RECOMMENDED_DIMENSION = 2000;
39
-
40
- /**
41
- * Extract format from image URL
42
- */
43
- function getImageFormat(src: string): string | undefined {
44
- // Handle data URLs
45
- if (src.startsWith('data:image/')) {
46
- const match = src.match(/data:image\/(\w+)/);
47
- return match ? match[1] : undefined;
48
- }
49
-
50
- // Handle regular URLs
51
- try {
52
- const url = new URL(src, 'https://example.com');
53
- const pathname = url.pathname.toLowerCase();
54
- const ext = pathname.split('.').pop();
55
- return ext && ext.length <= 5 ? ext : undefined;
56
- } catch {
57
- const ext = src.split('.').pop()?.toLowerCase();
58
- return ext && ext.length <= 5 ? ext : undefined;
59
- }
60
- }
61
-
62
- /**
63
- * Analyze all images on a page
64
- */
65
- export function analyzeImages(html: string, url: string): ImageAnalysisResult {
66
- const $ = cheerio.load(html);
67
- const issues: AuditIssue[] = [];
68
- const recommendations: string[] = [];
69
- let score = 100;
70
-
71
- const allImages: ImageInfo[] = [];
72
- const missingAlt: ImageInfo[] = [];
73
- const oversizedImages: ImageInfo[] = [];
74
- const decorativeWithoutRole: ImageInfo[] = [];
75
-
76
- let imagesWithAlt = 0;
77
- let imagesWithDimensions = 0;
78
- let imagesWithLazyLoading = 0;
79
- let modernFormats = 0;
80
- let legacyFormats = 0;
81
-
82
- // Analyze each image
83
- $('img').each((_, el) => {
84
- const $img = $(el);
85
- const src = $img.attr('src') || $img.attr('data-src') || '';
86
- const alt = $img.attr('alt');
87
- const width = parseInt($img.attr('width') || '0');
88
- const height = parseInt($img.attr('height') || '0');
89
- const loading = $img.attr('loading');
90
- const role = $img.attr('role');
91
- const format = getImageFormat(src);
92
-
93
- const imageIssues: string[] = [];
94
-
95
- const imgInfo: ImageInfo = {
96
- src: src.substring(0, 200), // Truncate long data URLs
97
- alt,
98
- width: width || undefined,
99
- height: height || undefined,
100
- format,
101
- loading,
102
- issues: imageIssues,
103
- };
104
-
105
- // Check alt attribute
106
- if (alt === undefined) {
107
- imageIssues.push('Missing alt attribute');
108
- missingAlt.push(imgInfo);
109
- } else if (alt === '') {
110
- // Empty alt is valid for decorative images, but should have role="presentation"
111
- if (role !== 'presentation' && role !== 'none') {
112
- imageIssues.push('Empty alt without role="presentation"');
113
- decorativeWithoutRole.push(imgInfo);
114
- }
115
- imagesWithAlt++; // Empty alt still counts as having alt
116
- } else {
117
- imagesWithAlt++;
118
-
119
- // Check for poor alt text patterns
120
- if (alt.toLowerCase().includes('image') ||
121
- alt.toLowerCase().includes('picture') ||
122
- alt.toLowerCase().includes('photo')) {
123
- imageIssues.push('Alt text contains generic terms');
124
- }
125
-
126
- if (alt.length > 125) {
127
- imageIssues.push('Alt text too long (>125 chars)');
128
- }
129
-
130
- // Check for filename-like alt
131
- if (/\.(jpg|jpeg|png|gif|webp|svg)$/i.test(alt)) {
132
- imageIssues.push('Alt text appears to be a filename');
133
- }
134
- }
135
-
136
- // Check dimensions
137
- if (width > 0 && height > 0) {
138
- imagesWithDimensions++;
139
-
140
- // Check for oversized images
141
- if (width > MAX_RECOMMENDED_DIMENSION || height > MAX_RECOMMENDED_DIMENSION) {
142
- imageIssues.push(`Dimensions too large (${width}x${height})`);
143
- oversizedImages.push(imgInfo);
144
- }
145
- } else {
146
- imageIssues.push('Missing width/height attributes');
147
- }
148
-
149
- // Check lazy loading
150
- if (loading === 'lazy') {
151
- imagesWithLazyLoading++;
152
- }
153
-
154
- // Check format
155
- if (format) {
156
- if (MODERN_FORMATS.includes(format)) {
157
- modernFormats++;
158
- } else if (LEGACY_FORMATS.includes(format)) {
159
- legacyFormats++;
160
- }
161
- }
162
-
163
- allImages.push(imgInfo);
164
- });
165
-
166
- const totalImages = allImages.length;
167
-
168
- // Generate issues
169
- if (missingAlt.length > 0) {
170
- const percentage = Math.round((missingAlt.length / totalImages) * 100);
171
- const severity = percentage > 50 ? 'critical' : percentage > 20 ? 'warning' : 'info';
172
-
173
- issues.push({
174
- code: 'IMG_MISSING_ALT',
175
- severity,
176
- category: 'content',
177
- title: `${missingAlt.length} images missing alt attribute`,
178
- description: `${percentage}% of images lack alt text, hurting accessibility and SEO.`,
179
- impact: 'Screen readers cannot describe images; search engines lose context',
180
- howToFix: 'Add descriptive alt text to all images. Use alt="" for decorative images.',
181
- affectedUrls: [url],
182
- });
183
- score -= Math.min(missingAlt.length * 3, 25);
184
- }
185
-
186
- const missingDimensions = totalImages - imagesWithDimensions;
187
- if (missingDimensions > 0) {
188
- issues.push({
189
- code: 'IMG_MISSING_DIMENSIONS',
190
- severity: 'warning',
191
- category: 'performance',
192
- title: `${missingDimensions} images missing width/height`,
193
- description: 'Images without explicit dimensions cause layout shifts (CLS).',
194
- impact: 'Poor Core Web Vitals, degraded user experience',
195
- howToFix: 'Add width and height attributes to all images.',
196
- affectedUrls: [url],
197
- });
198
- score -= Math.min(missingDimensions * 2, 20);
199
- }
200
-
201
- if (legacyFormats > 0 && modernFormats === 0) {
202
- issues.push({
203
- code: 'IMG_NO_MODERN_FORMATS',
204
- severity: 'warning',
205
- category: 'performance',
206
- title: 'No modern image formats (WebP/AVIF)',
207
- description: `All ${legacyFormats} images use legacy formats (JPEG/PNG).`,
208
- impact: 'Larger file sizes, slower page load',
209
- howToFix: 'Convert images to WebP or AVIF format. Use <picture> element for fallbacks.',
210
- affectedUrls: [url],
211
- });
212
- score -= 10;
213
- recommendations.push('Convert images to WebP/AVIF for 30-50% smaller file sizes');
214
- }
215
-
216
- if (oversizedImages.length > 0) {
217
- issues.push({
218
- code: 'IMG_OVERSIZED',
219
- severity: 'warning',
220
- category: 'performance',
221
- title: `${oversizedImages.length} images have excessive dimensions`,
222
- description: `Images larger than ${MAX_RECOMMENDED_DIMENSION}px may be wasteful on most screens.`,
223
- impact: 'Unnecessary bandwidth usage, slower loading',
224
- howToFix: 'Resize images to match their display size. Use srcset for responsive images.',
225
- affectedUrls: [url],
226
- });
227
- score -= Math.min(oversizedImages.length * 3, 15);
228
- }
229
-
230
- // Check hero/above-fold images with lazy loading
231
- const firstImage = allImages[0];
232
- if (firstImage?.loading === 'lazy') {
233
- issues.push({
234
- code: 'IMG_HERO_LAZY',
235
- severity: 'warning',
236
- category: 'performance',
237
- title: 'First image has loading="lazy"',
238
- description: 'Above-the-fold images should not be lazy-loaded as it delays LCP.',
239
- impact: 'Slower Largest Contentful Paint',
240
- howToFix: 'Remove loading="lazy" from hero/above-fold images. Keep it for below-fold images.',
241
- affectedUrls: [url],
242
- });
243
- score -= 10;
244
- }
245
-
246
- // Check for images without lazy loading (below potential fold)
247
- const belowFoldWithoutLazy = allImages.slice(3).filter(img => img.loading !== 'lazy');
248
- if (belowFoldWithoutLazy.length > 5) {
249
- recommendations.push(`Consider adding loading="lazy" to ${belowFoldWithoutLazy.length} below-fold images`);
250
- }
251
-
252
- // Check for decorative images without proper role
253
- if (decorativeWithoutRole.length > 0) {
254
- issues.push({
255
- code: 'IMG_DECORATIVE_NO_ROLE',
256
- severity: 'info',
257
- category: 'content',
258
- title: `${decorativeWithoutRole.length} decorative images without role`,
259
- description: 'Images with empty alt should have role="presentation" for accessibility.',
260
- impact: 'Minor accessibility issue',
261
- howToFix: 'Add role="presentation" to decorative images with empty alt.',
262
- affectedUrls: [url],
263
- });
264
- }
265
-
266
- // Check for background images (informational)
267
- const elementsWithBgImage = $('[style*="background-image"], [style*="background:"]').length;
268
- if (elementsWithBgImage > 3) {
269
- recommendations.push(`${elementsWithBgImage} CSS background images detected - ensure they're not content images`);
270
- }
271
-
272
- // Check for SVG images (good for icons)
273
- const svgImages = $('svg, img[src$=".svg"]').length;
274
- if (svgImages > 0) {
275
- // This is positive, no action needed
276
- }
277
-
278
- // Positive recommendations
279
- if (totalImages > 0 && imagesWithAlt === totalImages) {
280
- recommendations.push('✓ All images have alt attributes');
281
- }
282
-
283
- if (modernFormats > legacyFormats) {
284
- recommendations.push('✓ Majority of images use modern formats');
285
- }
286
-
287
- return {
288
- score: Math.max(0, Math.min(100, score)),
289
- totalImages,
290
- imagesWithAlt,
291
- imagesWithDimensions,
292
- imagesWithLazyLoading,
293
- modernFormats,
294
- legacyFormats,
295
- oversizedImages,
296
- missingAlt,
297
- decorativeWithoutRole,
298
- issues,
299
- recommendations,
300
- };
301
- }
302
-
303
- /**
304
- * Generate responsive image HTML
305
- */
306
- export function generateResponsiveImage(options: {
307
- src: string;
308
- alt: string;
309
- widths: number[];
310
- sizes?: string;
311
- loading?: 'lazy' | 'eager';
312
- className?: string;
313
- }): string {
314
- const { src, alt, widths, sizes = '100vw', loading = 'lazy', className } = options;
315
-
316
- // Assume src is the largest size
317
- const basename = src.replace(/\.[^.]+$/, '');
318
- const ext = src.split('.').pop() || 'jpg';
319
-
320
- const srcset = widths
321
- .map(w => `${basename}-${w}w.webp ${w}w`)
322
- .join(', ');
323
-
324
- const fallbackSrcset = widths
325
- .map(w => `${basename}-${w}w.${ext} ${w}w`)
326
- .join(', ');
327
-
328
- return `<picture>
329
- <source
330
- type="image/webp"
331
- srcset="${srcset}"
332
- sizes="${sizes}"
333
- />
334
- <source
335
- type="image/${ext === 'jpg' ? 'jpeg' : ext}"
336
- srcset="${fallbackSrcset}"
337
- sizes="${sizes}"
338
- />
339
- <img
340
- src="${src}"
341
- alt="${alt}"
342
- width="${widths[widths.length - 1]}"
343
- height="auto"
344
- loading="${loading}"${className ? `\n class="${className}"` : ''}
345
- decoding="async"
346
- />
347
- </picture>`;
348
- }