Jack Lenox Interview - Web Sustainability, The Last Frontier

Howdy WordPress Nation, we are back with yet another enchanting chapter in the Pirate Interviews series! Jack Lenox, a Software Engineer from the  WordPress VIP team, will be our guest today and he is going to share his insights on web sustainability and reveal his strategies to make more energy-efficient websites.Before we get started, I need to give a shout-out to Francesca Marano from SiteGround, with whom we had the pleasure of talking last month.  She shared her tips and tricks for helping entrepreneurs achieve more when networking. If youre looking for more insights from the people who have an impact on WordPress, you can  follow them on Twitter. Also, you can check our  interview directory  for other insights from the experts.Jack Lenox is an environmentalist and tech aficionado. He knew from an early age that he wanted to make the web a better place  (or was  it the world?), but it was his ancient historical studies that put his career in focus.Youll also discov er that Jack had decided to dive to the depths of the web long before he joined Automattic.His passion for creating websites led him to acquire enough skills in terms of CMS that he managed to embark upon a career in WordPress, the heart of blogging. Speaking of which, he also wrote an article about delivering WordPress in only 7KB in which he reveals how Susty (the tiny WordPress theme) was born.Now that you are more familiar with the topic, Im sure youre ready to find out more about this. If youd rather choose the video over the text transcription, make sure you open the Twitter thread. Each question has a separate video.We were lucky enough to interview @JackLenox at #WCEU last week. He talked to us about sustainable web design and how easy it can be to get started.Unfortunately, Twitters video restrictions meant we needed to edit for brevity but the full interview will go on YouTube soon. pic.twitter.com/sjfpkT5hz7 Codeinwp (@codeinwp) July 1, 2019 The interview has been edited for clarity and brevityYoure the creator of Susty, that tiny WordPress theme. How big is it?Jack Lenox:Well, it depends on how you configure it, but 6 KB is what I got the home page to. So, obviously the theme is small, but you could put a huge image which would blow that right out. Yeah, 6 KB-ish.How long did it take?Jack Lenox:About a day (laughs). It took a bit longer. Its funny because I sort of talked to people about it being the thing that took the least effort to get the most amount of applause.I was mostly just removing things, so I wanted to get everything out of the theme, except the things we absolutely need. So I started with Underscores. Underscores is a starter theme for people who arent familiar with it, produced by the team Automattic. And its already a bare-bones theme, but there are lots of things in there.There are also assumptions made in Underscores that fit in with a traditional way that we do with theming in WordPress, like having a sidebar and widgets areas. I took all of those things out and I also cut down some of the markup, because I was getting into some fine-tuning; some of the divs and stuff that dont really need to be there, and other elements.Its very lean Underscores, but I was cutting even the CSS they had back and had the bare minimum I think I could do. So yes, it took a little bit of time. It probably took more than a day, but it didnt take very long.How did you get started in WordPress?Jack Lenox:When I got to University and having this hobby of doing websites, I got involved with setting up a student newspaper and then we needed a website. I thought there has to be a better way than using these crazy content management systems I had been making.At that point, Ruby was becoming a thing, so there were different approaches, but I knew PHP and SQL and thats kinda all I wanted to do, even though some people criticized that. WordPress came on to my radar and then I started playing around with it and from the beginning it cut o ut so much of the work, just having a CMS thats working.Ive always been a bit of an outsider, because Ive always liked this sort of unorthodox use of WordPress. So, for me, WordPress has always been the CMS. I was like I need to build a newspaper website, so lets build a newspaper website and use WordPress.When I first started using it, I didnt have custom post types. It was 3.0, pretty old. So I remember doing a lot of weird hacks for creating galleries, that old stuff that people used to do back then.Then it kinda evolved and I ended up coming out of University in the middle of a recession. I was trying to become a journalist and it wasnt an easy road. But I had built up all these web skills, so I worked at a consumer finance website where I was a journalist. I quickly got on to working on their website and I said: your website is terrible. Then, they wanted to shift it on to WordPress and I was like Ive just been learning WordPress. And that led to more and more of that.Where are you working now?Jack Lenox:I work for Automattic. In 2013 I joined Automattic, having done a few different agency jobs. Then, in 2016, I moved from the VIP team which is kinda within Automattic, but its quite separate. And now I work on big newspaper websites. Things like 538 and weve also got The Sun in the UK, which is a big newspaper.And then, weve got all sorts of other clients; weve got Metro, which is one of the free papers in the UK. In the US, all of CBS is on there all of their local sites. Facebook and almost every site that isnt Facebook.com is on WordPress VIP. We host a lot of blogs like Spotify, Airbnb blogs and so on.What can small business/websites owners do to make sustainable websites?Jack Lenox:If youre a small business, there are a lot of little things that you can be doing. Obviously one of those things is trying to choose a performant theme. Its a little bit hard to work out which ones are sustainable. Id love to include some sort of grading in the theme repo sitory.There are a lot of things like YouTube embeds if you actually embed a YouTube video, that would take about 1 Mb download just to show the embed before you even click play.   And both from a performance standpoint and a sustainability standpoint, you can say, if everyone is going to click this, if it is embedded on the page, if its a virtual tour of our hotels, then youll probably want to embed it. But a lot of time, people do that. Its that kinda stuff that gets in the way. If most people arent clicking it, then, you know, it doesnt need to be embedded.You could just have the link to the video, or you can have a static screenshot image. The point is making your site as accessible as possible, so people arent wasting time roaming around it. Its not just performance, its not just usability, its also energy usage.And then, there are some plugins. For example, you should be using a plugin like WP Super Cache, because you dont need to configure it. Youre not configuring NGINX o r Apache, for it would just generate HTML and static pages and serve those instead of the dynamic ones. If youre kind of a web administrator, add WP Super Cache and activate it. Its a really great plugin.What can developers do to make more sustainable websites?Jack Lenox:Its pretty wide-ranging. First is getting as up-to-date as you can, with the latest performance techniques. For example, if youre in a position where you configure servers, theres a new compression mechanism called Brotli, which Google has produced and Open Sourced. Its even better than GZip.Then, it is about how you build your product. The quote I have from Peter Pickering that I really like is: The most performant, maintainable component you build for your website is the one that you dont build.  So its kind of a minimalistic approach. I am not saying take all of your graphics away, but make it really nice.So yeah, think about all the way down to your divs and what CSS preprocessors youre using. Also, think abou t what kind of CSS thats producing, monitoring all those kind of different bits of code that youre producing, setting performance budget and setting yourself a target on how big your webpage is going to be.Id suggest something like half a megabyte. I mentioned Thought Company, the article I showed was 200 KB and thats fully designed. Thats a proper publishing house and they are doing that kind of thing.The other thing, if you were in a position to do this, is to be powering your stuff with renewable energy, because that really helps. So, weve got quite a few hosts in the UK. You can use Google Cloud platforms.You can actually like the AWS Frankfort data center, for it is the sustainable service petition. They have a whitepaper that links from that petition and it is only about 5 or 6 pages. It is really interesting to read through and see what the technologists in this sphere have been doing.Who is doing good sustainable work in WordPress right now?Jack Lenox:I think the leader is  Wholegrain Digital.  I know Tom quite well and weve chatted quite a bit, so its cool because not many people are doing stuff about this. So, to have a company as influential as Wholegrain Digital in the sphere in WordPress space, I mean its pretty awesome.Theyve obviously built this website, which is the tool that tells you what the carbon footprint of your website is. Theyre doing a lot of work as a company, so theyre disclosing all of their carbon footprint data based on everything down to employees commuting into work. And if they were coming to a conference like this, they would be measuring everything. They would be encouraging people to go by train. Theyre definitely the out and out leader.There are kind of some peripheral companies as well that probably not everyone will know.   For example Mightybytes, which is a company run by Tim Frick. Tim wrote the book Designing for Sustainability.MightyBytes actually does a lot of WordPress work, but theyre one of those agencies that you wont see as much at WordCamps. They are not as much in the community, because they also do Drupal. Theyre a multi, not just a WordPress agency.In terms of individuals, someone like Justin Tadlock, who I shouted out to in the talk, I dont think hes making things for sustainability, but he happens to be doing it by accident. So high five.Where do you find the line between sustainability and profit?Jack Lenox:I would say Google should do whatever they can to make their platform as sustainable as possible for free. If the premium apps, like if its hanging around, wed stop playback of video. I dont know anyone on the YouTube team or anything.   Id love to know a bit more about how they came to that decision.Chris:Yeah, its weird because there are options where you can get streaming music for free, like Spotify free. Its really good so I understand its a requested feature, but I dont think its make or break.Jack Lenox:No, you wouldnt think thats the only reason people are going for premium, so Id like to see them take it out. For the study as well, guys at Bristol were looking at one. They were like: whats one design change that YouTube could make? And thats was the one they hit upon.I think there are hundreds of changes they could be making and they do. These companies are really performant. But its thinking about the actual design of the site and how people are going to use it, and if it is as efficient as possible. That comes back to the designers and it comes to user experience.Jack, tell us about Googles sustainable effortsJack Lenox:You have to take your hat off in all different ways. Theyre running the Lighthouse project which is a performance auditing tool. It is built into Chrome, you can run it standalone and its open source. Its being led by Paul Irish, one of their celebrity web developers. They severely audit all of their own stuff. You know, the performance of Google their homepage over the years. Its obviously a very simple page in and of itself, but they made that faster and faster.They also rank a part of the weighting of your search engine ranking, so the more heavy your site is, the lower your ranking. All of these things are encouraging a more performant site, which in turn is more sustainable.The cloud platform is, through offsets and other things, effectively 100% renewable, which is pretty huge. They are way ahead of Amazon in that regard. Alphabet is the biggest corporate buyer of renewable energy in the world.Obviously, as someone who is environmentally minded, you think they could be doing more. A lot of their energy setup is through offsetting. Theyre buying renewable energy in Canada and feeding it back into their grid. But if youre ramping up your energy at the speed the Internet is, were going to run out of options. They need to be building solar farms and they need to be building wind turbines themselves. Or at least funding them to power their data centers, so they need to be truly green and its a bi g challenge.How can you handle unsustainable requests when working with clients?Chris:When you talk to the clients and they are like: Woah, I want that carousel in there. Where are the share buttons? How are you talking them out of that?Jack Lenox:I think if you have it, the best thing you use is data. Its proven across the board that the bigger and heavier your website is, the more you lose people. The more you lose customers, the more you lose readers. The more you lose, youve dropped down the Google rankings, because thats part of their measure. There are so many reasons not to do it.Certainly, I think there has been a shift. Weve never really done frontend code reviews. We do code review for the security and everything else, but clients are increasingly saying we want our site to be better. Because we sell speed, but we cant stop you adding two hundred images to a page and it being slow.We serve them as quickly as possible, but that doesnt matter. Or, if you have some massive bl ocking JavaScript thats going to happen and youre going to come up bad on WebPageTest. Clients are increasingly actively wanting it as well.I think the third thing you could do there is doing user research and the more you can do that with the client. User research sounds really expensive. You think weve got to book a room, pay people to come in, test the website and ask a load of questions. Or, you can literally go sit in a cafe and go up to someone and say: Excuse me, do you mind if Iwould you test my website and Ill buy you a coffee?You can spend an hour in the grand scheme of things for even a freelancer, agency. But if you cant sit and demonstrate to a client that the user doesnt like a carousel, so you compare the two and you say thats definitely because users dont like carousels.They dont interact with them. 98% of people dont click them. Thats where you end up with your hardest evidence. Youre like: Look, all these people, they dont like carousels.Will sustainability be the next big movement in tech?Jack Lenox:Well, it is really interesting, because sustainability does encompass all of those practices. So I dont know if people capture the imagination in quite the same way as other paradigms shifts have. We are definitely seeing a lot more companies competing, in terms of how sustainable they are, even banks. Its what everyone wants to be saying theyre doing. And obviously, making a website more sustainable is one thing, but I also want to try and drive it to companies to be more like Wholegrain Digital and to disclose their carbon footprint.To be thinking about WordCamp Europe, Id love to see a carbon footprint analysis of this whole conference. The point is, once you start measuring stuff, you can start changing stuff.  So if WCEU does a carbon footprint analysis, its probably too late now. They can think about what can we do to make that better next.The impact of measuring creates an actual number that you can then start to shift. Id love to see th at happening within web design and within the web industry. Thats the thing. It gets in the collective psyche to have people writing about it and talking about it. And one of the big things is talking to other people about it. Jack Lenox (@JackLenox) #interviewed at @ThemeIsle - on #sustainability with #WordPress Click To Tweet That sums up our Jack Lenox interview.  If you enjoyed it and want to learn more, please leave your comments in the section below. Also, if you have any ideas for who we should talk to next, feel free to share your suggestions with us!Free guide5 Essential Tips to Speed Up Your WordPress SiteReduce your loading time by even 50-80% just by following simple tips.