Welcome to Press This, the WordPress community podcast from WMR. Here host David Vogelpohl sits down with guests from around the community to talk about the biggest issues facing WordPress developers. The following is a transcription of the original recording.
David Vogelpohl: Everyone, welcome back to Press This the WordPress community podcast on webmaster radio. This is your host David Vogelpohl I support the WordPress community through my role at WP Engine. and I love to bring the best of the community to you here every week, Press This as a reminder, you can follow me on twitter @wpdavidv, you can subscribe to Press This on iTunes, iHeart Radio, Spotify, and download the latest episodes in wmr.fm. In this episode we’re going to be talking about avoiding speed traps when making your WordPress site faster and joining us in their conversation is Mr Shane Bishop of EWWW Image Optimization Plugin, Shane. Welcome to Press This.
Shane Bishop: Thanks, David, it’s great to be on here. Looking forward to it.
DV: Yeah, absolutely. I know we got a lot of fun stuff to talk about and so for those listening just to kind of orient you a little bit, really what we’re going to be covering today is how to support your teams and making performance ongoing focus not a one time project, but something that they focus on for the long term. And really, to think about why teams get bogged down and don’t make performance and ongoing practice in your brand or agency or wherever your team happens to be serving. So, this is near and dear to my heart, Shane. You know enjoyed working with you over the last few weeks we have a pretty special announcement. Actually around the image optimizer plugin for those that happen to be WP Engine new customers you might be familiar that EWWW Image Optimizer was actually on WP Engine’s disallowed list, and was amazing to learn about the plugin per se is a wonderful plugin, of course, it just there was one platform compatibility issues that changed. We’re working with us to resolve that. And get off of the disallowed plugins list.
SB: Absolutely, it’s it’s pretty exciting after I think it’s been six years since we launched the alternative version the cloud version just for WP Engine and then several other web hosts jumped on that. But to finally be able to streamline things and make it easier for people to get up and running with EWWW Image Optimizer it’s pretty exciting.
DV: All right, well that’s good to know yeah and I know, as you mentioned, you had the cloud version so customers were still able to use the service just through the other version, but to have that be a more fluid experience for our customers. We have a lot of customers and even staff that are fans. One of our engineers gentleman named Nate gay actually wasn’t the one that essentially opened the ticket on our side to help resolve this. And that’s, you know, one of my favorite things to do is to work with folks and get renewed we did WordFence a couple months ago so that was fun. In any case, we’re talking about performance today want to kind of hear your thoughts on all this Shane and think about how teams can, you know, keep that practice up over time and what are the speed traps if you will prevent them from doing that. But I was wondering if you could quickly tell me your WordPress origin story, what When was the first time you used WordPress.
SB: Yeah, it’s been a long, long time. I was thinking about it this morning, and I believe it was, sometime in 2005. One of my friends. We were talking about websites and. And I pretty much just dabbled in doing straight, HTML and he said hey you should check out this new thing called WordPress. And so, I installed it on, on Dreamhost server, I believe, at the time, and started messing around with it, and it was about six, seven years before I actually started trying to do anything business wise with it but it was just running my own little personal blog and posting pictures and have fun putting stuff on the internet.
DV: I like that you know what year it was.
SB: 2005 I believe, is when I started so it was like 16 or something. I mean it was, it was a lot different than than what we have now. Wow. I mean it’s kind of incredible to think about the progress that’s been made in those 15 years.
DV: Yeah, when I say plugins and themes came out five, yeah, very early days. Okay, so I gave a little bit of a preview about it earlier. And I was wondering if you could just tell help others understand like What do y’all What do y’all do what value do you provide the site owners.
SB: Absolutely. And that’s kind of continuing from the WordPress origins side of things. So I tried to start a little bit of a business doing websites for people in 2011. And one of the things I ran into early on with website I was working on for my wife’s parents was image optimization, and they had a greenhouse and lots of fantastic plants and flowers and I was like we gotta get good pictures on here, you know, got to show them off and so I was putting pictures on there. And I knew from doing some other websites stuff at my job at a community college that we wanted to try and make this fast, keep the images optimized. So I thought, well, I wonder what WordPress has for image optimization plugins. The short answer was not much. So I took one of the existing plugins EWWW Image Optimizer. And the goal is to not have to basically optimize these images before I upload and I have to worry about installing software on my computer to do that and just be able to have WordPress do it automatically. And so I rewrote the existing plugin that was out there, and made it, capable of using JPEG trim up the painting, and give us a goal. Some command line optimizers and launched in 2012, in the first week we had 500 people download it, I was like, well, that’s crazy. So I kept working on it in my spare time, and a couple years later. There were a lot of web hosts like WP Engine that were not comfortable with, allowing exec. And not to mention the the performance implications of compressing images image compression can take a lot of memory, and a lot of CPU. So there were a lot of web hosts that weren’t real keen on on having those local image optimizers. And so, in 2013, we launched a compression API, which basically just offload the compression until the cloud version has worked from day one is using that API to compress images.
DV: That was literally my next question was are you offloading the image compression, which I think is fantastic. And, you know, I think as we think about the topic of the show. This episode if you will, you know, avoiding speed traps and how do you make this an ongoing part of your process. Obviously, using solutions that automatically optimize images to achieve performance as you build your site, but to also take advantage of offloading so you’re not taxing your web server stuff like this to me is just like one of the top bullets in this overall strategy of like how do I get my site faster over time. So that’s why I’m glad to have you on and talk about this.
SB: Right, right. And so, just to throw this out here. A lot of people aren’t don’t realize how much of a strain that can put on a web server or how much resources it can use. And when I started the plug in, I was using Bluehost. You know, it’s kind of your average, I mean they’re maybe slightly above average are pretty good, but we’ll bad mouth them too much, but they’re just sharing hosting you know you got hundred, maybe 200 other sites on on a server. Of course they’re huge servers, but still there’s a lot of sites on there that you’re sharing resources with, and to try and compress images with the free version of you that just does it all on the, on the local server is not very awesome to your shared hosting. As an example, if you, if you take, oh yeah and then it, it not only affects you know all the other customers on there it’s affecting you too, if it affects them It definitely is affecting your, your performance. So something like a 10 meg image, which is not uncommon with our digital cameras, nowadays, can take 100 200, maybe 500 Mg’s of memory. And that’s a lot. And if you get bigger, we’ve had images on our API that take five six gigs of memory.
DV: Everyone, welcome back to Press This the WordPress community podcast on webmaster radio. This is your host David Vogelpohl and we’re in the middle of our episode around avoiding speed traps when optimizing for performance with Shane Bishop. Shane before the break you were talking a little bit about how you know the size of images available to people, as they’re building out the experiences on the web is so large, there’s this kind of need to make sure that you know there’s proper compression workflows if you go for optimizing those images as they go into the site, kind of, were extended that. But I was maybe, hoping to answer another question I got here. Why do you do t What do you think teams, often don’t make performance optimization a priority over time like it feels like a lot of teams do it and they’re like we’re gonna make the website faster this month, and then they don’t do that again for like another year. Why isn’t it something that teams do.
SB: I think part of it is not having something that routinely reminds you about your performance. I mean we’re all busy. And so, you almost need something that’s going to kind of interrupt your flow periodically and say Hey, have you looked at your website performance lately. And that’s something I appreciate in that regard is WP Engine’s performance tests were even for you I oh I you know compress my images I install our plugin, of course, and for the most part, don’t think about it until every month I get that email and I go, oh, is there anything I should be looking at, you know, and so it’s good to have those reminders built in. Whatever service you use there’s there’s various different services you can have that’ll test your site on a regular basis. I believe even Google’s PageSpeed Insights has some integrations. I’m not sure if it’s with their analytics platform. But I know customers who’ve talked about oh I got this thing from from Google and they’re saying my speed is slipping. And so, find a way. Find a platform, whether it’s WP Engine, or, or whatever you’re using that you have consistent reminders over time to look at your performance. So bottom line I think it’s just buisiness, we forget.
DV: Are you a fan of people working those performance tests into their deploy cycle, meaning that as they make new things they when they go through their QA checklist that speed is one of the things they check.
SB: Oh, absolutely. I don’t think you should launch the site without going hey how’s this performing. I mean you could launch a site that’s taken 20 seconds to load without even realizing it.
DV: So even though people are updating though, are you guessing you’re also a fan of testing that update meaning if I’m going to add something to my site, I still want to go back and check my load times.
SB: Yeah, I mean there’s stuff that we’ve added over time on UI Oh, that have added in different JavaScript bits or CSS. And all of those come with a performance penalty, sometimes not a big deal. Sometimes it is. So it’s always good to go back in. Maybe not every single update, but like said regularly, at least once a month or every, every other month at the at the longest I think just check on don’t stress out about it every day, but make sure you’re doing it regularly.
DV: Like that i have i’ve coined a phrase around that is that KPI don’t move unless you observe them. So it sounds like your recommendation here is observe this KPI so that way you’ll know when you should be doing something. So you talked a little bit about this notion of like as I’m adding to my website or adding elements to my website I might be affecting performance, and that’s a trade off right that might be okay, I might need that Salesforce, I might need that. You know retargeting pixel or whatever it was in the basement a little bit slower. How do you think of that like over time as teams monitor for performance and think about this trade offs like, how do you know when that trade off is too high.
SB: Yeah, well, it’s a great question. I don’t know if I have an amazing answer for that but you know you look at a guest look at yourself and say you know what, what am I willing to deal with on other websites, you know, and, you know, five seconds, probably too much, I mean there’s there’s research out there that typically will tell us that you know if it’s more than two to three seconds, you’re making your visitors uncomfortable. You’re making them wait you’re triggering innate responses in the brain, it’s not even just this modern fast paced busy society. I mean, 1000 years ago, or people’s brains are still wired the same way that they didn’t want to wait. And so having this delay when you’re just sitting there staring at a blank page is is never Great. So the less of that you can have, the better.
DV: So it sounds like you’re saying kind of basically like set a benchmark if you will. I’ve heard the two three second thing a lot. I’ve also seen a lot of studies talking about even incremental, you know, improvements to page load time resulted incremental improvements to conversion rates and revenue. So like that’s a really tangible and material thing but it sounds like what you’re saying as you’re thinking about the balance between what you introduce and its effect on page load time. Seems like what you’re saying is I come up with a goal or benchmark and try not to exceed that as you add these things
SB: Tight right i mean kind of draw line in the sand and say, This is the line that we’re not going over and I’m gonna go past two seconds. If you pick that. Then if you add something in it pushes you to 2.1 seconds. See what you can do to fix that. There’s certain things you can add, for example with like a MailChimp pop up window or you might add something in from your Help Desk that’s gonna pop up on the side, if people need help, you know those things will add it. Some of them a significant amount of upload time, but they don’t actually affect the user on the front end, because they’re, they’re loaded asynchronously and that’s something we’ll get into here in a little bit, but that can be one of those ways where you can say okay we can add this but as long as we do it in an async manner and something massive, we’re okay.
DV: I left he his web page test that works filmstrip view for that right like you can pull like a little timeline strip back and forth to see like in one second, that the site look like x makes it a little bit more intuitive for interpreting people’s experiences and certain time points, versus like staring at the waterfall graph and being like, oh, what happened. But that’s that’s a really good point that even though things might take longer to load relative to the KPI you measure the person’s experience with it might be different or might be acceptable. So we talked about how adding images or strictly an optimized images over time can make a site slower. What are other things that you think teams do over time or don’t do over time that lead to a slower website.
SB: Oh, we’ve kind of already touched on one of the other big ones that, I think, and that’s JavaScript and CSS. Next to images. That’s usually your second biggest payload is all of your JavaScript, all of your style sheets. I’ve seen some sites that have like 150 of them are 200 even, and it’s just, It can get out of control really easily. You start adding in your analytics and your help desk and your email marketing, and who knows what else. And, you know, you might have a slide or you might have three sliders. If you have a page builder that might add in some stuff, and so it can be really easy to let that that CSS and JavaScript get out of, out of control and those are the two biggest things. As far as, as far as payload. Yeah, the other is kind of one of the first things I was looking at, though, is the server performance, and that, but generally, not always, but generally comes down to your web hosting. So, getting a solid web host. If you care about performance. Don’t go cheap. Not that there aren’t some cheap, really fast web hosts. But usually you’re gonna pay a little bit more for performance.
DV: And the idea is there, over time, if you’re on a server or whatever I suppose with low resources that as your site becomes more popular and more complex over time, you might start taxing those resources weren’t so even though it may be completely normal activities, if you will, to add to your site, over time, you can start eating away and the experience that people have when they actually visit your website. So I think it’s interesting so we’ve got kind of this deck degradation if you go on site speed around images around letting those JavaScript libraries feel too large and I use a Chrome extension called ghostery they’ll tell you all the libraries particular sites using it is kind of a scary way to see what else going on behind the scenes is a very easy way. I know that’s been a big help for me as I would insights I was optimizing in the past I think this is a really good tips. Absolutely questions for you but we’re going to take a quick break and we’ll be right back.
DV: welcome back to Press This the WordPress community podcast on webmaster radio. We’re talking about avoiding speed traps with site performance optimization with Shane Bishop of EWWW Image Optimizer. Shane before the break you were telling us a little bit about what you thought. Makes site slower over time. In other words, it’s not just that people aren’t optimizing but rather they could be doing things and actually heard that that was an interesting way of thinking about it from your perspective I wanted to talk to you now about speed tools. We talked a little bit earlier about how monitoring observing your KPI will help the move up or down and the KPI that people kind of obsess about these things sometimes PageSpeed Insights by Google they people just go nuts over the scores.
SB: Yeah, it can be tough not to get bogged down in that I mean, I think it’s just a natural thing where we want to get to 100, you know, I mean ever since grade school would want to get the perfect score you don’t want to be the guy getting the 60, or worse, you know, as failing right. So, they’ve kind of gamified this so that we’re inclined to obsess over it, but it can be too much for you. We’re trying to knock off every little point. So some of the things that I look at are well how does this affect the user, you know, is this something that only the speed test really cares about, or is this actually affecting my user score and then you don’t have to have a perfect score to have a fast website, you might have an ad and your site might be blazing fast I’ve seen multiple sites like that where their time to first paint was phenomenal like half a second, like how can we make this faster. Our load time is like two three seconds and I’m like, but your paint time is your user facing time is not two three seconds it’s half a second. You’re doing awesome. And sometimes people just need that reminder that okay I am doing okay I’m, you know, I am helping my users and that’s, I think the balance is remember why you’re doing this. It’s not to make Google happy it’s not to make the speed test happy because they don’t care about your site. It’s for your users it’s for your visitors it’s for your target audience, the people you’re trying to help. That’s why you do everything you do. If you’re doing it for any other reason. Stop.
DV: I love that. It’s why I keep going back to that filmstrip view which says I’d like to know what people experience and that, you know, millisecond or second or whatever it is really makes it real what’s happening on the page I love the other example I give for folks around this is, I can make a web page with a single period on it, that has no CDN. No compression no optimization at all but will load in basically no time at all so we’ll have a perfect score on these things. But it will be the world’s fastest web site. Right.
SB: Right. Well, there’s a site I ran across a while back. As I was looking at a recommendation that I still don’t see that I’m just like, there’s no way that makes any sense. And you go to this guy that’s kind of one of the top or he is the top result on Google for it. And you can see why his site is fast and why he doesn’t care. You know that he’s done this crazy weird recommendation, because his site is ugly. It’s a black and white. I mean, not that you can’t have a black and white site but that’s all it is, it’s just text. Hardly any CSS is like okay that’s fun.
DV: I know it’s so funny. I often think of this as like almost like the balance of suffering and joy a little bit and say, you want to make it faster to deliver joy, but you’re adding stuff to your website that you know is going to tax that, but it’s it’s this notion of language when, when is speed the right decision, versus when is experience the right decision. And, you know, trying to find the balance between those two I guess it’s going to be for always forever complicated or complex but I think that’s what keeps us all employed What do you think,
SB: Definitely. Yeah, it’s always finding that balance and being able to improve the performance without spending ludicrous amounts of time on it because for most of us, that’s not what we are building our website to do or not we’re not doing it just to become WordPress performance experts. So we got to get back to what are we doing how are we helping our customers and get back to our core mission.
DV: That’s a wonderful place to end this interview on Shane it was we had more time and there’s so much more to talk about here. I just wanted to thank you for coming on today. Yeah, for sure. If you’d like to learn more about what Shane visit EWWW Image Optimizer, that’s spelled e www. That’s three W’s. But thanks everyone for listening to press this the WordPress community podcast on WMR, this is your host David Vogelpohl, I support the WordPress community through my role at WP Engine, and I love to bring the best of the community to here every week.
No Comments