Compression not working with Azure front door

Mohammed Anzal 1

I have hosted a site and added Azure front door into it. My hosted site is an ASP.NET MVC web application. On the initial load of the site, by clearing cache or for first-time users, most of the files including CSS and js loaded are compressed, but a few js files with query string, in my case the bundle js files are not getting compressed. One of the bundle files is 1.4MB and it loads the exact resource size, hence it takes too much time to load.

I have enabled Caching and compression from the Azure portal. Cant find what I am missing still, Somebody please help.

1 answer

ChaitanyaNaykodi-MSFT 22,776 Reputation points Microsoft Employee

2022-10-28T22:12:11.957+00:00

@Mohammed Anzal , Welcome to the Microsoft Q&A forum.

Based on my understanding of your question above you have enabled compression on Azure Front Door and you have observed that few files are not compressed and file size is 1.4 MB.

This scenario can happen if compression isn't enabled for the requested file type. From the documentation here, you can check if this particular file type is added to the Compressed file types list. You can modify the default list of MIME types on Optimizations page.

Another troubleshooting step you can try in this case is to see if the file is compressed if compression is enabled at origin itself. This will help us understand if the issue is due to Azure Front Door or due to some other component.

Additional reference - https://learn.microsoft.com/en-us/azure/frontdoor/standard-premium/troubleshoot-compression

Hope this helps! Please let me know if you have any additional questions. Thank you!
Please sign in to rate this answer.
Mohammed Anzal 1 Reputation point

2022-10-31T07:07:00.97+00:00

@ChaitanyaNaykodi-MSFT
Actually, the files which not getting compressed are basically Javascript files, and I confirmed that those compression types are added to the list you mentioned. When I disabled Azure's front door and inspected the same files I found that it's being compressed. So I guess it's some issue within Front Door, and once again let me clarify the issue only occurs for files with query strings, there are other JS files without query strings that are compressed properly.

ChaitanyaNaykodi-MSFT 22,776 Reputation points Microsoft Employee

2022-11-01T18:40:32.693+00:00

@Mohammed Anzal ,
Thank you for sharing additional details here and confirming the requested details.
To further troubleshoot this issue, from the screenshot above I see that the Cache response header for this file is set to cache-control: private (snippet below) as per this cache documentation for Azure Front Door, can you please confirm what caching behavior is set-up? When Caching is enabled on Azure Front door with the option of Honor Origin then Azure Front Door will always honor origin response header directive which setup for cache-control: private and the file will not be cached and it will not be compressed. You can try and change the caching behavior of the file at origin and see if the file is getting compressed. You can also change AFD's caching behavior via portal by following the documentation here..

Hope this helps! Please let me know if you have any additional questions. Thank you!

Mohammed Anzal 1 Reputation point

2022-11-02T08:52:43.377+00:00

@ChaitanyaNaykodi-MSFT

Hi Chaitanya,
The option to change the caching behavior is done by creating a rule set I believe, I have tried that method by following the documentation but as you said I chose the 'Honor Orgin' option. Can you please help me out with the option I need to choose instead, I am not sure about it.

ChaitanyaNaykodi-MSFT 22,776 Reputation points Microsoft Employee

2022-11-02T19:57:55.057+00:00

@Mohammed Anzal ,

My apologies for any confusion here. Based on the observation above can you please confirm which SKU of Azure Font Door you are using? Is it Azure Front Door Classic SKU or Azure Front Door Standard/Premium SKU?

In either case if you can change the Cache-Control response header from cache-control: private to cache-control: public can help us determine if this helps resolving the compression issue.
In Azure Front Door if Cache-Control response headers contain values such as Cache-Control: private, Cache-Control: no-cache, and Cache-Control: no-store then the response is not cached even if you have caching enabled.

Mohammed Anzal 1 Reputation point

2022-11-03T08:53:36.447+00:00

We are using Azure Front Door Standard. You are right, when I tried to visit the site inside the hosted server machine, I found that the response header 'Cache-Control' was 'private'. But again files with query strings are only returned with this header, all others show public or don't have any 'Cache-Control' header. As you could see from the screenshots, JS files without query strings are being compressed with Azure Front Door. The JS file I have pointed out in those screenshots are bundle file, as it's an MVC Application and that's not compressed. So, Could you please help me out here to change the cache headers from private to public for these bundle files? What am I missing?

ChaitanyaNaykodi-MSFT 22,776 Reputation points Microsoft Employee

2022-11-04T04:01:00.51+00:00

@Mohammed Anzal ,

Thank you for sharing additional details, as the issue is related to your backend, it will be helpful if you can create a support request for this issue as a support engineer can take a look at your backend over screenshare session and help debug the issue.

If you do not have a support plan, can you please refer to my private message here for additional details. Thank you! Please let me know if you have any additional questions here.
Sign in to comment