 Something we're certainly looking at more and more in the community is how do we literally tie up our codes and things we do to lessen the environmental impact? And Simon is going to talk about this and I can get this right. Please say I can get this right. It takes a second. Go ahead. So please give Simon Craft your warm welcome. Good morning. Ooh, exciting. Yeah, my talk is called WordPress for Future. I derived the title from the Climate Change Movement Fridays for Future as you might already have figured out. And in fact, I'm going to talk about Internet's environmental impact. I will not try to discuss with you if climate change is a real thing or if humans caused it because I have like fixed... I think it is, yeah, so... Also, I won't be able to give you any kind of final solution to the problem. And there won't be a single line of code in this talk, even though it's in the developer track, so... I'm going to show you how we all can participate in how we can save our planet's climate. But before we start, I have a small slide to introduce myself. I'm Simon. I traveled all the way from southern Germany here by train this week. I was like 20 hours in the train. It was really nice. But having been able to spend a day in Glasgow yesterday, I have to say it's absolutely worth it. My first time here and it's lovely. I'm a WordPress developer since 2008, so about 12 years by now. And almost since the beginning, I'm a community organizer in Germany. So I started two WordPress meetups, I organized two WordCams over the years and spent quite a lot of time for the community. Also, I studied biology before I got into development, so I have a special take on the topic as well. Let's start by taking a look at the world we know today. This is Earth. You might have seen it somewhere. This picture was taken during Apollo 8 in the late 60s. It's called Earthrise and it inspired a whole generation of environmentalists to take action and save our planet. Over the last decades, they did take action and they were in parts successful. But despite their efforts, the world we live in today is not the world from like 100 years ago. This is a not so nice example of this. This satellite picture was taken in the mid 80s. It's the Icelandic glacier of Ogyokul. Ogyokul meaning glaciers or like just going to call it ok. This is the glacier we're talking about. And in the mid 80s it was like decently sized. In the meantime, and the next picture is taken in the summer of last year, the glacier vanished. It's simply not existing anymore. It's the first glacier in Iceland, this fate, but not the first glacier globally. And it's the thing that happens all over the world. And vanishing glaciers have like huge impact on local ecosystems and the global ecosystem as well. But then there's another world, the internet. That's where I come from. The internet is a place where everything seems possible. And most of our actions don't have any real consequences. Except maybe if you are buying a dishwasher drunk only somewhere. In the web, most of things are free, more or less. But in reality the internet looks something like this. It's like a lot of computers spread all over the world in data centers serving data to all of us. And this is kind of the problem actually, because this thing is a giant machine. It's huge. And estimates show that it's consuming about 10% of today's energy output worldwide. It won't shock anyone of you if I tell you that the internet is still growing. Yeah, it's a thing. So estimates show that by the end of the decade the amount of energy consumed will be doubled. And that's mainly a problem because it's often coal powered. Non-renewable energy all emitting carbon into the atmosphere. At the end of the day we are the problem. We meaning you, me, your friends, your cat, your smart connected toaster, I don't know. Because all of us we serve quite a lot. My tea study from 2013 shows that every American citizen is online for 24 hours per week. It's like the amount I spend online just today during breakfast. The average American. And at the same time websites we tend to visit get bigger and bigger. In 2010 the average website size was around 700 kilobots. By 2011 it was a megabyte skyrocketing all the way to 2.5 megabytes in 2016. Which is the newest number I could find. It's probably way higher by now because it's like four years ago. That's analysis done by QCDN in 2016. And why am I showing all of this? It's quite easy because every megabyte or every byte of data to be transferred from a server to your devices uses energy and at the same time emits carbon to the atmosphere. So that's quite a direct link we can take from the amount of data transferred to the amount of carbon emitted. Yes there are other measurements you can take like rendering performance of a website or JavaScript stuff. But all of this draws in comparison to the measurement of megabytes and energy per data transferred. The data transferring is... We can cut it up in three pieces because the energy is on the one side used to run the servers. Our data is stored on. About a third of it is going to network stuff. So transferring it from the server to our homes and from our routers to our devices. And about 40% to the devices themselves. So my computer, your smart phone, your smart toaster. All of the things I cite are linked in the slide so afterwards you can look it all up if you want to. To have like a real world example of all this, I picked the website. And when I first heard this talk in Zurich last year, I thought about picking the WordCamp's website. Which is quite an unfair comparison because WordCamp websites are really bad. And WordCamp organizers can't do anything about it because they're like centrally managed. So I started to pick the city's website. But over time I got stuck with the website of Cologne. Cologne.de website in Germany. It's the official city's website and I'm going to explain why I stuck with them. The site is about 2.4 megabytes if you load it. And doing some interesting math. We're going to look at that as well. And we can say that 0.5 grams of CO2 are emitted per page view of this site. And no one here has an idea if there's a lot or a few. Let me take a look at this. So the specialty about the Cologne is on their official city website there's advertisement. I don't know why there are banners and pop-ups and stuff. It's quite a lovely site. And because of this we know precisely how many people access the site every day. Or how often it's accessed. It's 1.144 million times. Pages means not only real person visiting the site, but also crawlers and the toaster. If we do the math on this we come up with 617 kilo of carbon emitted each day just from this one site. Or 18.5 tons per month or 222 tons per year. It's quite a lot. A kilogram of CO2 in like open space would be a spherical shape in like a meter size. So it's really, really a lot of carbon. And just by reducing this 2.4 megabyte site by just a couple of 100 kilobytes would make a huge difference seen over the whole year. But we are on a WordCamp and so the scale I'm looking at is quite another thing. Let's talk about a third of the web. That's WordPress's market share among content management systems. So thinking about website sizes adding up, data transfer, WordPress is quite a huge thing. And that's the first good news for today because we can change things. We as a community have the power to make sites smaller, more efficient and better performing in order to make it more climate friendly. And WordPress in this ecosystem is by the big player compared to other CMSs and like other world garden proprietary systems as well. The second good news is we don't need to invent any kind of new technology even though people are trying to do so. But we have like two or three really hard things to do in order to make WordPress more climate friendly. The first thing is culture. We have to change the culture of bloated websites because it's like a trend over the last couple of years that websites tend to get bigger and bigger. But by adding a lot of unnecessary stuff like auto play background videos or image sliders no one ever looks at. So we have to change our own values and the values of our clients if we have clients. On what we value as a good website and maybe not measured by the amount of animations we can stuff in there but by the amount of performance and simplicity provided by site. And to do all of this we need to get organizing like a group of people dedicated to that topic. Interesting. I divided working on sustainability to two kind of levels. The one is the more political level is community and the other one is a personal level going to look after so it's more doable for right now. But let's start with community. The community is technically able to do stuff. We just have to get doing it. The first step would be keeping performance in mind. In the front end so building performance for for building performance themes and in the back end. Because with this thing like things like the Gutenberg editor they might be a killer by the two able to shave off. The other thing the community is taking care of already is sustainable events events like this one word camps WordPress meetups. There are thousands of them over the year all of them cause like a kind of environmental impact. And that's not directly linked to this megabyte and CO2 comparison but it's part of the thing. And of the one side on one side you can use events like this to raise awareness of the topic like I do right now. On the other side you can try to make the event itself more sustainable as well. I was lead organizer at what Kim Stuttgart last year and in secret we like switched a whole catering to just vegan vegetarian options. There was no meat for the whole weekend. It was quite delicious. But we were able to cut our CO2 emissions down by a ton. Just this this one measure was a lot of other things we did. And if you do stuff like that it's quite important to document it because we cannot reinvent the wheel every time a new word camp is organized and you meet up. It's founded all new theme or plug in gets developed. I have to centralize this kind of information somewhere where everyone can access it and find the things they need in order to proceed. This is easier the personal level we all can just right now start with it. The first thing I wrote down I called a website grooming it's it's a exercise I force my clients to do with me all the time. And I asked the question is this really necessary. And then we take a look at the sites and ask this question of each and every element of the site. And if the answer is no if you don't need that nice shiny background video just get rid of it. And by doing so you kind of focusing aside more towards the goal you you're trying to approach. Another thing is sustainable user experience by trying to get your users to the information they're looking for easy and quicker. Maybe save them a click or two a page load or two in order to get there. And at the same time we can do a lot of optimization on other fronts like SEO accessibility as well. So in the end this this is the point where most of the of the clients are on the hook because if I and trust me I tried it if I tell them. Well your website is killing people. It doesn't work but telling them website ranks quite badly on Google because it's slow. This is where you get I told you that we don't have to like invent any kind of technology in order to build fast websites. That's true. We have this kind of technology since the beginning of HTML in the 90s because just get rid of the stuff and the site is quite quick. But since this is a work camp I want to include some pointers to several techniques of plugins you might be able to leverage. First thing is image optimization. You can gain a lot a lot of data from just compromising and resizing images. The website of Cologne I showed you earlier with the 2.4 megabytes in total is like half images. And on the side they only like tiny tiny things so you can just reduce them quite a lot in order to make the site way way quicker. I personally like to use a Magify for that plugin for WordPress. It's a paid service as well so not everyone might be comfortable with using it but there are tons of other plugins as well. I think Smush it is still around. There's a tiny PNG. A lot of things just search for the solution. Next thing is also targeting images. Lazy loading. Lazy loading is a technique where you just load images in time as soon as the user starts scrolling and really looking at the pictures because you don't have to load a huge image at the bottom of your site as soon as the visitors just start looking at the top. There are also many plugins to do that. The third thing is caching. The idea behind caching is that the site gets rendered every time a user tries to access it. Instead of doing so you can store this rendered thing on the server and deliver it directly without using WordPress at that moment actually. It saves a bit of time but it's not the holy grail of performance optimization because if you cache a huge site then you have a cached huge site. It doesn't change in size very much. In some cases you have to do a quite hard step and switch your theme because a lot of themes are not that good to take it nicely. Switching a theme is a hard thing and I won't be able to point you to one or two themes that are quite easy to use because the use case might be completely different than mine. But if you have questions on this just approach me after the talk maybe you can find something for you. In the end there's AMP, Google's idea of reinventing HTML. It's quite nice. They try to do really high performance sites with this and also rank them differently on Google. I think there's a talk on this today if I'm not mistaken. AMP is deliberately on the bottom of my list because I don't think that you have to use AMP in order to make a site quicker. In fact my own site is I think only half the size of its AMP version and loads a bit faster as well. So don't just turn it on. If you see yourself as a web professional, so some developer designer, I don't know, there are things you can do and you should do because you know way more things about the web than most of your clients will. So you're responsible to steer them in the right direction. And you have to be an advocate for change and this might hurt a little bit. I mean I know that I have turned down quite a lot of clients over the years because of their ideas of sustainability. An easy step you can also take is switch to green hosting. Hosting powered by renewable energy. I've linked the source down there. The Green Web Foundation has a directory of green hosts powered by renewable energy. If you sell WordPress products or software as a service thing or just provide plugins or themes for free, you can also streamline your products. And if a plugin is used on a million sites or just a hundred thousand, a small change will add up just like small changes in the WordPress core add up over hundreds of millions of sites. There was an article posted by a developer I think from the Netherlands just the other day. He has a plugin for MailChimp integration. And he actually did the math on how much energy he's saving by just cutting out a JavaScript library. It's quite impressive. I have to put a link on that as well. To conclude, I have three or four natural things you can do right now in this room without doing much else. The first thing is just a little bit of advertisement. Don't pay too much attention to it. I started a site, WPforfeature.org. There's just a newsletter form right now. I will be starting to collect information on different ideas on the topic, different initiatives. So we have a central hub to get our information from. I won't spam anyone with this newsletter, don't worry. If you're on the WordPress UK Slack team, there's a sustainability channel over there. Feel free to join it and join this discussion. I'm in there like most of the time just reading, but it's really interesting. I showed you the CO2 emissions calculation I did before with the 0.5 grams for the website. I came up with this using a tool called Website Carbon. It's quite similar to a speed test. You just input a URL in there and it calculates the amount of emitted CO2. It's quite easy to use and interesting, but be aware it's addictive. It's quite hard to get away from this and stop optimizing your site. I have spent weeks optimizing my own site. And the last thing, maybe not in this room, but for later, talk to others. It's an important topic. It won't just go away by ignoring it. And we have to make as many people as possible aware of it. Let's end on a high note. The glacier I showed you before, Oggyökull in Iceland. This picture I already said it is taken in the summer of last year. Around the same time they had a little ceremony over there and unveiled a monument with a sign on it. A sign addressed to future generations in remembrance of the glacier. The sign read as follows. Og is the first Icelandic glacier to lose its status as a glacier. This monument is to acknowledge that we know what is happening and what needs to be done. Only you know if we did it. And I think this quote quite impressively applies to our situation as well. This is it. Thank you very much. Absolutely brilliant. We have four minutes for questions if anyone has them. I was going to say thanks for the opportunity to open up. I was going to give you a question. We had actually a problem here. You can't go off set. But one thing when you had this lazy loading as it would be to call up. And then you should crave it coming up. So that's when you crave it all. Lazy loading will be added to cause some time in the future. That would be awesome. Okay. Telling which themes it could be. Which themes are more environmentally friendly. Nothing off of theme forest. No, no, seriousness. I have in all 12 years I do this. Not seen one well made theme off of theme forest. I don't want to offend anyone. But it did not occur to me yet. I can't give you like a general advice. But maybe you can talk afterwards and take a look at your case. Fantastic. Any other questions? Website carbon is based on a study on how much energy is consumed per megabyte of transfer data. They do a bit of math on the background. It's not an exact measurement because they can't look into your server and your setup. But they use like average averages on the kinds of data. They do a really good job in explaining what they do on the site. And they do it way better than I can right now. So maybe you take a look at the site. And it gives you options to do something about it. I don't think they give you options right away. But if you want to have options you can use like the Google Lighthouse test. They are quite resourceful on this. It's web.dev.measure. One more question. It's improved massively in the last five years. Most of them use a lot less energy than they used to in the past few years. And it's also worth noting that certain countries are better than the server management temperatures. It's absolutely based on Scotland. Was it cold or warm? These kinds of measures change over the years as well. Website carbon has a huge relaunch late last year and it's really updated the measurements. It doesn't get soft and cold. I think things are not analogy to use. We have no control over the place when real issues are coming up. Simon thank you so much for coming up to Glasgow. And I really do appreciate that you walked the walk or took the train for 20 hours. Because given the weather forecast it's going to take you even longer to get back. So we want you to enjoy the rest of your time here. Our next talks are in this track we have Tom Noel. He was going to walk into the building at Gutenberg Walk in JavaScript. In track one we're going to have Jessica Thomas giving an introductory talk on search engine optimization for your website. So please stay polite or go over and let's next time again.