Torque - Optimise the transport of your Website

Depending on how compressible you content is you can expect ~10 - 15% compression of your page before gzip compression, after gzip you can expect ~ 5 - 10%.

You can tick the "Show stats in the console" option to see how long it takes to minify your page and what compression was achieved, view the output in the developer console (Press F12). Note that inline CSS and Javascript is cached in a Wordpress transient, so if you page has inline code, it should be faster after first run.

You are swapping the time it takes to send the extra bytes down the wire to your clients for extra CPU time on the server. Torque uses my other project HTMLdoc to minify your code, it has been designed to use on the fly and has been optimised for speed. Even so I recommend you use some sort of cache in front of your PHP code to make sure your time-to-first-byte is optimised, then the extra CPU time doesn't matter.

The best tool to use is Lighthouse, which is built into Blink based browsers such as Chrome, Edge and others:

• Press F12 to bring up the developer tools
• Select the "Lighthouse" tab
• Click "Generate Report"

Some advanced minification optimisations can cause issues with your website's layout, or break your Javascript depending on how your CSS/Javascript selectors are setup. For example, you can strip default attributes from your HTML such as type="text" on the <input> object. If you have a CSS or Javascript selector that relies on this attribute being there, such as input[type=input], the selector will no longer match. See HTMLdoc: Mitigating Side Effects of Minification for solutions.

Other minification plugins blindly find and replace patterns within your code to make it smaller, often using outdated 3rd-party libraries. HTMLdoc is a compiler, it parses your code to an internal representation, optimises it, and then compiles it back to code. The result is better reliability, compression, and performance. It also bundles CSS and Javascript compilers from the same author for minifying your inline CSS and Javascript which use the same technology to make less mistakes and offer better compression. All three libraries have automated test suites to ensure reliability, and should outperform other PHP based minifiers in terms of compression.

Content Security Policy (CSP) is a very powerful browser security feature that only enables assets to be downloaded from the specified domains. Any assets that are downloaded from domains that are not listed will be blocked.

Using the developer tools in your browser (Press F12), look at the network tab on each page, and note down the domains that are used for different assets, along with their asset type. You can then enter those domains in to the relevant CSP boxes. Be sure to run any extra features of your website that use Fetch or XHR, as these connections are also bound by CSP. Once the domains are entered, and with the CSP setting set to "Enabled only for me (testing)", go through the pages of your website again, checking for Content-Security-Policy errors in the console. If there are errors, the console should indicate which domain and category trigger the CSP error. Note that your website may not function correctly whilst you do this if the CSP is not correct, but this behaviour will only be exhibited for you with the testing setting. When you are happy that all domains and settings are set correctly, you can enable the CSP setting.

Preload works by notifies the browser as soon as possible of assets it will need to load the page, this enables it to start downloading them sooner than if it discovered them on page. For example font files are normally linked from the stylesheet, so the browser has to download and parse the stylesheet before it can request them. By preloading, when it discovers that it needs those assets, they will already be downloading. Thus your website will load faster.