Browsers requesting $svg_placeholder

  • p15h

    (@prestonwordsworth)


    1 week, 3 days ago

    Dear Brinkmann

    A side effect of using SVG placeholders (which to be sure is a vast cosmetic improvement over native lazy loading) is that the browser would send an equal number of 404 requests for this SVG file at the root of our site.

    Would it be possible for the plugin to instruct the browser not to do so? Or is the workaround simply to put the placeholder at the root to satisfy such requests?

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Florian Brinkmann

    (@florianbrinkmann)

    Hi @prestonwordsworth,

    do you have a link to the site? The SVG placeholder is inserted as a data URI, so there should not be a request for it.

    Best,
    Florian

    Thread Starter p15h

    (@prestonwordsworth)

    Thanks for pointing that out, Florian! Here’s the HTML in question 

    <img decoding="async" width="580" height="580" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20580%20580%22%3E%3C%2Fsvg%3E" class="attachment-large size-large wp-image-10932 lazyload" alt="" srcset="data:image/svg+xml,  %3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20580%20580%22%3E%3C%2Fsvg%3E 580w" sizes="(max-width: 580px) 100vw, 580px" data-srcset="responsive image urls" data-src="original url">

    Is this what you expect? Or could there be a conflict say with Elementor?

    Console error in Chrome:

    GET data:image/svg+xml net::ERR_INVALID_URL

    In Safari:

    [Error] Failed to load resource: Data URL decoding failed (dat…xml, line 0)    data:image/svg+xml
    Plugin Author Florian Brinkmann

    (@florianbrinkmann)

    Hi,

    there are spaces in the srcset attribute (srcset="data:image/svg+xml, %3Csvg%20), is that a copy&paste issue or is it in the site’s source code with the spaces after the comma?

    Thread Starter p15h

    (@prestonwordsworth)

    Right, the two spaces were actually in the HTML. Thanks for catching that!

    I can’t explain why they are there off the top of my head. Please do let me know if you have any idea how this might’ve happened.

    Plugin Author Florian Brinkmann

    (@florianbrinkmann)

    I don’t, sorry, but I guess that is the reason for the error. Do you have a plugin installed that optimizes the frontend code for performance? If so, maybe it’s worth a try to temporarily disable that to check if that’s the reason.

    Thread Starter p15h

    (@prestonwordsworth)

    Thanks for being so helpful, Florian! Yeah, I realised the space was the culprit once you called it out. And I’ve been able to quickly identify the source (WebP Express).

    I’ll report back and close this thread once it’s resolved upstream.

Viewing 6 replies - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.