Envira Gallery Documentation

Documentation, Reference Materials and Tutorials for Envira Gallery

How to Optimize Your Website and Images for Speed

Would you like Envira Gallery and your website in general to perform at its very best? We’ll cover several important optimization topics in this tutorial to get the most out of your WordPress site. This tutorial will walk you through the steps needed to optimize your site for speed.

This tutorial is a bit more technical than our other docs, but we’ll walk you through the process, step by step. In order to follow some of these steps, additional tools, plugins, and host changes may be required. Test your website’s speed before and after you’ve made optimizations, to compare.
Before completing any of the steps below and when making changes in general, it’s important to make a backup of your site. Many hosts do this automatically or can be configured to do so, but at the WordPress level, we recommend the UpdraftPlus plugin.

It all starts with picking a good host to begin with. We both use and recommend SiteGround.

Although, if you have a larger budget for your project or know that you’ll be needing to support hundreds or thousands of photos and have a high volume of traffic, something more scalable like WP Engine may be in order.

Whether you’re interested in one of the recommendations above or already have hosting, making sure that your server is already on or is capable of being upgraded to PHP 7+ is absolutely vital. Not just for Envira’s performance but for your WordPress install and overall website performance.

In some tests, PHP 7 is up to 50% faster than PHP 5.

Log into your WordPress site and navigate to Envira Gallery » Settings » System Info tab.

Find out specific server details about your hosting on Envira System Info tab

Here you can easily see the PHP version you’re hosting company currently has installed for you as well as some other important server information.

If you’re not already on PHP 7+ we recommend you contact your hosting company to request an upgrade for you PHP version.

As shown below, you’ll find some other helpful recommendations for your server configuration:

  • Set up server-side caching like Memcached and Varnish. You’ll need to search your host’s documentation or contact their support to see if this is available to you.
  • Linux
  • PHP 7+
  • PHP Memory Limit: 256MB
  • MySQL 5.6+

You can see what WordPress recommends for your server setup on their requirements page.

Over time, your WordPress install can become quite bloated. Follow these steps to make sure your install is running at optimum capacity:

  • It’s always important to keep your theme, plugins, and WordPress itself up-to-date.
  • It’s a good idea to do a plugin audit every now and then and delete out anything you don’t need.
  • WordPress automatically generates many intermediate images (multiple sizes of the same image), that you both might not even know exist or will never use. There’s no reason to devote precious server resources to the generation and storage of these files. With the Stop Generating Image Sizes plugin, you can eliminate this behavior.
  • WordPress automatically saves unlimited post revisions, which can amount to thousands of needless posts, which can bloat your database. Stop this behavior by adding this line to your wp-config.php file: define( 'WP_POST_REVISIONS', 3 ); to limit the revision count to only the latest 3 revisions.
  • After adding that, it would be a great time to delete all those backed up revisions and generally clean up your database with the WP-Optimize plugin.
  • Install a caching plugin. There are many cache plugins available. W3 Total Cache is an excellent free option. WP Rocket is a great premium option, that is much easier to use. While WP Rocket is very easy to configure, we should mention that generally, caching plugins are advanced and require careful configuration to not break site features. If your galleries are broken after installing a caching plugin, start by disabling its JS minification settings.
  • Install Cloudflare (free). Cloudflare both integrates with and compliments WP Rocket.
W3 Total Cache, WP Rocket, Cloudflare, or any caching solutions or CDNs (Content Delivery Networks) in general have been known to cause conflicts. Unless you’re experienced in configuring these solutions properly, you may need to seek help from a pro.

Alternatively, instead of installing a plugin or service as mentioned above (which will handle most optimizations automatically), if that’s too difficult, impossible, or is causing too many conflicts, you can take a more surgical approach to address Expires Headers, Browser Caching, and GZIP Compression recommendations.

To do this, check out the GTMetrix article on how to Add Expires headers.

You can also remove query strings from JS and CSS files by using a free plugin called Remove Query Strings From Static Resources.

Envira Gallery itself, has a few options available to optimize for better page loading.

Enable Envira Lazy Loading for your gallery will also help. This loads images only once they’ve come into view above the page fold, rather than simply loading the entire image set at the beginning.

When editing a gallery, under the Configuration tab, check the box for Enable Lazy Loading?

Also under the Configuration tab, you can define a specific image size and Crop Images as shown in the image below.

Use Envira's Lazy Loading and Image Cropping to help reduce the weight of the gallery

Using Envira’s Pagination Addon will break up large galleries into multiple pages, rather than dumping them all onto one page. This can also makes it easier for people to browse the gallery.

If you need any help using the pagination, review our documentation on the Pagination addon.

You can also use Envira’s Albums Addon to create an album for a single or set of galleries. The Albums Addon would show 1 image for each gallery inside the album.

For assistance in creating an Envira album, check out our documentation for the Albums Addon.

It’s very important to optimize your images to get the smallest file size possible. With the right steps and tools, it’s also possible to do this without losing any noticeable quality.

You can use a plugin to optimize your images.  We recommend one of the following:

  • https://wordpress.org/plugins/ewww-image-optimizer/
  • https://wordpress.org/plugins/tiny-compress-images/
  • https://wordpress.org/plugins/wp-smushit/
Please note that if retaining the metadata for images is important to you, you’ll need to carefully turn off that feature in various compression tools.

And that’s it. Whether you only tried a few of these optimization techniques or all of them, you should have a noticeably zippier website.

Check out some of our other tutorials, such as How to Limit Number of Images Displayed.

A: We recommend GTmetrix. Pingdom and Google’s PageSpeed Insights are also pretty good tools.

A: You can install a plugin like WordPress PHP Info to check the specific server configuration you have installed.