{"componentChunkName":"component---src-templates-blog-template-js","path":"/website","result":{"data":{"site":{"siteMetadata":{"title":"Advanced Technology Portfolio"}},"markdownRemark":{"html":"<h1>Introduction</h1>\n<p>The internet has opened countless doors for information sharing. The backbone of the internet is websites. To most people, all they do is open up their web browser and enter the URL that they want to visit. While this seems simple on the front-end it is very complex. There are many servers involved in the process of sending information to other servers before the end-user sees anything. These servers live in data centers. These centers are power-hungry. Based on estimates from 2019, data centers used 200 terawatt-hours of power (Kamiya 2020). These estimates are expected to increase especially with COVID demand and the expansion of the internet.</p>\n<p>So, as the internet expands how do we make it more efficient? One idea is to rethink how we store data such as websites. Until recently, I didn’t realize just how much data is stored on websites; some include images, videos, text, and code. Those files can add up in size quickly putting more strain on servers. But how do we be energy conscious when making a website and what principles are not sustainable? There are a couple up and coming technologies that help web performance along with being more efficient on the server-side. In conjunction with explaining these new technologies, I am also going to go into detail about a website that I built that has sustainability in mind. But first, the technologies.</p>\n<h1>Edge Computing</h1>\n<center>\n<p><img src=\"/assets/Picture1.png\"></p>\n<html>\n<head>\n<style>\ntable, td,th {\npadding:5\\px;\n}\n</style>\n</head>\n<body>\n<table>\n  <tr>\n    <th>Figure 1. An example of an edge network (CloudFlare).</th> \n  </tr>\n</table>\n</body>\n</html>\n</center>\n<p>Normally cloud computing happens far away in a data center. With distance comes lag or latency. The more lag you have the slower the response times. What if we could bring the network as close as possible to the user; this very concept is possible thanks to edge computing. Edge computing is a networking philosophy focused on bringing computing as close to the source of data as possible to reduce latency and bandwidth use (CloudFlare). So, what is the edge? The edge is where things and people produce or consume that information (Shaw 2019 Nov 13). To use the edge, you must first create an edge network which is a type of edge device that provides an entry point into a network. Other edge devices include routers and routing switches (CloudFlare). Essentially, devices will be able to communicate once they are on edge. So, if a computer already has website data on it instead of relying on the server which could be thousands of miles away, we can just pull data from the edge; decreasing bandwidth which in turn will reduce power usage. Meaning, that the more devices that are a part of the edge will further reduce bandwidth usage. Figure 1 displays an edge network in action. With the edge device installed devices from network A and network B can talk to each other transmitting data. If a device from network B needs to pull up a website and someone on network A already has the files it will just pull data from network A.</p>\n<h1>Content Delivery Networks</h1>\n<center>\n<p><img src=\"/assets/Picture2.png\"></p>\n<html>\n<head>\n<style>\ntable, td {\n  border: 1px solid black; \n}\n</style>\n</head>\n<body>\n<table>\n  <tr>\n    <th>Figure 2. An example of an CDN (CloudFlare). The origin sever is where all the website data is stored. CDN’s are where snippets of website data are stored to speed up transit.   </th> \n  </tr>\n</table>\n</body>\n</html>\n</center>\n<p>A content delivery network (CDN) refers to a geographically distributed group of servers that work together to provide fast delivery of Internet content. A CDN allows for the quick transfer of assets needed for loading Internet content including HyperText Markup Language (HTML) pages, JavaScript files, cascading stylesheets (CSS), images, and videos (CloudFlare). A CDN is part of the network edge as it brings content from nearby sources instead of relying on the origin server where all the assets are stored. While CDN’s still require servers to run these servers are more efficient as they do not store all the code and assets. They only store cacheable and compressed content that is required for a fast time to live (TTL). CDN’s reduce the strain on networks spreading out the data essentially. Figure 2 provides a real-world example; end-users are traveling to the edge instead of the origin because all the data required to display the page is on the local DNS server. Thus, reducing bandwidth to the origin. However, an increase in CDN infrastructure and client requests traffic volume causes an increase in energy consumption (Islam et al. 2017). Some recommend making a more sustainable network by making CDN infrastructure smaller (Islam et al. 2017). Meaning, that CDN’s are the most energy-efficient when there are fewer of them spread out strategically; so in this case more doesn’t exactly mean better.</p>\n<h1>Designing an Energy-Efficient Website</h1>\n<p><img src=\"/assets/Screen%20Shot%202021-03-14%20at%206.47.51%20PM.png\"></p>\n<p>For this demonstration, I have built the following website: <a href=\"https://advtech.ictoxlab.com/\">https://advtech.ictoxlab.com/</a>. The website is running Gatsby, a static site generator. Static meaning that content is not dynamic and most likely runs on a content management system (CMS). The total website size is 641.12 Kilobytes. A small size website is required to reduce server load and to manage recourses more efficiently. The site is also using a CDN and utilizes edge computing. But the large advantage of this site is it only builds a new version when necessary. Other websites need to build themselves every time a user requests it. So how do we do it? We use an intuitive service call Netlify (<a href=\"https://www.netlify.com/products/\">https://www.netlify.com/products/</a>). Netlify uses edge computing a serverless technology to deploy a frontend website in their global network. So using edge tech we can be more energy conscious. Since Netlify uses a build command for the backend fewer resources are being used to produce the site. The backend of the site is stored in small configuration files located in GitHub, a file repository service. When the build command is executed the website is built using the files from GitHub. The site only builds when a change is detected reducing server load and energy usage while also providing a super-fast user experience. </p>\n<h1>Works Cited</h1>\n<p>CloudFlare. What is edge computing? Cloudflare. [accessed 2021a Feb 28].</p>\n<p>CloudFlare. What is a CDN edge server? Cloudflare. [accessed 2021b Feb 28].</p>\n<p>CloudFlare. What is a CDN? | How do CDNs work? Cloudflare. [accessed 2021 Feb 28].</p>\n<p>Islam S ul, Pierson J-M, Javaid N. 2017. A Novel Utilization-aware Energy Consumption Model for Content Distribution Networks. Int J Web Grid Serv. 13(3):290–314. doi:10.1504/IJWGS.2017.085146. Kamiya G. 2020. Data Centres and Data Transmission Networks – Analysis. IEA. [accessed 2021 Feb 28].</p>\n<p>Shaw K. 2019 Nov 13. What is edge computing and why it matters. Netw World. [accessed 2021 Feb 28].</p>","frontmatter":{"date":"February 28, 2021","path":"/website","title":"Designing a Energy-Efficient Website","thumbnail":"/assets/facebook-server-farm-arctic-lule-sweden-12.jpg","metaDescription":null}}},"pageContext":{}}}