How to: Optimize Images in WordPress
How to optimize images or which CDN to use with WordPress are very common questions I get. Of course, they also need to be compatible with my plugins.
First, I will start with solutions to avoid absolutely. Then I will tell you what you should do, and then introducing the different solutions. If you are only looking for the best solutions and that you have a bit of budget for your website, you can go directly to the All-in-One Solutions section.
Avoid using S3 with WordPress. Don’t even think about it. Not now. It was not meant to be used with S3, and even if there are plugins allowing you to do that, it is a hack. I don’t doubt it is an interesting idea, unfortunately, you will encounter many issues, with many plugins as many core functions of WordPress will stop working properly. Moreover, S3 is not a CDN. It will not make any website faster, worse, it might even slow it down (relatively to your hosting service quality). CloudFront (Amazon CDN) will be required to actually make it worth.
When WordPress natively handles remote storages, it will become safe to use. For now, stay away from it.
Avoid using JetPack. It might look simpler at first, but it is better to handpick the best solutions for you instead of using a solution overloaded with too many features and restrictions. I am not saying it is necessarily a bad plugin, but I would go for lighter and more focused solutions.
You should use a CDN absolutely, that will give you the biggest boost in term of performance. Then, you can also use an image optimizer, though that is more tricky as it is not instant (the images need to be all processed) and your files get modified. You can also choose a solution that does everything, including the file optimization, on the server (All-in-one Solutions).
Use an Image Optimizer. Many sizes (thumbnails) are created by WordPress for every image you upload. They are usually heavier than they should and that is why it is really recommended to optimize them. This is usually done with a plugin which runs the optimization either on your WordPress install directly, or on a remote server. Your files will be directly modified.
Use a Content Distribution Network (CDN). This is a service that stores your static files (images, JS, CSS, etc) on very fast servers around the globe in order to serve them at the highest speed possible, the closest as possible to your visitors. A plugin will be required (or some kind of HTML rewriter), and all the links to your static files will be modified to go through the CDN instead. The CDN will automatically get the files from your server on the first requests (and will refresh those files regularly).
I have tested all those plugins successfuly.
- EWWW Image Optimizer. The developer is really helpful, friendly and enthusiastic, and does his best for his clients. The plugin works very well and the pricing is kinder to the waller than other solutions. The downside is that the UI looks a bit clunky. Works with WP Retina 2x and WP/LR Sync.
- ShortPixel. The developers worked with me on the compatibility very nicely. I used this plugin and it also worked perfectly for me. It’s simpler than EWWW but has fewer options and no free alternative. Works with WP Retina 2x and WP/LR Sync.
- Smush Pro. They contacted me to work on the compatibility in the past, so it should still work. The plugin is simple and works well. However, I feel like it reset the optimized status of the images from time to time. Much simpler than EWWW, quite similar to ShortPixel actually. Should work with WP Retina 2x and WP/LR Sync.
- Imagify. They have a friendly team and they are the same guys behind WP Rocket, so optimization is their domain. It worked perfectly on my install, it is also extremely simple. However, it does not work yet with WP/LR Sync.
- CDN77. The best CDN for me currently. It is amazingly fast, the system is very neat and easy to install. I am currently using it for my websites Haikyo and Offbeat Japan.
- MaxCDN. Another good option. The most famous CDN service. Affordable, fast, but slightly more difficult to set up than CDN77.
- CloudFlare. If you are looking for a free alternative, then have a look at it. If you are looking for performance, the services above are better, but you can still use CloudFlare for security purposes (it has a lot of features).
- Fastly. If you are looking for the best performance possible, and if you have a technical team and quite a lot of money, then you might be interested in it. Their speed is the most impressive.
Today, there are two solutions I recommend. They do it all, they optimize your content on their own servers (so they don’t modify your own files and don’t use your server to perform that job) and they serve them using a CDN. Of course, that is more pricey, but it worth it.
- Optimole. Very easy to set up with their WordPress plugin. It works right away. They also have a very nice feature for photographers: the watermark can be added automatically added through their service, on the fly! I am using Optimole on the Meow Apps website.
- ImageKit. Easy to integrate. You can open an account using this referral code: syue6870. You will get 10% off.