Mail Slack Twitter Feed Flickr Github LinkedIn Mastodon Information git Clock Français English Go to main content directly
Lire en français

About this site

I am the main author and the only person responsible for the contents published on this site. On the other hand, the brands mentioned on this site are the property of the companies that have registered them. This entire site is subject to French law.

The views and opinions expressed on this blog are mine only, and in no way those of my employers or clients, my hosting provider or any other entity or individual.

If you wish to copy, modify or redistribute certain content, you must comply with the terms of the creative commons CC-BY license.

Under the hood

Specialized in Web Performance for a few years, I decided one day not to be the barefoot cobbler. Since then, in a healthy competition with my former colleagueNicolas Hoizey, I’ve never ceased to improve the web performance of the website.

Server side

I started by throwing away my Wordpress blog and replacing it with a static site generator1 developped in node, Hexo. After having determined the limits of the tool and contributed to some plugins, I decided to migrate to Jekyll whose community seemed more mature to me.

Frank Taillandier has beautifully sketched the static movement [FR] on his blog.

My Ruby dependencies are managed by Bundler:

  • for the archive management: jekyll-archives;
  • to generate responsive images layout: jekyll-cloudinary;
  • for the sitemap.xml: jekyll-sitemap;
  • regarding pagination: jekyll-paginate-v2;
  • the micro-typography is managed by: jekyll-microtypo.

I probably forget some of them, but you can find all the dependencies on my Github repo.

Internationalization is enabled by i18n and the i18n_filter2.

The localization technique is detailed in the Thomas Brelet’s Jekyll Starter Guide [FR].

I use node to compile my CSS and JS static resources.

Compilation and deployment

My pages and articles are written in CommonMark, a light syntax which is ideal for writing3. I use the Github hooks to interface my repository with Netlify, that executes some tests with rspec and compiles the site.

The generated site is then tested via html-proofer to check that the pages are error-free.

If all goes well then Netlify deploys the generated site on its CDN.

The last deployment was carried out on jeudi 7 février 2019.

Netlify is also in charge of capturing comments and sending them to a private Slack channel via Netlify Forms, using a technique popularized by Phil Hawksworth.

On this subject, you should read this excellent article by Romy on light syntaxes [FR]

Client side

Part of my CSS and JS code is dedicated to accessibility and I also try to contribute responsibly, to be as inclusive as possible, keeping both people and contexts in mind (for example, I use the abbr-touch library that gives mobile users the ability to read the definition of an abbreviation or acronym.

The instant search is achieved by Algolia, a very efficient indexing and search solution that has the advantage of offering an example implementation for Jekyll that fits perfectly with my needs.

In order to control what is happening on my site (including detecting attempted injections), I have configured specific directives in my Content Security Policy and reports are recorded in https://report-uri.com/4.

A daily monitoring via Dareboost on several pages informs me of possible performance regressions through configured alerts.

Thanks to Nicolas Hoffman for making me aware of this issue during his talk at Paris Web 2015.