|
|
|
@@ -5,13 +5,98 @@ |
|
|
|
<link href="https://larlet.fr/david/" rel="alternate" type="text/html" /> |
|
|
|
<link href="https://larlet.fr/david/log/" rel="self" /> |
|
|
|
<id>https://larlet.fr/david/</id> |
|
|
|
<updated>2020-05-25T12:00:00+01:00</updated> |
|
|
|
<updated>2020-05-26T12:00:00+01:00</updated> |
|
|
|
<author> |
|
|
|
<name>David Larlet</name> |
|
|
|
<uri>https://larlet.fr/david/</uri> |
|
|
|
</author> |
|
|
|
<rights>Copyright (c) 2004-2020, David Larlet</rights> |
|
|
|
|
|
|
|
<entry xml:lang="fr"> |
|
|
|
<title>Covidoudou</title> |
|
|
|
<link href="https://larlet.fr/david/2020/05/26/" rel="alternate" type="text/html" /> |
|
|
|
<updated>2020-05-26T12:00:00+01:00</updated> |
|
|
|
<id>https://larlet.fr/david/2020/05/26/</id> |
|
|
|
<summary type="html"> |
|
|
|
<p><em>Journal de déconfinement.</em></p> |
|
|
|
<h2>Préambule</h2> |
|
|
|
<p>Il est rare que j’écrive sur mon travail avec aussi peu de recul. J’avais déjà partagé une <a href="https://larlet.fr/david/2020/01/17/">expérimentation avec data.gouv.fr</a> et <a href="https://larlet.fr/david/2020/04/18/">l’aventure Zam</a> sur ces deux dernières années. Ici, le contexte est un peu particulier et s’apparente davantage à un <em>sprint</em>. Il concerne potentiellement 68 millions de français·es (<abbr title="private joke">👋🐢🤔</abbr>), ce qui met la barre assez haute.</p> |
|
|
|
<p>Récit de ce qu’il se passe parfois derrière le rideau de vos écrans.</p> |
|
|
|
<h2>Jour 1 (5 mai) : Un démarrage étrange</h2> |
|
|
|
<p>Cela fait quelques temps avec <a href="https://larlet.fr/david/blog/2019/faire-equipe/">l’équipe</a> que l’on se demande quoi faire car la <a href="https://larlet.fr/david/2020/04/18/#suite">suite annoncée</a> n’est pas aussi réactive que ce que l’on eu espéré, contexte sanitaire oblige. On essaye de se positionner sur des produits où l’on pense pouvoir être utiles et qui ne soient pas du solutionnisme technologique.</p> |
|
|
|
<p>On nous propose de faire un questionnaire pour le Ministère des Solidarités et de la Santé qui soit à l’opposé d’un autre produit développé en parallèle par le gouvernement :</p> |
|
|
|
<ul> |
|
|
|
<li><em>open-source</em> dès le premier jour</li> |
|
|
|
<li>sans aucune donnée collectée</li> |
|
|
|
<li>avec un algorithme public</li> |
|
|
|
</ul> |
|
|
|
<p>Jusque là, c’est plutôt alléchant mais le <em>timing</em> est quand même serré : le déconfinement est prévu pour le 11 mai. Soit 6 jours plus tard. <em>Gloups.</em></p> |
|
|
|
<p>En plus de l’urgence, d’autres voyants sont au rouge : on évoque une <q>équipe en mode commando</q> et il y a déjà beaucoup d’attentes bien qu’aucune ligne de code n’ait été produite… sans compter le fait que nous ne sommes ni des développeurs JavaScript, ni familiers des plateformes de distribution des <abbr title="Google, Apple, Facebook, Amazon, Microsoft et consorts.">GAFAM+</abbr>. Par choix.</p> |
|
|
|
<p>On finit par accepter car l’intention nous semble louable. Opération : <strong>Covidoudou</strong>.</p> |
|
|
|
<h2>Jour 3 (7 mai) : Doutes techniques</h2> |
|
|
|
<blockquote> |
|
|
|
<p>What is clear: right now, if you’re using a framework to build your site, <mark>you’re making a trade-off in terms of initial performance</mark>—even in the best of scenarios.</p> |
|
|
|
<p><em>Some</em> trade-off may be acceptable in the right situations, but it’s important that we make that exchange consciously.</p> |
|
|
|
<p><cite><em><a href="https://timkadlec.com/remembers/2020-04-21-the-cost-of-javascript-frameworks/">The Cost of Javascript Frameworks</a></em> (<a href="https://larlet.fr/david/cache/2020/be8e81e9337d81e7a31a5cc1f4d38435/">cache</a>)</cite></p> |
|
|
|
</blockquote> |
|
|
|
<p>Beaucoup d’interrogations relatives aux performances et à la complexité que l’on souhaite déléguer dans ce domaine. On s’attend à avoir potentiellement une charge non négligeable à encaisser. On évalue plusieurs solutions mais aucune ne nous satisfait pleinement, aussi on décide de faire un premier jet avec une succession de vues en JavaScript à la main qui reprennent des éléments <code>template</code> pré-chargés dans le HTML. Lorsqu’on fait un compromis, il s’agit toujours de tenter de trouver la solution la moins pire <em>pour un contexte donné</em>.</p> |
|
|
|
<blockquote> |
|
|
|
<p>But I think there are a lot of problems that are better solved some other way.</p> |
|
|
|
<p><cite><em><a href="https://macwright.org/2020/05/10/spa-fatigue.html">Second-guessing the modern web</a></em> (<a href="https://larlet.fr/david/cache/2020/ebaa216561b046ae17b29b399305b294/">cache</a>)</cite></p> |
|
|
|
</blockquote> |
|
|
|
<p>En parallèle, on commence à implémenter l’algorithme. Il est décrit dans des fichiers du genre <code>Copie de algo_deconf_final_V3.xlsx</code> (véridique) et mis à jour par un comité d’experts médecins qui se l’échangent par courriel. On reçoit plusieurs versions par jour !</p> |
|
|
|
<p>On fait une première démo à l’équipe rapprochée.</p> |
|
|
|
<h2>Jour 5 (9 mai) : Un algorithme récalcitrant</h2> |
|
|
|
<p>L’objectif est simple : on a une série de questions et en fonction des réponses on affiche des conseils personnalisés en fonction de la localisation, des caractéristiques, des antécédents et des symptômes ou contact à risque potentiels.</p> |
|
|
|
<p>Sauf que tout bouge très vite, autant les questions que les conseils ou l’arbre logique qui permet de passer des unes aux autres. Sans compter qu’il a été écrit par des médecins dans une feuille de calcul et qu’il faut aller repêcher les informations à la main. Pas évident.</p> |
|
|
|
<p>En parallèle, on <a href="https://github.com/Delegation-numerique-en-sante/mesconseilscovid/">publie le code source</a> sous licence MIT et on est maintenant en capacité de faire une démo à l’équipe élargie. Les retours sont plutôt bons et ça tranquillise beaucoup de monde.</p> |
|
|
|
<h2>Jour 7 (11 mai) : Tenir la charge</h2> |
|
|
|
<blockquote> |
|
|
|
<p>If you are in charge of a web site that provides even slightly important information, or important services, <strong>it’s time to get static</strong>.</p> |
|
|
|
<p><cite><em><a href="https://meyerweb.com/eric/thoughts/2020/03/22/get-static/">Get Static</a></em> (<a href="https://larlet.fr/david/cache/2020/4f88ece170719f58ce09ba4b1818730a/">cache</a>)</cite></p> |
|
|
|
</blockquote> |
|
|
|
<p>Ronan s’occupe de faire en sorte que l’architecture tienne le coup, on évoque une annonce à la télévision et apparemment ça peut faire un gros pic dans les courbes. Surtout dans cette période anxiogène. Heureusement que l’on ne sert qu’une page statique <a href="https://adactio.com/journal/16797">relativement légère</a> (<a href="https://larlet.fr/david/cache/2020/24f52bba99b1423102f93cf86b948c5b/">cache</a>) au final. Sans <a href="https://www.kryogenix.org/days/2020/05/06/hammer-and-nails/">recompiler</a> (<a href="https://larlet.fr/david/cache/2020/73f93e0e8e7810a36d88555c2cbfa573/">cache</a>) trop de choses dans le navigateur.</p> |
|
|
|
<p>De mon côté, j’extrais toutes les chaines de caractères <a href="https://github.com/Delegation-numerique-en-sante/mesconseilscovid/tree/master/contenus">dans des fichiers markdown</a> et je <a href="https://github.com/Delegation-numerique-en-sante/mesconseilscovid/tree/master/contenus#algorithme">documente l’algorithme</a> en faisant des liens vers chaque fichier. Je ne sais pas où je vais mais j’ai l’intuition que ça sera moins galère que l’historique des révisions d’une (ou plusieurs !) feuille(s) de calcul.</p> |
|
|
|
<p>On commence à avoir des retours d’associations de patients pour nous aider à rendre le contenu intelligible par des non-médecins/techniciens. C’est chouette.</p> |
|
|
|
<h2>Jour 9 (13 mai) : Lancement officiel</h2> |
|
|
|
<p>On a enfin une adresse officielle : <a href="https://mesconseilscovid.sante.gouv.fr/">mesconseilscovid.sante.gouv.fr</a>, en <em>seulement</em> 9 jours ! Ça peut vous sembler long mais obtenir un sous-domaine en <code>.gouv.fr</code> est parfois un très très long périple.</p> |
|
|
|
<figure> |
|
|
|
<img src="https://larlet.fr/static/david/2020/mesconseilscovid.png" |
|
|
|
alt="Capture d’écran du site" |
|
|
|
loading="lazy" width="1280" height="800" /> |
|
|
|
<figcaption>Capture d’écran du site.</figcaption> |
|
|
|
</figure> |
|
|
|
<p>On peaufine le cache mais aussi sa mise à jour. Il faut que l’application soit conforme à des doctrines gouvernementales changeantes dans un contexte où la réactivité est cruciale. Notre connaissance de la maladie évolue et les conseils pour y échapper aussi.</p> |
|
|
|
<p>Même avec les <em>polyfills</em> qui vont bien, il semblerait que l’élément <code>template</code> soit un peu capricieux avec Internet Explorer 11 et on espère que le site soit utilisable par le plus de personnes possibles. Cela occasionne une veillée à revenir sur notre façon d’écrire les pages/vues. Pas vraiment la partie la plus fun…</p> |
|
|
|
<h2>Jour 11 (15 mai) : Structuration et consolidation</h2> |
|
|
|
<p>Jusqu’à présent, on a favorisé la vitesse au détriment de la robustesse. On ne peut pas avoir les deux en si peu de temps. Mais par contre, il faut être suffisamment lucide pour savoir s’arrêter à temps et consolider l’existant. Alors on écrit plus de tests, on ré-arrange le code pour le rendre plus compréhensible.</p> |
|
|
|
<p>Côté contenus, la proposition de passer par Microsoft Github pour éditer les contenus (et peut-être à terme l’algorithme lui-même ?!) a été bien acceptée et on commence à recevoir des <em>pull-requests</em> de médecins.</p> |
|
|
|
<p>Poussés par le besoin, on a créé une nouvelle façon technique d’interagir. Un <em>framework</em> nous aurait probablement trop contraint pour avoir cette liberté d’innovation. Difficile de se prononcer avec certitude toutefois.</p> |
|
|
|
<h2>Jour 15 (19 mai) : un CMS statique</h2> |
|
|
|
<p>Suite à une réunion de travail, on se rend compte qu’il est difficile d’avoir accès à l’intégralité des contenus disponibles pour pouvoir rester cohérent dans les formulations. Aussi, un découpage par dossier s’impose et permet d’avoir un fichier <em>README.md</em> qui va compiler <a href="https://github.com/Delegation-numerique-en-sante/mesconseilscovid/tree/master/contenus/statuts#statuts">l’ensemble de ces contenus</a> par type. Cela fournit un lien pour aller éditer le bon contenu depuis ces index.</p> |
|
|
|
<p>On sent naître aussi la nécessité d’un <em>CHANGELOG</em> afin que toutes l’équipe élargie sache ce qui est <a href="https://github.com/Delegation-numerique-en-sante/mesconseilscovid/blob/master/CHANGELOG.md#changelog">implémenté et déployé</a>. C’est intéressant — et un peu effrayant — de voir à quel point on a réussi à faire contribuer des médecins peu techniques en utilisant nos outils de développeurs·ses.</p> |
|
|
|
<p><em>Aussi, je m’éclipse pour <a href="https://larlet.fr/david/2020/05/20/">une vingtaine d’heures</a> en forêt.</em></p> |
|
|
|
<h2>Jour 18 (22 mai) : Prise de recul</h2> |
|
|
|
<blockquote> |
|
|
|
<p>Prioritisation isn’t easy, and it gets harder the more factors come into play: user needs, business needs, technical constraints. But it’s worth investing the time to get agreement on the priority of your constituencies. And then formulate that agreement into design principles.</p> |
|
|
|
<p><cite><em><a href="https://adactio.com/journal/16811">Principles and priorities</a></em> (<a href="https://larlet.fr/david/cache/2020/f3be13f0057c9ff350b6e0bf3c3be90b/">cache</a>)</cite></p> |
|
|
|
</blockquote> |
|
|
|
<p>Voici venu le temps de se ré-interroger sur nos intentions, les attentes, les outils employés, nos pratiques. C’est pour moi l’un des meilleurs moments d’un produit, ce petit coup d’œil régulier dans le rétroviseur. Celui qui permet de réajuster une trajectoire naissante en désignant un nouveau cap.</p> |
|
|
|
<p>Particulièrement côté technique, on a intentionnellement évité tout les outils JS jusqu’à présent. Il y a peut-être des petites briques à récupérer de-ci de-là sans télécharger la moitié du web. Je me réjouis que l’on ait réussi à conserver une page performante et relativement accessible pour l’instant :</p> |
|
|
|
<figure> |
|
|
|
<img src="https://larlet.fr/static/david/2020/andouillette_web.png" |
|
|
|
alt="Une série de A depuis l’outil WebPageTest" |
|
|
|
loading="lazy" width="724" height="222" /> |
|
|
|
<figcaption>L’andouillette du développeur Web.</figcaption> |
|
|
|
</figure> |
|
|
|
<p>Autre victoire non négligeable, tout reste dans le navigateur. Les seules statistiques que l’on ait sont celles de téléchargement de la page et toutes les dix minutes un <em>ping</em> pour vérifier que les conseils sont bien à jour. Vous pouvez refaire le test 15 fois et on ne le saura pas. Vous pouvez mettre n’importe quoi et ça ne changera rien de notre côté. Bon, ça peut planter et on ne le sait pas non plus…</p> |
|
|
|
<p>En parallèle, des démo sont faites à des personnes plus ou moins importantes qui vont déboucher sur des annonces plus ou moins officielles/diffusées. Jusqu’ici ça tient.</p> |
|
|
|
<p><em>J’ai travaillé 14,5 jours sur ces 18 derniers jours.</em></p> |
|
|
|
<hr /> |
|
|
|
<p>À suivre…</p> |
|
|
|
</summary> |
|
|
|
</entry> |
|
|
|
|
|
|
|
<entry xml:lang="fr"> |
|
|
|
<title>Bikepacking</title> |
|
|
|
<link href="https://larlet.fr/david/2020/05/20/" rel="alternate" type="text/html" /> |
|
|
|
@@ -24,7 +109,7 @@ |
|
|
|
<p>L’homme libre possède le temps. L’homme qui maîtrise l’espace est simplement puissant. En ville, les minutes, les heures, les années nous échappent. Elles coulent de la plaie du temps blessé. <mark>Dans la cabane, le temps se calme.</mark> Il se couche à vos pieds en vieux chien gentil et, soudain, on ne sait même plus qu’il est là. Je suis libre parce que mes jours le sont.</p> |
|
|
|
<p><cite><em><a href="https://larlet.fr/david/2020/12/21/#dans-les-forets-de-siberie">Dans les forêts de Sibérie</a></em>, Sylvain Tesson</cite></p> |
|
|
|
</blockquote> |
|
|
|
<p>Je n’étais pas allé en forêt depuis presque trois mois. En parallèle de quoi, je m’étais engagé sur un truc dont il faudra que je vous parle prochainement qui était très prenant. Bref, je manquais de temps. Je me suis quand même accordé 24 heures dans la forêt en partant depuis chez moi à <a href="https://larlet.fr/david/2020/05/20/#materiel">vélo</a>. Cela faisait un moment que je voulais tenter d’aller jusqu’au <a href="https://www.sepaq.com/pq/oka/">Parc national d’Oka</a> et quoi de mieux que de profiter de sa dernière journée de <strong>fermeture</strong> pour aller y faire un tour ?</p> |
|
|
|
<p>Je n’étais pas allé en forêt depuis presque trois mois. En parallèle de quoi, je m’étais engagé sur un truc dont il faudra que je vous <a href="https://larlet.fr/david/2020/05/26/">parle prochainement</a> qui était très prenant. Bref, je manquais de temps. Je me suis quand même accordé 24 heures dans la forêt en partant depuis chez moi à <a href="https://larlet.fr/david/2020/05/20/#materiel">vélo</a>. Cela faisait un moment que je voulais tenter d’aller jusqu’au <a href="https://www.sepaq.com/pq/oka/">Parc national d’Oka</a> et quoi de mieux que de profiter de sa dernière journée de <strong>fermeture</strong> pour aller y faire un tour ?</p> |
|
|
|
<p>Me voilà donc en selle vers 14 heures sous un soleil assez violent après avoir reconnu une bonne partie du parcours l’avant-veille (ne jamais faire ça). L’objectif est d’arriver le plus loin possible sans trop transpirer, mission accomplie… jusqu’à la dernière montée, snif. Une cinquantaine de kilomètres plus loin, je m’approche de la forêt et je décide de rentrer dedans à pied en espérant trouver deux arbres pour accrocher mon <a href="https://larlet.fr/david/2020/05/20/#hamac">hamac</a>. Je suis rapidement assailli par une nuée de mouches noires : <strong>mon pire cauchemar dans ce pays</strong>.</p> |
|
|
|
<p>Du mieux que je peux, je tente de trouver un chemin et je tombe sur un sentier qui devient praticable à vélo. Ouf ! Il faut impérativement que je trouve un terrain à découvert pour échapper aux mouches. Si vous suivez, vous remarquerez que c’est difficilement compatible avec une nuit en hamac ! Je distingue une éclaircie au loin et je tombe sur… un marais. Il va me falloir choisir mes <a href="https://en.wikipedia.org/wiki/Talk%3AQuebec_French_lexicon#Slang_terms">bibittes</a> préférées pour ces prochaines heures. Ça ressemble à une sortie galère. <em>Joie.</em></p> |
|
|
|
<p>Et tout à coup, je découvre une structure qui va me sauver mon séjour :</p> |
