{"id":1659,"date":"2020-06-07T22:46:40","date_gmt":"2020-06-07T14:46:40","guid":{"rendered":"https:\/\/www.wesbytes.com\/guide\/?post_type=kb&p=1659"},"modified":"2026-01-05T09:44:42","modified_gmt":"2026-01-05T01:44:42","slug":"what-is-mirage-with-cloudflare","status":"publish","type":"kb","link":"https:\/\/www.servergigabit.com\/guide\/kb\/what-is-mirage-with-cloudflare","title":{"rendered":"What is Mirage with Cloudflare?"},"content":{"rendered":"

\"Mirage<\/h3>\n

What is Mirage with Cloudflare?<\/strong><\/h3>\n

Mirage image optimization\u00a0is currently available for Pro, Business, and Enterprise level domains. It helps speed up loading of images through four key attributes:<\/p>\n

    \n
  1. Mirage<\/a> will analyze the type of connection and device the visitor is coming from, which helps optimize the image loading experience based on network and device connection. Therefore, <\/b>automatically resizes images based on the visitor\u2019s device, and how the image is use on the page. Requires JavaScript (automatic).<\/li>\n
  2. Virtualize the images, so a visitor on a poor connection will get a smaller version (lower resolution) of the image until the customer is back on a higher bandwith connection (high resolution).<\/li>\n
  3. Mirage will streamline requests into one. Instead of sending multiple requests for all of the images on the site,\u00a0 will pull this into one request so visitors can start experiencing the images immediately.<\/li>\n
  4. Mirage will act as a lazy loader, and automatically turns all images into load-on-demand. Images on your site are not loaded until the visitor scrolls to their location. This feature will work for any images on your page, including those that are loaded in from third party links.<\/li>\n<\/ol>\n

    For instance ,<\/b>Click here for more information on how Mirage works<\/a>.<\/p>\n

     <\/p>\n

    \n

    What File Extensions will CloudFlare Work With?<\/h2>\n<\/div>\n

    In addition ,Mirage will work with the following image formats:<\/p>\n

    *.jpg
    \n*.jpeg
    \n*.png
    \n*.gif
    \n*.img<\/p>\n

     <\/p>\n

    \n

    Turning on Mirage:<\/h2>\n<\/div>\n

    To enable\u00a0 for your domain, log into your CloudFlare account to access your CloudFlare performance settings.<\/p>\n

    After that , can be found under the \u2018Speed\u2019 section after logging into your CloudFlare account:<\/p>\n

    \"Enabling<\/p>\n

    To access your page rules, go to:<\/p>\n

    Page Rules can be find under their own section after logging into your CloudFlare account:<\/p>\n

    \"Enabling<\/p>\n

    \n

    Testing Mirage:<\/h2>\n<\/div>\n

    EXAMPLE.COM\/?forcepreload<\/p>\n

    EXAMPLE.COM\/?forcepreloadonly (this flag will run the pre-loader only and serve degraded images on the page)<\/p>\n

    Besides that ,here is an example which is triggered by a ?forcepreloadonly flag. Notable image degradation is a sign that the feature is working:<\/p>\n

     <\/p>\n","protected":false},"excerpt":{"rendered":"

    What is Mirage with Cloudflare? Mirage image optimization\u00a0is currently available for Pro, Business, and Enterprise level domains. It helps speed up loading of images through four key attributes: Mirage will analyze the type of connection and device the visitor is coming from, which helps optimize the image loading experience based on network and device connection. Therefore, automatically resizes images based…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"kbtopic":[43],"kbtag":[1395],"class_list":["post-1659","kb","type-kb","status-publish","hentry","kbtopic-cloudflare","kbtag-mirage"],"_links":{"self":[{"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/kb\/1659","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/kb"}],"about":[{"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/types\/kb"}],"author":[{"embeddable":true,"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/comments?post=1659"}],"version-history":[{"count":3,"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/kb\/1659\/revisions"}],"predecessor-version":[{"id":4748,"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/kb\/1659\/revisions\/4748"}],"wp:attachment":[{"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/media?parent=1659"}],"wp:term":[{"taxonomy":"kbtopic","embeddable":true,"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/kbtopic?post=1659"},{"taxonomy":"kbtag","embeddable":true,"href":"https:\/\/www.servergigabit.com\/guide\/wp-json\/wp\/v2\/kbtag?post=1659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}