Smartslider + Shortpixel CDN

Shortpixel CDN is an image CDN that works in a really weird way
They embed a URL in-front of each image that looks like:

https://cdn.shortpixel.ai/spai/w_375+q_lossy+ret_img+to_webp/

So for example, if the image is:
https://example/wp-content/uploads/2019/11/example-image.png

Then the image in the CDN will be:
https://cdn.shortpixel.ai/spai/w_375+q_lossy+ret_img+to_webp/https://example/wp-content/uploads/2019/11/example-image.png

The problem comes with SmartSlider

Before purchasing Shortpixel credits I was using a popular CDN like KeyCDN. With a Cache plugin like WP-Rocket or Swift Performance, setting up the CDN for images was not enough. Because, for some reason Sliders seem to load a little late and the SP/WPRocket plugins could not rewrite the sliders URL successfully to show them accordingly.

But I found that embedding the CDN this on Smartslider was pretty easy: Thanks to the URL Translation feature I simply put

From: example.com
To: cdn.example.com

So far, so good. Everything worked fine.

But now with Shortpixel everything has broken. I thought that Shortpixel plugin would be able to rewrite also the Smartslider URL, but similar to other cache plugins, it couldn’t

So I tried the URL Translation feature. But it did not work.

Why? Because the translation is hindered at some point in the code
If I put:

From: example.com
To: cdn.shortpixel.ai/spai/w_375+q_lossy+ret_img+to_webp/https://example.com

Smartslider strips the “https:” from the To at some point and the result is:

To: cdn.shortpixel.ai/spai/w_375+q_lossy+ret_img+to_webp///example.com

Which obviously, doesn’t show any images.

I’ve tried to backtrack the code to:
/library/smartslider/libraries/slider/abstract.php

And output the result of the “render” function which looks fine, with the https:// in HTML code. So the “final render of the HTML” is being stripped out in a different place but not sure where.

Conclusion:
If SmartSlider did not strip out the https:// from the “To:” Url Translation part at some point in the HTML code rendering, Smartslider will be 100% compatible with Shortpixel CDN.

The solution given here:
https://smartslider3.helpscoutdocs.com/article/1257-how-to-use-cdn-with-smart-slider

Is not adequate in this case, because Shortpixel CDN only applies to images, it cannot be use to CDN other files likes js/css/pdf, etc… that are located in the wp-content directory.

Hope this helps to find a solution.

Kind regards