Working content
This commit is contained in:
10
articles/2019-04-14-reboot.html
Normal file
10
articles/2019-04-14-reboot.html
Normal file
@@ -0,0 +1,10 @@
|
||||
<!--# set var="title" value="Reboot" -->
|
||||
<!--# set var="date" value="April 14, 2019" -->
|
||||
|
||||
<!--# include file="include/top.html" -->
|
||||
|
||||
<p>Previous generations of "where the flamingcow roams" have existed on Blogger and Medium, but have been dormant for some time. Tired of my posts there being "decorated" by the hosting provider without approval and inspired by <a href="https://fabiensanglard.net/bloated/index.html">Fabien Sanglard</a>, I'm rebooting here.</p>
|
||||
|
||||
<p>Posts prior to this one are copied from Blogger or Medium. Forgive me for all their historical naiveté. Posts after this are new here, and I'm sure will look equally silly in ten years.</p>
|
||||
|
||||
<!--# include file="include/bottom.html" -->
|
||||
1
include/article-footer.html
Normal file
1
include/article-footer.html
Normal file
@@ -0,0 +1 @@
|
||||
<hr>
|
||||
11
include/article-header.html
Normal file
11
include/article-header.html
Normal file
@@ -0,0 +1,11 @@
|
||||
<!--# if expr="$date" -->
|
||||
<aside>
|
||||
<h3><!--# echo var="date" --></h3>
|
||||
</aside>
|
||||
<!--# endif -->
|
||||
|
||||
<!--# if expr="$title" -->
|
||||
<h2><!--# echo var="title" --></h3>
|
||||
<!--# endif -->
|
||||
|
||||
<hr>
|
||||
6
include/bottom.html
Normal file
6
include/bottom.html
Normal file
@@ -0,0 +1,6 @@
|
||||
<!--# include file="article-footer.html" -->
|
||||
</article>
|
||||
</main>
|
||||
<!--# include file="page-footer.html" -->
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,6 +0,0 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="UTF-8">
|
||||
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
|
||||
<style type="text/css">
|
||||
<!--# include file="style.css" -->
|
||||
</style>
|
||||
3
include/page-footer.html
Normal file
3
include/page-footer.html
Normal file
@@ -0,0 +1,3 @@
|
||||
<footer>
|
||||
<h1>*</h1>
|
||||
</footer>
|
||||
9
include/page-head.html
Normal file
9
include/page-head.html
Normal file
@@ -0,0 +1,9 @@
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="UTF-8">
|
||||
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
|
||||
<style type="text/css">
|
||||
<!--# include file="style.css" -->
|
||||
</style>
|
||||
<title><!--# echo var="title" default="where the flamingcow roams" --></title>
|
||||
</head>
|
||||
4
include/page-header.html
Normal file
4
include/page-header.html
Normal file
@@ -0,0 +1,4 @@
|
||||
<header>
|
||||
<h1><a href="https://firestuff.org/">where the flamingcow roams</a></h1>
|
||||
<hr>
|
||||
</header>
|
||||
@@ -20,32 +20,51 @@ body {
|
||||
|
||||
a {
|
||||
color: #d8d8d8;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 25pt;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
sup {
|
||||
vertical-align: 0.3em;
|
||||
font-size: 0.65em;
|
||||
}
|
||||
|
||||
hr {
|
||||
width: 100%;
|
||||
border-top: 0.1px solid white;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: black;
|
||||
border: 1px solid white;
|
||||
padding-left: 2ch;
|
||||
padding-top: 1ch;
|
||||
padding-bottom: 1ch;
|
||||
header {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
header hr {
|
||||
width: 15em;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
h1 a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
margin-block-start: 0.5em;
|
||||
margin-block-end: 0.5em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.index ol {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
9
include/top.html
Normal file
9
include/top.html
Normal file
@@ -0,0 +1,9 @@
|
||||
<!--# include file="page-html.html" -->
|
||||
<!--# include file="page-head.html" -->
|
||||
|
||||
<body>
|
||||
<!--# include file="page-header.html" -->
|
||||
|
||||
<main>
|
||||
<article>
|
||||
<!--# include file="article-header.html" -->
|
||||
54
index.html
54
index.html
@@ -1,48 +1,12 @@
|
||||
<!--# include file="include/html.html" -->
|
||||
<!--# set var="title" value="Reboot" -->
|
||||
<!--# set var="date" value="April 14, 2019" -->
|
||||
|
||||
<head>
|
||||
<!--# include file="include/head.html" -->
|
||||
</head>
|
||||
<!--# include file="include/top.html" -->
|
||||
|
||||
<body>
|
||||
<br><center>
|
||||
<a href="/" style="text-decoration: none;"><b>FABIEN SANGLARD'S WEBSITE</b><br>
|
||||
--------------------------<br>
|
||||
</a>
|
||||
<a href="/about">ABOUT</a> <a href="/rss.xml">RSS</a> <a href="mailto:fabiensanglard.net@gmail.com?subject=Bloated">EMAIL</a> <a href="https://twitter.com/fabynou">TWITTER</a><br>
|
||||
</center><br><br>
|
||||
September 23, 2018<br>
|
||||
<br>
|
||||
<div style="text-transform: uppercase;""><b>Bloated</b></div>
|
||||
<hr>
|
||||
<p>
|
||||
It used to happen sporadically but now it is a daily experience. As I am browsing the net I click on a link (usually a newspaper website). The page starts to load. Then I wait. And I wait. And I wait. It takes several seconds.<br>
|
||||
<br>
|
||||
<div class="index">
|
||||
<ol>
|
||||
<li><a href="articles/2019-04-14-reboot.html">2019-Apr-14: Reboot</a></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
Once loaded, my patience is not rewarded since my MacBook Air mid-2011 seems to barely be able to keep up. Videos start playing left and right. Sound is not even turned off by default anymore. This <strike>shitshow</strike> festival of lights and sounds is discouraging but I am committed to learn about world news. I continue.<br>
|
||||
<br>
|
||||
I have the silly idea to scroll down (searching for the meaty citations located between double quotes) and the framerate drops to 15 frames per second. Later, for no apparent reason, all fans will start running at full speed. The air exhaust will expel burning hot air. MacOS X's ActivityMonitor.app reveals countless "Helpers" processes which are not helping at all. I wonder if the machine is going to die on my lap, or take off like a jet and fly away.<br>
|
||||
<br>
|
||||
What a sad sight. My laptop is seven years old but its specs are far from ridiculous.<br>
|
||||
<br>
|
||||
- 1.7 Ghz Intel Core i5 with two hyper-threaded CPUs.<br>
|
||||
- 4 GiB 1333Mhz DDR3<br>
|
||||
- SSD drive<br>
|
||||
<br>
|
||||
A computer this powerful should be able to render any web-page gracefully. It used to do the job correctly a few years ago. It can't anymore even though it doesn't look like the new content is doing much more than it used to.<br>
|
||||
<br>
|
||||
I took a look at my own website and realized I was also guilty. The homepage requires 23 HTTP requests. It weighs 1.5 MiB and takes 800 milliseconds to load. All that to show six images and a banner. If you scroll down all the way to the bottom, your browser will have transfered 5.6 MiB while performing 78 HTTP requests. How did I end up building this crap?<br>
|
||||
<br>
|
||||
For every better, faster, energy-efficient CPU/Storage/RAM element produced by hardware designers it seems there are ten programmers ready to add a hundred features. In programming like in every day life, incremental degradation makes it surprisingly easy to over-consume available resources.<br>
|
||||
<br>
|
||||
There is hope. <a href="http://tonsky.me/blog/disenchantment/">More</a> <a href="https://www.wired.com/2016/04/average-webpage-now-size-original-doom/">and</a> <a href="https://pxlnv.com/blog/bullshit-web/">more</a> of us are becoming aware of the problem. I am confident things will end up going in the right direction. On a personal note, it was time for this website to change.<br>
|
||||
<br>
|
||||
I am well aware there are many elements between a file on a server and the eyes of a reader. Like I am aware that a commercial website must solve problems a personal blog doesn't have to consider. Yet it seems like an increasingly good idea to take a few steps back and wonder if we are doing our best to use only what is needed. And do what we can about it, however infinitesimal we think it is.<br><br>
|
||||
This is the new layout of fabiensanglard.net. I have removed the comment sections, most of the Javascript, and I will try to stick to text, svgs and webp images. I may have gone over the top by removing almost everything but this will be an interesting challenge to attempt to achieve more with less.
|
||||
</p>
|
||||
<?php footnote_gen_references(); ?>
|
||||
<hr>
|
||||
<center>*
|
||||
</body>
|
||||
|
||||
</html>
|
||||
<!--# include file="include/bottom.html" -->
|
||||
|
||||
Reference in New Issue
Block a user