We’re a few weeks into the world of WordPress 5 and Gutenberg, and the hysteria has quieted down a bit. Maybe it was the holidays, but now that the new year is here and folks are back to work and school, I’ve seen an uptick in reports of sites breaking when they are updated to WP 5.

Specifically, I’ve had a few client sites where the customer has updated WordPress to version 5 without telling me and lo and behold, their sites decided to break.

I’m sure many agencies haven’t had enough time to go through all their client sites to ensure everything is going to be OK, but every time my clients log into their site, they are seeing that “Update to WordPress 5” nag alert bar, and so they do it.

I don’t want them to. Not yet. So I asked on Twitter if there was a way to disable that notification, specifically.

Jay Hill jumped into the replies and developed a nice, small plugin that will hide that WordPress 5.0 upgrade nag.

You can find the plugin at Github. Thanks, Jay! This is a nice, quick thing to add to sites until we’re ready to update them. If you don’t want to add the plugin, you can probably just add the couple of lines to your functions.php file.

We should probably have a talk eventually about plugins and themes abusing the notification and alert system, but that’s a conversation for another time.

I love WordPress. I’ve built sites large and small with it. I’ve spoken about it at conferences like WPCampus. It’s been exciting to watch it grow since I really started using it in 2008.

It’s plugin system allows new and experienced developers to add functionality, features, and tools to their websites in an easy and intuitive way. But with great power comes great responsibility. It’s not uncommon now for websites and pages to be over 3MB in size including images, css files, and javascripts. Last year, Wired ran a story saying that the average webpage is the size of the original shareware DOOM game.

I regularly see results like this from YSlow and GTMetrix all the time when I plug WordPress sites in to see performance data:

That’s crazy, but it’s what happens when you use a ton of plugins in WordPress. Each of those plugins will add their own CSS and Javascript files into the site. Add in the myriad of tracking scripts and beacons and we end up with a website or landing page that has 30 external javascript files. I fear the art of website optimization is slowly being lost or worse, skipped or ignored.

I’m most likely salty about this because I learned how to make websites in the days when the majority of our users were on dial-up connections. We worked to get every kilobyte we could out of our images in order to serve them just a little faster. Photoshop would even tell us how long it would take to download that image on various modem speeds.

Photoshop 5 Save for Web Dialog

Photoshop 5 Save for Web Dialog

 

There’s no reason for sites to be three, four, or even five megabytes in size. That’s especially bad in our current era of mobile usage. But there are easy things site owners can do to improve their site speeds.

A few thoughts on optimization

First, a question to ask. Is the functionality a plugin is adding something that you can accomplish by coding it into your theme?

It’s less taxing to input, for example, your Google Analytics or Tag Manager code in your theme’s header or footer file than use a plugin to do it for you. Not only do you remove the need for a plugin, you also do away with an additional database and PHP calls. The less calls to the server and to your database, the faster your site will be. You will also have less to manage in terms of plugin updates and security.

Can you accomplish things like animations and visual effects directly in your theme’s CSS or Javascript? If so, put it in your existing theme’s structures. Better yet, ask yourself if you really need that animation or effect in your site. It’s fun to see an image pop or fade in on first view, but once I’ve seen it, the thrill is lost. Does that animation meet accessibility guidelines? Save file space, and reduce or remove animation effects.

Second, there are times you need multiple plugins due to your site’s requirements. In that case, it makes sense to minify, combine, and cache as many of your static files as you can. I have used Fast Velocity Minify and Autoptimize to do this heavy lifting for you. These work in the background to combine those 30 CSS files into one or two files. This will allow them to be served much faster. Combined with good caching, your site speeds will improve.

Don’t forget to optimize images too!

Optimization Recommendations from GTMetrix

I’ve spent most of this post talking about JavaScript and CSS files. Another culprit when it comes to increasing site sizes are images. If you are exporting files directly from Photoshop, you may not be getting a fully web-optimized versions. In most cases, your images could benefit from additional optimization.

I’ve blogged about options like ImageOptim and TinyPNG before in this post. If you don’t want to add a step to your workflow, or perhaps you have users who are uploading content to your WordPress site, you can do optimization on the server side.

There are several plugins and services that will optimize your images for you when they’re initially uploaded. Some will also go through your media library to optimize previously uploaded files.

One such tool is EWWW Image Optimizer. They offer a plugin that will do the optimizations right on your server. This is a good choice if you’re on a dedicated server or VPS. This free plugin will optimize your images right on your own hardware.

If you are on shared hosting, or use a hosting service like WPEngine, this type of local image optimization plugin may be blocked. It uses processor and memory power to run, which can impact performance in shared environments. Worry not, EWWW has an option where they will optimize your images in their cloud seamlessly and return the file to your site. This means you can use it at hosts like WPEngine.

Wrap Up

Whether you are an experienced developer, or someone relatively new to WordPress, it’s worth the effort to make your site as fast as possible for your users. There are tools to make this process simple, and more importantly, automatic. Your users will thank you, Google will thank, and I will thank you.

There have been several high profile plugins lately that have been found to be posting spam and deceptive links on user’s blogs lately.

One such is the “Display Widgets” plugin. You can read Wordfence’s detailed breakdown of the spam. It turns out the original developer of the plugin sold it, and the new owner started to place spammy backlinks and other bad code into the plugin. This gave this “developer” access to tens of thousands of blogs and the site owner’s never knew it was happening.

Continue reading