There’s very little you can’t do in MODX. WebP images by themselves should work fine for browsers that support them. IE does not, and older versions of other browsers don’t, but current browsers almost all do (with the possible exception of Safari). That said, photo display extras like Gallery, may not handle webP images without some modification and you’d have to change the MODX System Setting (upload_files) to allow you to upload them in MODX.
You can use HTML to show WebP images to browsers that can handle them and fall back to .jpg, or .png images as a fallback using the trick described here.
Make sure your images are being displayed directly or cached rather than being pulled in by a snippet that’s called uncached.
Keep in mind that the slow performance may be due to your server, especially if you’re on shared hosting.
Looks like your main problem are your images, why not try to use a lazyload for the images, that means they will be displayed only when the user scroll or when they need to be displayed.
You only need to show the necessary image or images just to display your site in the first load, after that you can load anything your site needs without interfering in the first load.
I think that will be a good solution for your problem.
You can upload anything that is added to the allowed extensions in the system setting. Video is typically best-handled by a third-party dedicated video service, or a CDN optimized to handle videos. We typically see performance hits from third-party Javascript, as you saw when removing Recaptcha … it’s funny how Google dings your scores for their own Javascript like webfonts and Google Analytics!
Also, make sure everything is cached as much as possible, especially things that build blog listings, menus, etc.
Another way to speed things up is to replace complex conditional output filters (if you have them) with custom snippets, especially if the tags with output modifiers are uncached.
