Initial commit
This commit is contained in:
Ian Gulliver
1
include/README.md
Normal file
1
include/README.md
Normal file
@@ -0,0 +1 @@
|
|||||||
|
Derived from https://fabiensanglard.net/bloated/
|
||||||
1
include/droid-sans-mono-pro-bold.woff2.base64
Normal file
1
include/droid-sans-mono-pro-bold.woff2.base64
Normal file
File diff suppressed because one or more lines are too long
1
include/droid-sans-mono-pro-regular.woff2.base64
Normal file
1
include/droid-sans-mono-pro-regular.woff2.base64
Normal file
File diff suppressed because one or more lines are too long
5
include/head.html
Normal file
5
include/head.html
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<style type="text/css">
|
||||||
|
<!--# include file="style.css" -->
|
||||||
|
</style>
|
||||||
2
include/html.html
Normal file
2
include/html.html
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
67
include/style.css
Normal file
67
include/style.css
Normal file
@@ -0,0 +1,67 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: 'droid-sans-mono-pro';
|
||||||
|
src: url(data:font/woff2;base64,<!--# include file="droid-sans-mono-pro-regular.woff2.base64" -->) format('woff2');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'droid-sans-mono-pro';
|
||||||
|
src: url(data:font/woff2;base64,<!--# include file="droid-sans-mono-pro-bold.woff2.base64" -->) format('woff2');
|
||||||
|
font-weight: bold;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: droid-sans-mono-pro;
|
||||||
|
font-variant-ligatures: no-common-ligatures;
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 1.25;
|
||||||
|
|
||||||
|
max-width: 900px; /* for pc */
|
||||||
|
|
||||||
|
padding-left: 2ch;
|
||||||
|
padding-right: 3ch;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
color: #d8d8d8;
|
||||||
|
background: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 500px) { /* For small screen decices */
|
||||||
|
body {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
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 {
|
||||||
|
border-top: 0.1px solid white;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre {
|
||||||
|
background-color: black;
|
||||||
|
border: 1px solid white;
|
||||||
|
padding-left: 2ch;
|
||||||
|
padding-top: 1ch;
|
||||||
|
padding-bottom: 1ch;
|
||||||
|
}
|
||||||
49
index.html
Normal file
49
index.html
Normal file
@@ -0,0 +1,49 @@
|
|||||||
|
<!--# include file="include/html.html" -->
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<!--# include file="include/head.html" -->
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
<img src="sl55.svg" height=150px style="border: none;float:right; margin-left: 20px; margin-bottom: 10px;">
|
||||||
|
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>
|
||||||
|
|
||||||
|
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>
|
||||||
Reference in New Issue
Block a user