[Image] No native "src" property on server side rendered page
See original GitHub issueDescribe the bug
Currently while checking image component rendered on server side (in my case using next.js) there’s no src
in server side rendered native <image />
tag
is this intentionally designed like this? or is there any way to configure this
because this might be a huge impact on SEO as no image will have src
PFB codesandbox describing minimal nextjs sample
Expected Behavior
have src
property on native <image/>
To Reproduce no reproduction required just use component with src
Suggested solution(s) NA
Desktop (please complete the following information):
- OS: [e.g. iOS] All
- Browser [e.g. chrome, safari] All
- Version [e.g. 22] All
Additional context
If lazy loading images was the purpose then loading=lazy
tag might be useful
https://caniuse.com/#feat=loading-lazy-attr
Issue Analytics
- State:
- Created 4 years ago
- Comments:9 (3 by maintainers)
Top Results From Across the Web
Can't show Image in React Native - Stack Overflow
Side note on this issue. Upgrading from React Native 0.63.0 to 0.63.2 fixes an issue where remote images do not display on iOS...
Read more >Working with images in Next.js - DEV Community
Rendering images in Next.js for the first time can be frustrating, ... The src attribute takes in a relative or absolute URL path...
Read more ><img>: The Image Embed element - HTML - MDN Web Docs
The above example shows usage of the <img> element: The src attribute is required, and contains the path to the image you want...
Read more >A Deep Dive into Native Lazy-Loading for Images and Frames
The initial, server-side HTML response includes an img element without the src attribute so the browser does not load any data.
Read more >Docs • Svelte
This page contains detailed API reference documentation. ... SvelteKit utilizes Vite to build your code and handle server-side rendering (SSR).
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I solved the issue using fallbackSrc. But it is a bug I think.
Thanks @jmcruzmanalo, using
ignoreFallback
might be optimal solution