Loading Speed Optimization (SiteGround)
Video tutorial - https://www.youtube.com/watch?v=oqu9_bfBBQo
Take Screenshots First!
Siteground’s Speed Optimizer “Site’s Performance”, take a speed test on “DESKTOP” and “MOBILE”, which we will compare to the speed after optimization and send to client as proof.
Alternatives
Configure SG Optimizer Settings:
In the WordPress Admin Dashboard, find the SG Optimizer option in the left sidebar and click on it.
Navigate to the Caching tab:
- Enable Dynamic Caching: This stores a cached version of your site for faster loading.
- Enable File-Based Caching: This improves speed and allows for automatic cache purging with updates.
Go to the Enviroment tab:
- Enable HTTPS Enforce: This ensures all traffic to your site is secure.
- Check the Secure Content option to ensure no mixed content warnings.
Below SOP are not tested yet, and wildly inaccurate
Go to the Frontend tab:
- Enable Gzip Compression: This reduces the file size of your web pages and makes them load faster.
- Enable Browser Caching: This allows files to be cached in visitors' browsers for quicker access on subsequent visits.
- Enable CSS & JavaScript Minification: This reduces file sizes by removing unnecessary spaces, comments, and characters.
- Enable CSS & JavaScript Combination: This merges multiple files into single files to reduce HTTP requests.
Enable Settings Cautiously:
Go to the Advanced settings section:
- Under DNS Prefetching, carefully add font URLs or any external resources you plan to use. Test how this affects your site’s performance.
Enable one setting at a time and:
- Visit your staging site after each change to ensure there are no issues (e.g., broken layouts or functionalities).
- Document any issues that arise for troubleshooting later.
Media Optimization:
In the Media section of SG Optimizer:
- Enable Image Optimization: This compresses images automatically to reduce their size.
- Enable Lazy Loading: This defers loading images until they are about to be displayed in the user's viewport. Customize the settings to exclude any specific media types that should load normally.
Combine Tools for Best Performance:
Evaluate the need for additional optimization plugins:
- Install and configure Auto Optimize to further enhance CSS, JavaScript, and HTML optimization.
- Install and configure WP Smush (or similar) for advanced image optimization.
Ensure these plugins are compatible with SG Optimizer to avoid conflicts.
Test Performance:
- Use tools like Google PageSpeed Insights, GTmetrix, or Pingdom to measure your site performance.
- Check both mobile and desktop versions of your site for speed scores.
- Aim for a performance score of 90+ but recognize that various elements (like hosting and site complexity) can affect the outcome.
Monitor Performance:
- After implementing the optimizations, monitor your site’s performance regularly:
- Keep track of load times and performance scores, especially after major updates or content changes.
- Adjust settings in SG Optimizer or other plugins as needed based on performance feedback.