Conversation
- Add fetchpriority="high" and decoding="async" to profile README logo - Minify SVG assets using svgo --multipass --precision 1 - Add explanatory comments for performance optimizations - Restore asset optimization documentation in SVGs Co-authored-by: soktri3 <170663878+soktri3@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
There was a problem hiding this comment.
Code Review
This pull request attempts to optimize the project logo by adding performance-related HTML attributes to the README and updating SVG asset comments. Feedback points out that the fetchpriority and decoding attributes are not supported by GitHub's README renderer and should be removed. Additionally, decoding="async" is discouraged for images that are part of the Largest Contentful Paint (LCP).
| <!-- Optimized logo: Replaced 46KB PNG with theme-aware SVGs and added dimensions to prevent CLS. | ||
| Added fetchpriority="high" to prioritize the main brand asset in the critical path and | ||
| decoding="async" to ensure the image decoding doesn't block the main thread. --> |
There was a problem hiding this comment.
The added description regarding fetchpriority and decoding attributes should be removed if the attributes themselves are removed from the <img> tag. As noted in the related comment, these attributes are not supported by GitHub's README renderer.
| <!-- Optimized logo: Replaced 46KB PNG with theme-aware SVGs and added dimensions to prevent CLS. | |
| Added fetchpriority="high" to prioritize the main brand asset in the critical path and | |
| decoding="async" to ensure the image decoding doesn't block the main thread. --> | |
| <!-- Optimized logo: Replaced 46KB PNG with theme-aware SVGs and added dimensions to prevent CLS --> |
| <picture> | ||
| <source media="(prefers-color-scheme: dark)" srcset="assets/logo-dark.svg"> | ||
| <img src="assets/logo.svg" alt="Model Context Protocol Logo" width="600" height="87"> | ||
| <img src="assets/logo.svg" alt="Model Context Protocol Logo" width="600" height="87" fetchpriority="high" decoding="async"> |
There was a problem hiding this comment.
The fetchpriority and decoding attributes are not supported by GitHub's HTML sanitizer for README files and will be stripped during rendering. Consequently, these changes will not provide the intended performance benefits on the GitHub profile page. Additionally, for an image that is part of the Largest Contentful Paint (LCP), decoding="async" is generally discouraged as it can delay the rendering of the image. It is better to allow the browser to decode the logo synchronously or use the default behavior.
| <img src="assets/logo.svg" alt="Model Context Protocol Logo" width="600" height="87" fetchpriority="high" decoding="async"> | |
| <img src="assets/logo.svg" alt="Model Context Protocol Logo" width="600" height="87"> |
💡 What: Added
fetchpriority="high"anddecoding="async"to the main logo inprofile/README.md. Minified SVG assets inprofile/assets/usingsvgo --multipass --precision 1.🎯 Why: These changes improve the Largest Contentful Paint (LCP) by signaling to the browser that the logo is a high-priority asset.
decoding="async"ensures that the image decoding process does not block the main thread, leading to a smoother initial page load. Further minification of already optimized SVGs ensures minimal asset weight.📊 Impact:
🔬 Measurement:
svgooutput.PR created automatically by Jules for task 16830967254498889233 started by @soktri3