all repos — birabittoh.github.io @ gh-pages

My current website, built with Zola.

blog/modern-web-bloat/index.html (view raw)

1<!doctype html><html lang=en><head><meta charset=UTF-8><meta content="IE=edge" http-equiv=X-UA-Compatible><meta content="text/html; charset=UTF-8" http-equiv=content-type><meta content="width=device-width,initial-scale=1,user-scalable=no" name=viewport><meta content="index, follow" name=robots><title>Modern web bloat</title><meta content="Modern web bloat" name=title><meta content="Tech and privacy ramblings from a random italian dude." name=description><meta content=website property=og:type><meta content=https://birabittoh.github.io/blog/modern-web-bloat/ property=og:url><meta content=BiRabittoh property=og:site_name><meta content="Modern web bloat" property=og:title><meta content="Tech and privacy ramblings from a random italian dude." property=og:description><meta content=summary_large_image property=twitter:card><meta content=https://birabittoh.github.io/blog/modern-web-bloat/ property=twitter:url><meta content="Modern web bloat" property=twitter:title><meta content="Tech and privacy ramblings from a random italian dude." property=twitter:description><link href=https://birabittoh.github.io/blog/modern-web-bloat/ rel=canonical><link href=https://birabittoh.github.io/atom.xml rel=alternate title=RSS type=application/atom+xml><link href=https://birabittoh.github.io/css/style.css rel=stylesheet><body><div class=wrapper><header><nav class=navBar><a href=/>/home/</a><a href=/about>/about/</a><a href=/links>/links/</a><a href=/blog>/blog/</a><div class=themeSwitch><button class="themeButton light" onclick="setTheme('light')" title="Light mode">◐</button><button class="themeButton dark" onclick="setTheme('dark')" title="Dark mode">◑</button></div><script>const setTheme=a=>{document.documentElement.className=a;localStorage.setItem(`theme`,a)};const getTheme=()=>{const a=localStorage.getItem(`theme`);const b=a?a:`dark`;setTheme(b)};getTheme()</script></nav><div><a href=..>..</a>/<span class=metaData>modern-web-bloat</span></div><time datetime=2021-04-09>Published on: <span class=metaData>2021-04-09</span></time><h1>Modern web bloat</h1></header><main><p>This is it. My first blog post; I suppose this officially makes be a boomer.<h2 id=inspiration>Inspiration</h2><p>Some time ago I stumbled upon a <a href=https://invidio.us/cvDyQUpaFf4 rel=noopener target=_blank>video</a>, where the popular Linux influencer <a href=https://lukesmith.xyz rel=noopener target=_blank>Luke Smith</a> talked about the effort of looking up a Chicken Parmesan recipe in 2021 without having any adblock or privacy extensions enabled.<p>That’s because most modern websites take a lot of time to load framework files, ads and trackers. While that’s kinda functional, I think we should change our habits and start making simple websites again.<p>Yeah, this looks like a first world problem and it probably is, but it’s not as subtle as you think. I’m actually convinced that the internet could actually benefit from this way of thinking, and that’s what I’m going to talk about.<h2 id=the-problem>The problem</h2><p>In the early days of the internet, it was common for webpages to be written using only HTML, so we had very ugly but functional websites.<p>As technology went on, sites needed to get more modern-looking and interactive; that’s why CSS and JavaScript were introduced into the mix, allowing for dynamic websites that could actually change based on user input. As of nowadays, a lot more stuff went into the mix, to the point where the browser is now the most common program we use in our OS: you can, in fact, use it for doing things that 15+ years ago required external programs, like:<ul><li>playing music and video,<li>reading PDF files,<li>doing office work,<li>checking e-mail,<li>cloud storage,<li>etc…</ul><p>I guess people just find it more comfortable if they can do everything with a single program, and they’re not to blame for that. This IS the easiest approach for unexperienced people: just have a program that does everything, instead of having to learn how to use a bunch of different software.<p>This plethora of uses is possible today because of the existence of various libraries and frameworks that simplify JavaScript and CSS and make them easier to develop complicated websites with. This is good for basic web users who just want functional websites, and great for developers since they can easily code advanced functions inside the browser, which makes them work in every OS.<p>Sadly, this brings us to the problem: any modern website has become a burden for any browser to load, since our browser needs to download and parse through each library and often fill the page content as you scroll through. In his video, Luke Smith found that a simple Chicken Parmesan recipe would take up to 5-10 megabytes, which doesn’t sound like a lot, but it actually is.<p>It’s easier to understand it if you think about it with video-games; any game on 16-bit consoles and earlier, including full-fledged 30+ hour adventures like Final Fantasy 6 and Chrono Trigger, weighs less than one single recipe page (as stated <a href=https://blogs.umass.edu/Techbytes/2014/02/10/history-of-gaming-storage/#attachment_2827 rel=noopener target=_blank>here</a>).<h2 id=the-solution>The solution</h2><p>Well, I don’t think this “problem” is getting solved soon, as new frameworks for web development are constantly being introduced. Sadly, it’s a one-way train, but if you’re a web-dev you could actually make a difference yourself!<p>I mean, this can not apply to all websites. Some of them just NEED to be as responsive and interactive as they are; most of them actually just became bloated at a certain time period (probably mid-2000s) when having a flashy website was cool and different from what everyone else had. Nowadays you can make a difference by using plain HTML and CSS for your website: this ensures your pages will load instantly and be compatible even with the oldest of browsers! If you like this philosophy, you can check out other projects that aim for a simpler and faster web, like these ones:<ul><li><a href=//gemini.circumlunar.space/>gemini://</a>: a new, purposefully limited, internet protocol;<li><a href=https://based.cooking/ rel=noopener target=_blank>based.cooking</a>: a modern recipe website based on user collaboration via GitHub;<li><a href=https://wiby.me/ rel=noopener target=_blank>wiby.me</a>: a search engine that aims to only index classic style webpages.</ul></main><footer><p class=tagsData><a href=/tags/foss>#foss</a> <a href=/tags/minimalism>#minimalism</a><hr><div class=footContainer><div class=footLeft><p>Licensed under <a rel="noopener noreferrer" href=https://fr.wikipedia.org/wiki/Licence_MIT target=_blank>MIT</a><br> Built with <a rel="noopener noreferrer" href=https://www.getzola.org target=_blank>Zola</a> using <a rel="noopener noreferrer" href=https://github.com/BiRabittoh/anemone target=_blank>anemone</a> theme & <a rel="noopener noreferrer" href=https://github.com/Speyll/veqev target=_blank>veqev</a> colors.<br></div><div class=footRight><a href=https://wobble.town/visit/528 target=_blank><img class="footGif noStyle" alt=footGif loading=lazy src=https://wobble.town/visit/528/wobble.gif></a><a rel="noopener noreferrer" title="Subscribe via RSS for updates." class=metaData href=https://birabittoh.github.io/atom.xml target=_blank>RSS</a></div></div></footer></div>