Multisite html rewrite only works when debug is enabled

I opted for the client side solution (for now) and moderated the retina.js in order to keep the images at 100% width and auto height.

$('#main-games img').each(function(){
        new RetinaImage(this);
});

Only issue that remains is that @2x is added to the image url when using this snippet, even though @2x is already added… So you get the correct images but also a load of 404’s in the console ??

Html rewrite works! BUT only when debug mode is enabled

Are you using caching? Maybe a cache plugin?

Cloudflare thing

I don’t know on your local, but with Cloudflare the server-side wouldn’t work. The HTML Rewrite would though, and the Client-side too.

Only issue that remains is that @2x is added to the image url when using this snippet, even though @2x is already added

Why is @2x already there?
You can check if the filename contains @2x, and if it doesn’t, then you’ll call the line “new RetinaImage”, otherwise not. Simple ??

Hi, thanks for replying! Still lovin’ you plugin and spreading the name towards my m8’s ??

I am sticking with the client side solution. The site is cached three times through memcache, varnish and cloudflare… I bet one of those might cause the rewrite to go bad? ??

Anyway, the issue with the double @2x was due to a lazy load script. it caused the retina.js plugin to be called again when loading new content ?? i sawk.

My dirty solution was to add the following script when loading new content:

//serve retina images. Works with the WP 2x retina plugin
$('#main-games .article-header img').each(function(){
      var imageSource = $(this).attr('src');
      if (imageSource.indexOf("@2x") >= 0) {
            //already is a retina image
      } else {
            //its not a retina image
             new RetinaImage(this);
      }
});

memcache, varnish and cloudflare

Memcache => No HTML Rewrite, Cloudflare => No Server-Side. Only Client-Side left ^^

the issue with the double @2x was due to a lazy load script

Ah yes, that’s often the case, and that’s where the Server-Side works very well in fact.

My dirty solution was to add the following script when loading new content

Your solution is not dirty: it’s the right one ??

https://i.imgur.com/0kA4sbu.gif