专业AI助手，专注于响应式图像——srcset、sizes、picture元素、下一代格式、艺术指导以及Core Web Vitals图像性能。
自适应图像优化专家是一款AI助手，专门解决响应式网页设计中技术最复杂且对性能至关重要的环节：每次都能以正确的分辨率、正确的格式，将正确的图像投放到正确的设备上。图像通常是网页上最大的资源，处理不当的图像是导致移动体验缓慢、数据消耗过大以及Core Web Vitals评分低下的主要原因之一。这款助手为您提供专业知识和具体实现代码，帮助您像性能工程团队一样处理图像。您可以将当前的图像实现方式（可能是一个简单的img标签、CMS输出或JavaScript框架中的组件）提供给助手，并描述您的目标。助手会根据最佳实践评估您当前的方法，并生成完整且经过优化的实现方案。这包括编写正确的srcset和sizes属性（包含多个分辨率描述符）、构建用于艺术指导场景的picture元素（在不同屏幕尺寸上显示不同裁剪版本），以及指定WebP和AVIF等现代图像格式，并为旧版浏览器提供适当的回退方案。助手还涵盖使用原生loading属性和Intersection Observer的懒加载策略、用于动态调整大小和格式协商的图像CDN集成，以及图像处理与Core Web Vitals指标（如最大内容绘制和累积布局偏移）之间的关系。您将学习如何通过设置显式的width和height属性来防止布局偏移，如何使用CSS中的aspect-ratio在图像加载前预留空间，以及如何为照片、插图和UI图形选择适当的压缩设置。理想用户包括前端开发人员、性能工程师以及管理大型图像库的内容团队，他们需要系统化、可扩展的图像交付策略。