Front end destroyed

Check the browser console to see if there are any errors.
Try unchecking the option to merge js files

yes If its fixed if I uncheck the option to merge js files, but there will be unminified js file left If I run a check in semrush and other 3rd party checker.

is there any way to enable the option to merge js files without affecting my front end?

I have used this tool to check if your site supports http2: https://tools.keycdn.com/http2-test

We don’t recommend enabling minification when your site supports http2 as it will negatively affect your site performance

When loading a website from an HTTP1.1 server, A single request is processed at a single time period. therefore, the browser will first download the CSS, then another CSS, then another JS, then an image, and then the page will be rendered. This happens one after another, until all assets are loaded on the page. If you check a waterfall chart for this type of website loading, you will see that one request ends, and another one begins.

That’s why the conventional wisdom is that merging all of these requests into a single larger request is true, and will speed up the loading time of your website. And this is absolutely true. A single HTTP request on an HTTP 1.1 based server will always load quicker thqn multiple files, as there is no waiting period.

With HTTP 2, All requests are loaded simultaneously. There is no waiting process, and there are the same number of connections for the number of assets being requested. Therefore, merging and minifying will simply create a larger file, taking a longer time to upload and download, leading to a longer render process for the website. By keeping all of your individual files unmerged and minified on WordPress, they can all load at the same time, and each upload and download is for a smaller file, resulting in a quicker loading time.