Website loading speed

Getting Started
1

Hello.
Guys, please advise solutions in order to increase the speed of loading the site

2

Hi mvc11111,

There are many reasons for sites to be fast (or slow) and it really is a matter of working your way through them one-by-one, optimising as you go. This is a non-technical guide that almost any web developer can manage, nothing beyond basic HTML and quick “Google, Copy, Paste”.

From experience, the biggest issue I have with speed is caused by deep nesting Snippets and making them all uncached. This can very quickly mount up lots of DB queries, and if the website is doing them every page load, you’ll never get a fast site, no matter what else you do, this is the proverbial site-killer. Once you know this is not a problem, I’d recommend the following:

The Basics

  1. MinifyX - Minify all your CSS and JS into one file. Google Page Speed likes this
  2. pThumb - Use this to output all your images at the correct sizes for the different screen sizes. Using/converting to webp will also help boost your Google Page Speed if you or your client relies on this metric: How to deliver fast images with Modx using PhpThumbOn and WebP
  3. Async your 3rd Party Scripts, or merge them into your main JS file if possible.
  4. Use loading=“lazy” on all images
  5. Preconnect external Font files for webfonts

More Advanced

  1. If you have nested chunks or snippets in conditional statements, move the [[ ]] outside: eg. [[*field:is=0:then=[[!SomeScript]]:else=[[$SomeChunk]]]] becomes [[[[*field:is=0:then=!SomeScript:else=$SomeChunk]]]] - Details of why this is important can be read up on here: Tags as the Result or How Conditionals are like Mosquitoes | MODX
  2. Use the Snippet, not the Output Modifier. I am guilty of this one, as it is so much easier (imho) to write:
    [[*PageImage:pthumb=w=128&h=80&zc=c&q=90]]
    than writing:
    [[pThumb? &input=[[*PageImage]] &optionsw=128&h=80&zc=c&q=90]]
    but the Snippets are always faster.
  3. Sort out your caching. Use you htaccess file to cache static resources. Read up on how Modx caches different elements and what causes it to clear the cache. I had a site when I had to run a cron job to “warm up” my cache every night, because the client had hundreds of old News pages, but would tweak there site on a near daily basis. Google CWV gave me terrible page speeds, because no-one really ever visitied the old News pages, but Google crawled them, and so they weren’t in the cache and the page build was always just too long and I failed that metric.

In summary, there is no magic wand, but the basics will get you to a fast site very quickly. To be blazing fast takes time, finesse and experience, but once mastered it is not complicated at all.

2 Likes
3

Here is a good list, and a useful tool. Yslow.org.

2 Likes
4

Hello. Guys, thanks. Maybe some other plugins, snippets?

5

Get the PDF on site speed from the front of modx.com. Follow those tips, several outlines above, and you should have a much faster site.