Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #1377101

    Some advice for WP-Rocket setup with a CDN.

    Stop Generating Post CSS to allow background images to be served by CDN
    When you use WP-Rocket in conjunction with any asset only CDN URL (unless the CDN processes your CSS files) all background images will still load from your main server and not the CDN. This is because they are specified in the Post-XX.CSS file for each page which unless re-processed state the full url for your server not the CDN.

    To fix this Stop the new POST-CSS files generating so the background images are written inline in the HTML.
    Add to functions.php in your child theme.

    // stop postcss generating
    add_filter('avf_post_css_create_file', '__return_false', 1, 1);

    WebP background images
    The above function also allows plugins that generate WebP locally to serve the background images as WebP AND from the CDN. We use Ewww locally for WebP creation and serving.

    Check the priority of anything you add to WP-Head
    I add some critical CSS to the header manually. The priority for this insersion if you add it from functions.php should be 2. Otherwise the preconnect for your CDN will happen after manually added critical CSS. The pre-connect and prefetch added by WP-Rocket are irrelevant if they are not called before the CDN is needed. For example manually preloading fonts.

    I hope this helps others using an Asset CDN.

    Full page caching
    Unless your CDN provider advises otherwise – If your CDN serves your cached HTML files as well then you will not need to specify a CDN URL in WP-Rocket – As it should be handled at DNS level to deliver full site caching. The above will just speed up background elements by serving the css and urls inline and helps background imagery get served via WebP.

    It depends if your CDN provider dynamically re-writes the CSS files to include the CDN URL or just serves the assets from the CDN without processing. Generally speaking – Most CDNs are static files only and do not cache HTML files.

    I am currently looking at Stack Path and Bunny CDN to deliver full site caching across my servers after finding KeyCDN is assets only during trials.

    • This topic was modified 1 year, 10 months ago by thinkjarvis.
    #1377156

    Hey Thomas,

    Thanks for sharing your tips, it’s very appreciated :-)

    Best regards,
    Rikard

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