Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
3 лет назад
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the `title` element
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Tag #technique — David Larlet</title>
  13. <meta name="description" content="Publications relatives au tag #technique">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Documented, feel free to shoot an email. -->
  28. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  29. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  36. <script>
  37. function toggleTheme(themeName) {
  38. document.documentElement.classList.toggle(
  39. 'forced-dark',
  40. themeName === 'dark'
  41. )
  42. document.documentElement.classList.toggle(
  43. 'forced-light',
  44. themeName === 'light'
  45. )
  46. }
  47. const selectedTheme = localStorage.getItem('theme')
  48. if (selectedTheme !== 'undefined') {
  49. toggleTheme(selectedTheme)
  50. }
  51. </script>
  52. <style type="text/css">
  53. details[open] summary {
  54. display: none;
  55. }
  56. </style>
  57. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  58. <header>
  59. <h1>Publications relatives au tag #technique</h1>
  60. </header>
  61. <nav>
  62. <p class="center">
  63. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  64. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  65. </svg> Accueil</a>
  66. • <a rel="tags" href="/david/#tags" title="Liste de toutes les étiquettes"><svg class="icon icon-tags">
  67. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-tags"></use>
  68. </svg> Étiquettes</a>
  69. </p>
  70. </nav>
  71. <hr>
  72. <main>
  73. <p>Les plus récentes en premier, les 3 premières sont dépliées et ensuite c’est à la demande, bonne exploration !</p>
  74. <h2><a href="/david/2021/11/26/" title="Lien permanent vers cet article">Incompétence</a> (2021-11-26)</h2>
  75. <blockquote lang="en">
  76. <p>The magic of programming is largely just things you don’t know yet. Once you learn those things, it stops being magic in the sense of “I have no idea how it did that or why it works“ and starts being magic in the sense of “I can make the computer do exactly what I ask it to do!”. <mark>The point is to become the wizard, not the bedazzled member of the audience.</mark></p>
  77. <p>This does not happen overnight, and we need to have the confidence to accept that our profession has depth, even as we celebrate the ease with which someone can get started (and welcome them onto the journey of becoming a wizard)!</p>
  78. <p>It also doesn’t happen across all the domains of programming. You can’t become an expert at everything, and it’s fine to accept your boundaries. But it’s not fine to think you shouldn’t be on <em>some</em> paths towards mastery, if you intend to make programming your career.</p>
  79. <p><cite><em><a href="https://world.hey.com/dhh/programmers-should-stop-celebrating-incompetence-de1a4725">Programmers should stop celebrating incompetence</a></em> (<a href="/david/cache/2021/569696e39daa6ee1de97a7a9184316fb/">cache</a>)</cite></p>
  80. </blockquote>
  81. <p>C’est marrant, j’ai de plus en plus envie de célébrer cette incompétence justement. Pas pour s’y complaire mais pour rendre cet espace plus accueillant. C’était un peu l’objectif de ma démarche avec le <a href="/david/2021/11/25/" title="Git">billet d’hier</a>. Il est possible d’assumer d’être incompétent·e sur certains points et tout de même arriver à faire des choses chouettes dans le web. Cette toile de connaissance est justement là pour externaliser une partie de sa mémoire et de ses expériences. <span lang=de><a href="https://fr.wikipedia.org/wiki/Lernen_durch_Lehren">Lernen durch Lehren</a></span> généralisé&#8239;!</p>
  82. <p>Pour chaque magicien auto-proclamé, il y a de potentielles nouvelles recrues qui sont démotivées par l’ampleur d’une tâche qui est devenue un mythe. Celui créé par une élite qui en profite allègrement.</p>
  83. <p>J’aimerais participer à son piétinement.</p>
  84. <hr />
  85. <p><mark>Lu depuis&nbsp;:</mark></p>
  86. <blockquote lang="en">
  87. <p>But knowing how to research, how to look things up? Knowing how to parse good information from junk, and make effective decisions based on what you’ve learned? That’s a critical skill for modern developers.</p>
  88. <p>That’s not “copy-pasta.” That’s being good at your job.</p>
  89. <p><cite><em><a href="https://gomakethings.com/big-surprise-that-guy-who-made-a-third-of-his-company-quit-has-no-idea-what-hes-talking-about./">Big surprise! That guy who made a third of his company quit has no idea what he’s talking about.</a></em> (<a href="/david/cache/2021/1ee4ce7a8ae1f5dee1a762e0b4ca921e/">cache</a>)</cite></p>
  90. </blockquote>
  91. <h2><a href="/david/2021/11/25/" title="Lien permanent vers cet article">Git</a> (2021-11-25)</h2>
  92. <blockquote lang="en">
  93. <p>Rant time: You’ve heard it before, git is <em>powerful</em>, but what good is that power when everything is so damn hard to do? Interactive rebasing requires you to edit a goddamn TODO file in your editor? <em>Are you kidding me?</em> To stage part of a file you need to use a command line program to step through each hunk and if a hunk can’t be split down any further but contains code you don’t want to stage, you have to edit an arcane patch file <em>by hand</em>? <em>Are you KIDDING me?!</em> Sometimes you get asked to stash your changes when switching branches only to realise that after you switch and unstash that there weren’t even any conflicts and it would have been fine to just checkout the branch directly? <em>YOU HAVE GOT TO BE KIDDING ME!</em></p>
  94. <p><cite><em><a href="https://github.com/jesseduffield/lazygit#readme">LazyGit</a></em></cite></p>
  95. </blockquote>
  96. <p>Je profite de la découverte de cet outil pour une confidence qui n’en est pas vraiment une&nbsp;: j’utilise un client graphique pour tout ce qui a trait à <a href="https://git-scm.com/">git</a> (et je n’en ai pas honte).</p>
  97. <p>J’ai longtemps utilisé <a href="https://www.mercurial-scm.org/">mercurial</a> à la main car je trouvais les commandes relativement intuitives mais en passant à <em>git</em> il y a une dizaine d’années, je me suis retrouvé la moitié du temps à aller chercher des commandes sur <a href="https://stackoverflow.com/questions/tagged/git">StackOverflow</a>, puis à faire des <em>alias</em> car c’était impossible à retenir, puis à perdre du code, etc. Au final, quitte à lancer des commandes que je comprends à peine (il parait que c’est moins cryptique aujourd’hui) autant utiliser celles qui ont été éprouvées par d’autres.</p>
  98. <p><a href="https://www.git-tower.com/mac">Tower</a> sait faire tout ce dont j’ai besoin à mon niveau. Et vu le temps que ça me fait gagner à répétition, c’est largement rentable. Peut-être même de plusieurs ordres de grandeur… considérant que je contribue quotidiennement à une dizaine de dépôts.</p>
  99. <p>Ce témoignage pour peut-être déculpabiliser des personnes qui pensent qu’il faut être un·e virtuose de la ligne de commande et de ses outils pour pouvoir développer. C’est un plus indéniable dans certaines situations d’être en capacité de descendre aussi bas niveau et d’avoir quelques notions de ce qu’il se passe mais il est tout à fait possible d’emprunter (et de créer&#8239;!) d’autres voies.</p>
  100. <h2><a href="/david/2021/11/23/" title="Lien permanent vers cet article">Horaires</a> (2021-11-23)</h2>
  101. <blockquote>
  102. <p>Autrement dit et pour résumer ces transformations, on peut parfaitement envisager dès maintenant une réduction massive du temps de travail. Ce n’est pas du tout «&nbsp;utopique&nbsp;» ou imaginaire de réclamer deux heures de travail par jour, du moins dans les secteurs susceptibles de l’automatisation-informatisation. D’ailleurs, compte tenu du fait que <mark>l’usure nerveuse est beaucoup plus grave et moins réparable que la fatigue musculaire</mark>, il est devenu indispensable dans ces métiers d’abréger les séquences de travail continu et de réduire déjà sérieusement la durée de la journée de travail. Mais ceci pourrait aller beaucoup plus loin. Or, il semble que ni dans le monde capitaliste ni dans le monde socialiste on ne soit décider à entrer dans cette voie. Il y a comme un blocage qui s’est effectué, et l’on <em>choisit</em> délibérément de ne pas appliquer les moyens techniques que l’on a à sa disposition pour maintenir l’ancienne structure à dominante industrielle. On introduit seulement de façon incoordonnée, à dose homéopathique, tel ou tel procédé. On automatise ici une chaîne de montage. On met en place une banque de données. On introduit un ordinateur etc. Mais il y a en réalité répugnance à changer le système.</p>
  103. <p>Ceci provient d’un certain nombre de difficultés qu’il ne faut pas méconnaître&nbsp;: une inadaptation idéologique évidente. Il y a une répugnance à abandonner «&nbsp;l’idéologie du travail&nbsp;», une angoisse à l’idée de tellement de temps «&nbsp;libre&nbsp;». On ne sait pas ce que deviendrait la vie humaine si elle n’était pas remplie par le travail. On soupçonne que cela supposerait un changement radical, total de société, de ses orientations, de ses objectifs, de ses structures, mais on n’est pas mûr pour tenter une pareille expérience.</p>
  104. <p><cite><em>Pour qui, pour quoi travaillons-nous&#8239;?</em>, Jacques Ellul, Foi &amp; Vie, n°4, juillet 1980</cite></p>
  105. </blockquote>
  106. <p>Facturation à la journée, à l’heure, parfois sur des créneaux un peu hybrides. Pas facile de trouver la granularité qui soit la plus pertinente en ce moment. À la fois pour mon énergie, et pour les produits, et pour les équipes.</p>
  107. <p>À cela vient s’intégrer, de manière transverse, la pénibilité de la tâche en elle-même. Comment facturer au temps lorsque cette durée n’est pas fatigante de manière équivalente d’une heure sur l’autre&#8239;? <em>Quid</em> de l’implication émotionnelle&#8239;? De ce <em>bug</em> que l’on amène courir avec soi&#8239;? De ce commentaire qui va longtemps rester en travers&#8239;?</p>
  108. <p>Je ne sais pas si la solution est la <a href="https://adactio.com/journal/18620">semaine</a> (<a href="/david/cache/2021/6513cd7104f4e6a8c7b3e0d759b467d8/">cache</a>) de <a href="https://blog.le-filament.com/posts/semaine-4jours/">4&nbsp;jours</a> (<a href="/david/cache/2021/c535b353e2af3eb65e4cf0de232bdad5/">cache</a>) ou celle de <a href="https://www.youtube.com/watch?v=iM2nQuwwuKQ">168&nbsp;heures</a>, il y a du vrai dans chacune de ces approches et des ressentis différents vis-à-vis du travail. De ces <a href="https://oncletom.io/2021/08/16/victoire-professionnels/">activités ayant créées des professions</a> (<a href="/david/cache/2021/1e65aa7484aa157870c2a1b735f36a26/">cache</a>) très lucratives et dont je bénéficie si facilement.</p>
  109. <p>Je payerais cher pour savoir ce que penserait Jacques Ellul d’une telle situation.</p>
  110. <hr />
  111. <p><mark>Lu depuis&nbsp;:</mark></p>
  112. <blockquote>
  113. <p>Mais il faudrait déjà que l’on se parle<br />
  114. Malgré les bouchons d’oreille les machines qui martèlent nos silences à la pause pourquoi se dire et quoi se dire d’ailleurs<br />
  115. Que l’on en chie<br />
  116. Que l’on peine à trouver le sommeil le week-end<br />
  117. Mais que l’on fait<br />
  118. Comme si<br />
  119. Tout allait bien<br />
  120. On a un boulot<br />
  121. Même si de merde<br />
  122. Même si l’on ne se repose pas<br />
  123. On gagne des sous<br />
  124. Et l’usine nous bouffera<br />
  125. Et nous bouffe déjà</p>
  126. <p><cite><em>À la ligne</em>, Joseph Ponthus</cite></p>
  127. </blockquote>
  128. <p>De quoi remettre en perspective mes questionnements de privilégié.</p>
  129. <h2><a href="/david/2021/11/20/" title="Lien permanent vers cet article">Hypertélie</a> (2021-11-20)</h2>
  130. <details>
  131. <summary>Déplier pour lire le contenu de la publication</summary>
  132. <blockquote>
  133. <p>Il est assez courant qu’une innovation consiste à réutiliser un objet technique plus ancien, en particulier quand les générations récentes d’une lignée technique ont évolué vers ce que Simondon appelle <mark>«&nbsp;l’hypertélie&nbsp;», c’est-à-dire quand le fonctionnement de l’objet a été suradapté à une fonction précise et à un milieu donné</mark>. Ses performances sont inégalables dans cette configuration, mais il ne peut plus être employé pour remplir d’autres fonctions qu’il assurait auparavant et il se dérègle ou tombe en panne dès que le milieu varie. Il a perdu en «&nbsp;généricité&nbsp;». Alors, il faut revenir à la génération précédente avant d’envisager un progrès majeur, c’est-à-dire une réorganisation globale de l’objet qui le rende plus synergique.</p>
  134. <p><cite><em>Penser l’innovation sur Arrakis</em>, Vincent Bontems dans <em>Dune&nbsp;: exploration scientifique et culturelle d’une planète-univers</em></cite></p>
  135. </blockquote>
  136. <p>J’ai maintenant un <a href="https://fr.wikipedia.org/wiki/Caract%C3%A8re_hypert%C3%A9lique">mot/concept/caractère</a> pour décrire ce qu’il s’est passé dans le Web ces cinq dernières années. J’ai l’impression que c’est en train de se <a href="https://resilientwebdesign.com/">réorganiser</a> pour créer des <a href="https://stimulus.hotwired.dev/">synergies</a> entre les <a href="https://htmx.org/">différentes</a> <a href="/david/2021/11/03/" title="Composants">parties</a>.</p>
  137. <p>C’est marrant de le retrouver dans un livre sur Dune qui cite Simondon dans <em><a href="https://fr.wikipedia.org/wiki/Du_mode_d%27existence_des_objets_techniques">Du mode d’existence des objets techniques</a></em>.</p>
  138. <blockquote>
  139. <p>En fait, les traits hypertéliques ou exubérants résultent de l’action de la sélection sexuelle et du conflit sexuel entre les partenaires.</p>
  140. <p><cite><em><a href="https://fr.wikipedia.org/wiki/Caract%C3%A8re_hypert%C3%A9lique">Caractère hypertélique</a></em></cite></p>
  141. </blockquote>
  142. <p>Oh non, rien.</p>
  143. </details>
  144. <h2><a href="/david/2021/11/03/" title="Lien permanent vers cet article">Composants</a> (2021-11-03)</h2>
  145. <details>
  146. <summary>Déplier pour lire le contenu de la publication</summary>
  147. <blockquote lang="en">
  148. <p>Web Components had so much potential to empower HTML to do more, and make web development more accessible to non-programmers and easier for programmers. Remember how exciting it was every time we got new shiny HTML elements that actually do stuff? Remember how exciting it was to be able to do sliders, color pickers, dialogs, disclosure widgets straight in the HTML, without having to include any widget libraries?</p>
  149. <p>The promise of Web Components was that we’d get this convenience, but for a much wider range of HTML elements, developed much faster, as nobody needs to wait for the full spec + implementation process. We’d just include a script, and boom, we have more elements at our disposal!</p>
  150. <p><cite><em><a href="https://lea.verou.me/2020/09/the-failed-promise-of-web-components/">The failed promise of Web Components</a></em> (<a href="/david/cache/2021/68cd338e37c60a8ed179222c6b1af01f/">cache</a>)</cite></p>
  151. </blockquote>
  152. <p>Le constat ne souffrait pas d’ambiguïté il y a un an. Qu’en est-il aujourd’hui&#8239;?</p>
  153. <p>Il y a Simon Willison qui commente un <a href="https://til.simonwillison.net/web-components/understanding-single-file-web-component">Web Component tenant dans un seul fichier</a> (<a href="/david/cache/2021/8016f83f512107dd26e5780b08ea7305/">cache</a>). Et Dave Rupert qui <a href="https://daverupert.com/2021/10/html-with-superpowers/">parle de leurs super-pouvoirs</a> (<a href="/david/cache/2021/eb14bb1071cfe2bd952aa9280c6a4860/">cache</a>). Tout le monde espère pouvoir <a href="https://elisehe.in/2021/08/22/using-the-platform">les utiliser nativement</a> (<a href="/david/cache/2021/0f1f65d09181752916216e892bb192d8/">cache</a>).</p>
  154. <p>En attendant, il y a des petits <em>frameworks</em> comme <a href="https://tonicframework.dev/">Tonic</a> ou <a href="https://lego.js.org/">Lego</a>. Des plus conséquents comme <a href="https://lit.dev/">Lit</a>.</p>
  155. <p>Tout espoir n’est pas perdu. Juste <a href="/david/blog/2013/python-javascript/">une décennie</a>.</p>
  156. </details>
  157. <h2><a href="/david/2021/10/29/" title="Lien permanent vers cet article">Vélocité</a> (2021-10-29)</h2>
  158. <details>
  159. <summary>Déplier pour lire le contenu de la publication</summary>
  160. <blockquote lang="en">
  161. <p>It’s true that the gains from picking the right problem can be greater than the gains from having better tactical execution because the gains from picking the right problem can be unbounded, but it’s also much <mark>easier to improve tactical execution</mark> and doing so also helps with picking the right problem because having faster execution lets you experiment more quickly, which helps you find the right problem.</p>
  162. <p><cite><em><a href="https://danluu.com/productivity-velocity/">Some reasons to work on productivity and velocity</a></em> (<a href="/david/cache/2021/50e183c99474ec15a833b2375aea1faf/">cache</a>)</cite></p>
  163. </blockquote>
  164. <p>Une réflexion récente de <a href="http://scopyleft.fr/">Sarah</a> sur la vitesse (dans un contexte de développement) m’a interpellé car je suis de moins en moins convaincu que ce soit un facteur de <em>réussite</em> important pour un produit. Et c’est là où il va falloir définir «&nbsp;réussite&nbsp;». C’est un peu un accident lorsque ça marche&nbsp;:</p>
  165. <ul>
  166. <li>un public qui a un besoin&#8239;;</li>
  167. <li>un produit qui est connu de ce public&#8239;;</li>
  168. <li>une équipe qui se fait confiance&#8239;;</li>
  169. <li>un budget/revenu qui permet d’arriver à un produit fonctionnel&#8239;;</li>
  170. <li>une connaissance autour de la problématique qui est capitalisée&#8239;;</li>
  171. <li>etc.</li>
  172. </ul>
  173. <p>La vitesse d’avancement de l’équipe technique dans tout ça est rarement le goulot d’étranglement. (En ayant conscience du biais de ne pas vouloir faire partie de ce goulot, qui m’invisibilise peut-être des situations passées…).</p>
  174. <p>Si ça se trouve, introduire un peu de lenteur permet de mieux évaluer la pertinence de ce que l’on expérimente parfois, de prendre du recul, de trouver des solutions moins techniques, de diluer la pression, d’avoir davantage d’interactions avec les utilisateur·ices. Si ça se trouve.</p>
  175. <blockquote lang="en">
  176. <p>The acceleration of our collective pace of life is not a result of stupidity or irrationality; rather, it is a symptom of what is perfectly predicted by the prisoner’s dilemma at a global scale: Hyper-rational individuals making hyper-rational decisions on how to spend their time by launching into an inescapable arms race of productivity. <mark>Burnout is inevitable.</mark></p>
  177. <p><cite><em><a href="https://zandercutt.com/2019/02/18/were-optimizing-ourselves-to-death/">We’re Optimizing Ourselves to Death</a></em> (<a href="/david/cache/2021/b3db6a66bfa8f11941f00ac4fa1175e5/">cache</a>)</cite></p>
  178. </blockquote>
  179. </details>
  180. <h2><a href="/david/2021/10/19/" title="Lien permanent vers cet article">Lecteur d’écran</a> (2021-10-19)</h2>
  181. <details>
  182. <summary>Déplier pour lire le contenu de la publication</summary>
  183. <blockquote lang="en">
  184. <p>Another false assumption is that screen readers understand the human content they are reading. <mark>They do not.</mark> Mostly. Screen reader heuristics will look at some strings of characters and announce them differently than what you may see (1<sup>st</sup> as &quot;first&quot;). But even that varies across screen readers <em>and</em> browsers.</p>
  185. <p><cite><em><a href="https://adrianroselli.com/2021/10/blaming-screen-readers-red-flag.html">Blaming Screen Readers 🚩×5</a></em> (<a href="/david/cache/2021/4e5e21da7b89d6a426d51423b0c1a062/">cache</a>)</cite></p>
  186. </blockquote>
  187. <p>C’est la réflexion que je me faisais lorsqu’on parle d’accessibilité et de point médian pour une écriture inclusive&nbsp;: pourquoi ne pas faire évoluer les outils si c’est là que la conversion pose problème&#8239;?</p>
  188. <p>Adrian Roselli y répond en partie dans son article, ça n’est pas aussi simple — ni rapide — que ça en a l’air. Les solutions faisant appel à la technique (des autres) sont si confortables…</p>
  189. </details>
  190. <h2><a href="/david/2021/10/17/" title="Lien permanent vers cet article">Ét(ec)h(n)ique</a> (2021-10-17)</h2>
  191. <details>
  192. <summary>Déplier pour lire le contenu de la publication</summary>
  193. <blockquote lang="en">
  194. <p>10 + 1&nbsp;Commandments for Ethical Techies</p>
  195. <ol>
  196. <li>Understand your <strong>basic professional obligations</strong>.</li>
  197. <li>Know your specific <strong>legal and contractual obligations</strong> and those governing your software and project.</li>
  198. <li>Know your own <strong>ethical bottom line</strong>.</li>
  199. <li>Understand whose <strong>interests your work serves</strong>.</li>
  200. <li>Know the <strong>harms your software could do</strong>.</li>
  201. <li>Maintain <strong>critical awareness</strong> of your whole work situation.</li>
  202. <li>Be good at <strong>saying “no”</strong>.</li>
  203. <li>Be good at <strong>speaking truth to power</strong>.</li>
  204. <li>Know your <strong>escalation path</strong>.</li>
  205. <li>Know your own <strong>tolerance for personal and career risk</strong>.</li>
  206. <li><strong>Document</strong> your concerns!</li>
  207. </ol>
  208. <p><cite>Fiona Charles <a href="https://twitter.com/FionaCCharles/status/1448700534001655811">sur Twitter</a></cite></p>
  209. </blockquote>
  210. <p><a href="https://ronan.amicel.net/">Ronan</a> me transmet ces commandements suite à une <a href="/david/2021/10/15/" title="Engagement">précédente discussion</a>. Je les garde sous le coude car c’est une perpétuelle remise en question de mon côté. Savoir si les (méta)données que je suis en train de collecter pourront se retourner contre leurs producteur·ices. Faire le moins de dégâts possibles dans une forme de <a href="/david/2020/10/08/">refus de parvenir</a> à la sauce numérique.</p>
  211. <p>Lorsqu’on travaille principalement avec un État, chaque enregistrement pourrait devenir une preuve à charge sans même en avoir conscience <em>aujourd’hui</em>.</p>
  212. <p>Là est le danger&nbsp;: le futur(?) Grand Croisement.</p>
  213. </details>
  214. <h2><a href="/david/2021/10/15/" title="Lien permanent vers cet article">Engagement</a> (2021-10-15)</h2>
  215. <details>
  216. <summary>Déplier pour lire le contenu de la publication</summary>
  217. <p>Il y a une notion en alpinisme/escalade qui est relativement indépendante de la difficulté. Il s’agit du niveau d’engagement de la paroi/voie. Ce n’est pas la même chose de parcourir un chemin de randonnée ou de se faire une arrête avec 1000&nbsp;m d’à-pic de chaque côté. Pourtant la largeur est la même, mais la conséquence d’une inattention ou d’un trébuchement n’a pas la même criticité.</p>
  218. <p><a href="https://ronan.amicel.net/">Ronan</a> me rappelait à juste titre qu’il en est de même sur des produits informatiques. Il y a le chemin, mais il y aussi le vide autour (ou parfois plutôt le trop plein). Il est facile de se laisser happer par des problématiques bien au-delà du périmètre auquel on voudrait bien se circonscrire pour épargner sa santé mentale.</p>
  219. <p>En se focalisant sur le <a href="https://fr.wikipedia.org/wiki/Cotation_en_alpinisme#Neige,_glace_et_mixte">degré technique</a>, on néglige parfois la <a href="https://fr.wikipedia.org/wiki/Cotation_en_alpinisme#Neige,_glace_et_mixte">cotation de sérieux</a> qui est toute aussi importante — si ce n’est plus — pour revenir en un seul morceau.</p>
  220. <p>L’évaluation de sa capacité d’engagement est indissociable d’une bonne connaissance de ses capacités et… d’une certaine humilité.</p>
  221. </details>
  222. <h2><a href="/david/2021/10/09/" title="Lien permanent vers cet article">Slowgrégateur</a> (2021-10-09)</h2>
  223. <details>
  224. <summary>Déplier pour lire le contenu de la publication</summary>
  225. <blockquote lang="en">
  226. <p>The current state web browsers is particularly damning from this perspective. Web browsers have access to such a treasure trove of valuable, often well-structured information about what we learn and how we think, what interests we have, and who we talk to. Rather than trying to take that information and <mark>let us build workflows out of them</mark>, browsers remain a strictly utilitarian tool – a rectangular window into documents and apps that play dumb, ignorant of the valuable information that transits through them every day. I think we can do better.</p>
  227. <p><cite><em><a href="https://thesephist.com/posts/browser/">The web browser as a tool of thought</a></em> (<a href="/david/cache/2021/ed384fc76fbe9728070efb6c71a0eb9c/">cache</a>)</cite></p>
  228. </blockquote>
  229. <p>J’ai de plus en plus envie/besoin que ce soit mon agrégateur de <a href="/david/blog/2019/flux-rss/">flux RSS</a> qui soit plus flexible. Personnaliser l’indexation, choisir de pouvoir introduire du délai entre les articles (voir plus bas), distinguer ce qui peut rester en stock sans que ce soit problématique, etc.</p>
  230. <p><a href="https://hello-bokeh.fr/">Anne-Sophie</a> me racontait qu’elle avait réussi à reconstruire un flux à partir d’un site qui donnait des conseils/tutos pour enfants avec plusieurs années de décalage pour que ça soit synchronisé avec un âge qui lui est pertinent, je trouve cela fabuleux et tellement peu mis en avant.</p>
  231. <p>Un autre exemple, lorsque je découvre un blog qui m’intéresse, je vais lire les dernières entrées mais ce qui serait pertinent serait de remonter d’anciens articles sporadiquement pour m’aider à mieux comprendre comment la personne en est arrivée là. C’est le cheminement que je trouve intéressant.</p>
  232. <p>Une dernière option, un flux de plusieurs milliers d’éléments c’est sous-optimal vu que c’est une technologie basée sur le fait de répéter des requêtes indéfiniment sur cette ressource (vs. uniquement pousser les nouveaux éléments vers les clients). En revanche, récupérer l’intégralité du stock une bonne fois pour toute afin de l’indexer et faire remonter des choses via une recherche plus ou moins intelligente, là c’est pertinent. Je ne connais pas d’option dans ces formats pour différencier ces deux usages.</p>
  233. <p>J’aurais plein d’autres idées, mon problème avec les outils actuels n’est pas liée à l’infobésité mais à la malnutriformation (?!)&nbsp;: avoir l’impression de toucher du doigt des mines d’informations et de réflexions qui sont enfouies par les 10&nbsp;dernières entrées.</p>
  234. <p><em>Je pense que l’on peut faire mieux.</em></p>
  235. </details>
  236. <h2><a href="/david/2021/09/23/" title="Lien permanent vers cet article">Dossier</a> (2021-09-23)</h2>
  237. <details>
  238. <summary>Déplier pour lire le contenu de la publication</summary>
  239. <blockquote lang="en">
  240. <p>It’s a difficult concept to get across, though. Directory structure isn’t just unintuitive to students — it’s <em>so</em> intuitive to professors that they have difficulty figuring out how to explain it. “Those of us who have been around a while <em>know</em> what a file is, but I was at a bit of a loss to explain it,” lamented one educator […] Others, meanwhile, believe it’s professors who need to adjust their thinking. […] Even professors who have incorporated directory structure into their courses suspect that they may be clinging to an approach that’s soon to be obsolete. […] His advice to fellow educators: Get ready. “This is not gonna go away,” he says. “You’re not gonna go back to the way things were. <mark>You have to accept it.</mark> The sooner that you accept that things change, the better.”</p>
  241. <p><cite><em><a href="https://www.theverge.com/22684730/students-file-folder-directory-structure-education-gen-z">Kids who grew up with search engines could change STEM education forever</a></em> (<a href="/david/cache/2021/f82b9c31388b1f42ddd9d4d7849d7c86/">cache</a>)</cite></p>
  242. </blockquote>
  243. <p>Un article fascinant qui interroge sur ce qui doit être transmis et ce qui doit évoluer par l’usage quitte à adapter les outils… et les modèles mentaux des générations précédentes. Ces derniers sont probablement les moins flexibles.</p>
  244. <p>Je me suis rendu compte que je classais beaucoup moins mes courriels, je suis passé d’une arborescence assez profonde à une demi-douzaine de dossiers. Je peux me le permettre car la recherche de Mail.app est très pertinente, en contrepartie cela me lie fortement à l’outil et dès que je teste une alternative je suis frustré par ce manque.</p>
  245. <p>Tristement, j’ai construit mes propres barreaux. Chaque génération est-elle condamnée à tenter de les transformer en échelles&#8239;?</p>
  246. <figure>
  247. <a href="#nuages"
  248. title="Cliquer pour une version haute résolution">
  249. <img src="/static/david/2021/nuages.jpg" alt="Des nuages dans le ciel."
  250. loading="lazy" width="2048" height="1366" />
  251. </a>
  252. <a href="#_" class="lightbox" id="nuages">
  253. <img src="/static/david/2021/nuages.jpg" alt="Des nuages dans le ciel."
  254. loading="lazy" width="2048" height="1366" />
  255. </a>
  256. <figcaption>Rester léger.</figcaption>
  257. </figure>
  258. <hr />
  259. <p>Réponse(s) de <a href="https://eldritch.cafe/@davidbruant/107020047121002118">David</a>&nbsp;:</p>
  260. <blockquote>
  261. <p>Ma croyance, c’est que les dossiers sur ordi sont un héritage de la manière dont les systèmes d’exploitation sont organisés (par fichier et dossier)<br />
  262. Et les premières interfaces utilisateurs ont reflété naïvement l’API du système d’exploitation</p>
  263. <p>Et c’était mieux que rien</p>
  264. <p>Et clairement, une fois que l’on peut chercher via une requête textuelle qui a une compréhension correcte des dates et du langage, la notion de dossier perd complètement son intérêt</p>
  265. <p>Déjà, le déplacement de «&nbsp;dossier&nbsp;» vers «&nbsp;label&nbsp;» que GMail a proposé a été un premier pas en avant libérateur pour les emails</p>
  266. <p>Le dossier, c’est une des solutions possibles au problème «&nbsp;j’ai besoin de retrouver une information&nbsp;»<br />
  267. Et il y en a beaucoup d’autres</p>
  268. <p>J’imagine que le dossier émerge dans les systèmes d’exploitation, parce qu’il faut trouver <em>une</em> solution au problème de retrouver ses infos et le rangement manuel dans des dossiers, c’est 1) assez familier comme modèle mental et 2) facile à implémenter (enfin j’imagine parce que je n’ai jamais implémenter un système de fichier… en tout cas, c’est beaucoup plus facile à implémenter qu’un système qui comprend le langage)</p>
  269. <p>Une des difficulté à implémenter autre chose que des dossiers (ou des labels), c’est que ça amène rapidement des problèmes de performance ou de pertinence</p>
  270. <p>Les dossiers, il n’y a pas de problème de performance (…et pour la pertinence, on délègue entièrement la responsabilité à l’utilisateur de créer/maintenir une arborescence qui lui est pertinente)</p>
  271. <p>Implémenter un système de recherche pertinent, ça demande une compréhension correcte du langage du contenu<br />
  272. …mais quel langage&#8239;?<br />
  273. parce qu’une recherche s’implémente différemment selon le langage<br />
  274. Et si on travaille dans plusieurs langues&#8239;?</p>
  275. <p>Et l’usage de la recherche devient une partie importante de l’expérience utilisateur</p>
  276. </blockquote>
  277. <p>Je tombe également sur&nbsp;: <a href="https://techcrunch.com/2021/09/29/google-introduces-a-new-way-to-search-that-combines-images-and-text-into-one-query/">Google introduces a new way to search that combines images and text into one query</a> (<a href="/david/cache/2021/b65dcd34bb1ea8d8b610aaf06a0b5902/">cache</a>).</p>
  278. </details>
  279. <h2><a href="/david/2021/09/16/" title="Lien permanent vers cet article">Analphabète</a> (2021-09-16)</h2>
  280. <details>
  281. <summary>Déplier pour lire le contenu de la publication</summary>
  282. <blockquote>
  283. <p>Mais depuis quelques mois j’ai trouvé une sorte de parade à cela. Je me fais simplement passer pour un analphabète numérique. Étant donné que je sais que, peu importe les démarches que je souhaite réaliser, il y a de fortes chances pour que je ne rentre pas dans les cases, j’arrive ainsi à établir les dossiers <mark>avec une véritable personne qui peut prendre en compte mes spécificités</mark> sans avoir, avant, à perdre du temps auprès d’une machine.</p>
  284. <p><cite><em><a href="http://shl.huld.re/~f6k/log/vol12/13-l-administration-publique-et-moi.html">Journal de f6k, vol. 12&nbsp;num. 13</a></em> (<a href="/david/cache/2021/dd8f6ee1a59a052e72c5e1f5f8c5fc39/">cache</a>)</cite></p>
  285. </blockquote>
  286. <p>Hier, Elle reçoit un courriel la notifiant qu’elle a un nouveau message de l’immigration. C’est un enjeu stressant pour nous, car il y a un visa à la clef et toute une chaîne de conséquences. Elle essaye de se connecter avec son téléphone mais une fois authentifiée, retour à l’accueil, déconnectée. Elle me demande de tester à mon tour, même erreur depuis un ordinateur. Elle se connecte à Twitter car c’est le seul moyen aujourd’hui de pouvoir interagir avec une administration. Elle fait état du <em>bug(?)</em>. La réponse est digne d’un «&nbsp;dans le doute, <em>reboot</em>&nbsp;»&nbsp;: essayez de (très) nombreuses fois après avoir vidé le cache du navigateur…</p>
  287. <p>Le lendemain, Elle tente de se (re)connecter au site de l’administration en pestant sur le fait que le courriel de notification pourrait contenir le message et s’éviter tout cela. Cette fois-ci, ça marche&#8239;! Le contenu du message&nbsp;:</p>
  288. <blockquote>
  289. <p>Vous allez prochainement recevoir un courrier qui contiendra votre nouveau visa.</p>
  290. </blockquote>
  291. <p><em>Tout ça pour ça.</em> Un poids appréciable en moins tout de même. Il faudrait que je fasse le compte de ce que nous coûte en argent (et en temps&#8239;!) une immigration choisie.</p>
  292. <p>Histoire de chialer comme un bon français 🙃.</p>
  293. </details>
  294. <h2><a href="/david/2021/09/09/" title="Lien permanent vers cet article">Documentation</a> (2021-09-09)</h2>
  295. <details>
  296. <summary>Déplier pour lire le contenu de la publication</summary>
  297. <blockquote lang="en">
  298. <p>Here are six requirements that I have on a project for it to reach my gold approval for stellar docs.</p>
  299. <ol>
  300. <li>Your docs belong in the code repository</li>
  301. <li>Your docs is not extracted from code</li>
  302. <li>Your docs features examples</li>
  303. <li>You document every API call you provide</li>
  304. <li>Your docs is easily accessible and browsed</li>
  305. <li>Your docs should be <mark>easy to contribute to</mark></li>
  306. </ol>
  307. <p><cite><em><a href="https://daniel.haxx.se/blog/2021/09/04/making-world-class-docs-takes-effort/">Making world-class docs takes effort</a></em> (<a href="/david/cache/2021/f327a02cabbad6884b057958ec213668/">cache</a>)</cite></p>
  308. </blockquote>
  309. <p>J’ai mis en place un document collaboratif <a href="/david/2021/09/01/" title="Rentrée">dernièrement</a> en prenant pour acquis que le markdown était lisible et éditable. <em>C’était une grossière erreur.</em> Même avec l’aide de hackmd, un document contenant principalement des liens est interprété comme étant trop technique pour être accessible à des personnes n’ayant pas cette habitude.</p>
  310. <p>Un bon rappel que la route est <a href="https://degooglisons-internet.org/fr/">encore très longue…</a> (<a href="/david/cache/2021/8589fdcb9656efb132e1513c07d48bd1/">cache</a>)</p>
  311. </details>
  312. <h2><a href="/david/2021/09/04/" title="Lien permanent vers cet article">Suspension</a> (2021-09-04)</h2>
  313. <details>
  314. <summary>Déplier pour lire le contenu de la publication</summary>
  315. <blockquote>
  316. <p>Et pourtant… En se mettant au vélo, des petits bourgeois blancs découvrent ce que ça fait, de se faire traiter comme de la merde, d’être mis en danger par des personnes bien protégées par leur position sociale. Le géographe <a href="https://cyclops.hypotheses.org/author/cyclops">Matthieu Adam</a> témoigne de leur prise de conscience de cette «&nbsp;oppression systémique&nbsp;» maintenant qu’ils la subissent. Est-ce que ça va en faire des héros de la justice sociale, des alliés hors pair des classes exploitées&#8239;? Vu depuis les pistes cyclables parisiennes, ça n’en prend pas le chemin.</p>
  317. <p><cite><em><a href="https://blog.ecologie-politique.eu/post/Misere-du-cyclisme-urbain">Misère du cyclisme urbain</a></em> (<a href="/david/cache/2021/9b26314b7796086b9109da72993751b5/">cache</a>)</cite></p>
  318. </blockquote>
  319. <p><em>Avertissement&nbsp;: je vais parler de matériel qui coûte indécemment cher.</em></p>
  320. <p>J’attendais d’avoir un peu de recul pour parler d’adaptations que j’ai pu faire sur mon vélo pour ménager mon corps vieillissant. Je rappelle que je suis dans un contexte où les chaussées sont soumises à des contraintes climatiques (et politiques) extrêmes. À tel point que mon vélo de triathlon en carbone reste au garage depuis 5&nbsp;ans… à part pour aller faire <a href="https://www.parcjeandrapeau.com/fr/circuit-gilles-villeneuve-montreal/">quelques tours de hamster</a> à l’occasion.</p>
  321. <p>J’ai <a href="https://konaworld.com/archive/2017/jake_the_snake.cfm">ce vélo</a> depuis 4&nbsp;ans, acheté en fin de saison en promo. On a connu ensemble toutes les météos possibles et imaginables et je suis bien content qu’il roule encore&#8239;! Les améliorations pour l’adapter à mon niveau de confort&nbsp;:</p>
  322. <ol>
  323. <li>Passer à des pneus en 38&#8239;mm — ce sont les plus larges qui rentrent dans la fourche — qui plus est <em>tubeless</em> pour ne pas avoir à trop les gonfler (sans risquer de pincer la chambre à air). Je sais que ça peut être beaucoup plus galère si tu arrives à crever quand même mais ça ne m’est pas encore arrivé, le scellant fait sa job.</li>
  324. <li>Suspendre la selle et le guidon <a href="https://redshiftsports.com/pages/shockstop">avec des élastomères</a> pour encaisser les chocs tout en restant sur un profil course. Ce changement est plus récent et j’ai hésité à changer complètement de vélo pour intégrer la suspension au cadre mais ça m’a semblé plus portable/durable ainsi. Je n’ai pas encore testé ce que ça donne par grand froid mais dans ces conditions ça ne me dérange pas que le vélo soit plus rigide.</li>
  325. <li>Changer de selle pour une <a href="https://infinitybikeseat.com/">version suspendue</a> également. Pour être plus précis, c’est la sensation d’être suspendu qui est assez unique et c’était un peu un coup de poker (vu le prix&#8239;!) mais j’en suis très content après 6&nbsp;mois d’utilisation (ouf&#8239;!).</li>
  326. </ol>
  327. <p>La combinaison de ces trois modifications me permet de prendre le vélo quotidiennement pour aller à l’école (~15&#8239;km, ~1000&#8239;km à l’année) sans avoir de cuissard. De faire des <a href="/david/2020/05/20/">escapades</a> plus lointaines. Mais aussi de faire les courses, aller à la bibliothèque, à la piscine, gravir la seule <a href="https://fr.wikipedia.org/wiki/Mont_Royal">montagne locale</a>, etc. C’est mon moyen de locomotion principal, de loin.</p>
  328. <p>L’autre point fort, c’est que je n’ai plus mal aux poignets ni au bas du dos qui, à force de contracter à chaque nid-de-foule, finissaient par induire une fatigue musculaire qui n’était pas liée à la puissance me permettant d’avancer. Je n’ai pas l’impression d’avoir perdu en efficacité — malgré la suspension — justement car ce gain est d’un ordre de grandeur au-dessus dans mon cas. Même si la transition s’est faite sur plusieurs mois, j’ai pu sentir l’évolution des douleurs et je commence à avoir fait suffisamment de sports pour savoir qu’il faut préserver ce qu’il nous reste le plus longtemps possible&nbsp;:-).</p>
  329. <blockquote>
  330. <p>Toutes les religions organisées ont à faire face à un problème commun, qui représente le point faible par où nous pouvons les pénétrer et les orienter selon nos propres besoins. Ce problème est&nbsp;: comment faire la distinction entre la révélation et l’<em>hubris</em>&#8239;?</p>
  331. <p><cite><em>Missionaria Protectiva, Enseignement pour les Initiés</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> V. Les Hérétiques de Dune</em>, Frank Herbert</cite></p>
  332. </blockquote>
  333. <figure>
  334. <a href="#jake-the-snake"
  335. title="Cliquer pour une version haute résolution">
  336. <img src="/static/david/2021/jake-the-snake.jpg" alt="Une photo du vélo incluant les modifications."
  337. loading="lazy" width="2048" height="1536" />
  338. </a>
  339. <a href="#_" class="lightbox" id="jake-the-snake">
  340. <img src="/static/david/2021/jake-the-snake.jpg" alt="Une photo du vélo incluant les modifications."
  341. loading="lazy" width="2048" height="1536" />
  342. </a>
  343. <figcaption>Sur la tige de selle, l’accroche pour le <a href="https://rideweehoo.com/">Weehoo</a> qui nous comble depuis plus d’un an.</figcaption>
  344. </figure>
  345. </details>
  346. <h2><a href="/david/2021/08/31/" title="Lien permanent vers cet article">Abstraction</a> (2021-08-31)</h2>
  347. <details>
  348. <summary>Déplier pour lire le contenu de la publication</summary>
  349. <blockquote lang="en">
  350. <p>Take a moment and think about this super power: if you write vanilla HTML, CSS, and JS, all you have to do is put that code in a web browser and it runs. Edit a file, refresh the page, you’ve got a feedback cycle. <mark>As soon as you introduce tooling, as soon as you introduce an abstraction not native to the browser, you may have to invent the universe for a feedback cycle.</mark> No longer writing CSS and instead writing Sass? Now you need a development server with a build process to watch your files and compile your changes <em>just to develop and test your project</em>. You’ve just added a giant, blocking dependency for your project to work. And if you can’t get that dependency working, your project is dead in the water until you can—both now and in the future.</p>
  351. <p><cite><em><a href="https://blog.jim-nielsen.com/2020/cheating-entropy-with-native-web-tech/">Cheating Entropy with Native Web Technologies</a></em> (<a href="/david/cache/2021/74eae1dc26bd4537941491b4e7e201bc/">cache</a>)</cite></p>
  352. </blockquote>
  353. <p>J’ai déjà beaucoup trop parlé du sujet et en même temps cela a été et pourrait encore être mon quotidien si je n’avais pas choisi une certaine forme d’ascétisme technologique (n’ayons pas peur des mots, <a href="http://aswemay.fr/co/040011.html">ataraxie numérique</a> (<a href="/david/cache/2021/1357452f72e8fab727df874cbc2582d4/">cache</a>) si on veut être vraiment pédant). Évaluer chaque outil pour son usage actuel et futur, sa maintenance, sa migration, ses <em>drama</em> (coucou <a href="https://hotwired.dev/">Hotwire</a>), son abandon pour la dernière mode. J’apprends hier qu’un produit est à l’arrêt pour X mois car il faut passer d’un <em>framework</em> JS à un autre. Tristesse d’un domaine où une telle pratique est courante. Bien éloignée d’un Web <a href="https://wimvanderbauwhede.github.io/articles/frugal-computing/">frugal</a> (<a href="/david/cache/2021/710f8cdebd7560223ebd378f9cbe7822/">cache</a>), il y a un excellent <a href="http://viznut.fi/texts-en/permacomputing_update_2021.html">résumé avec plein de liens ici</a> (<a href="/david/cache/2021/0f791a9509f762f1a1a36b6ca2333230/">cache</a>) si le sujet vous intéresse.</p>
  354. <p>Je suis admiratif des personnes faisant de <a href="https://zserge.com/posts/awfice/">petits outils conviviaux</a> (<a href="/david/cache/2021/3ac474db4dc65c1d25e99cb30655ff12/">cache</a>) qui permettent d’apprendre et de jouer avec la conception de l’outil en lui-même. Si je devais refaire de l’<a href="/david/pro/enseignement/">enseignement technique</a>, j’emprunterais probablement cette voie. À l’opposé de la camionnette à outils qu’il faut savoir dorénavant maîtriser, en opposition à la direction qu’un marché nous pousse à emprunter.</p>
  355. <p>Est-ce que l’on peut considérer l’accumulation de dette technique comme étant un <em>bullshit job</em>&#8239;?</p>
  356. <blockquote>
  357. <p>16. How does this technology empower me? At whose expense?</p>
  358. <p><cite><em><a href="https://theconvivialsociety.substack.com/p/the-questions-concerning-technology">The Questions Concerning Technology</a></em> (<a href="/david/cache/2021/b404382125c07935b98295a801049097/">cache</a>)</cite></p>
  359. </blockquote>
  360. <figure>
  361. <a href="#bourdons"
  362. title="Cliquer pour une version haute résolution">
  363. <img src="/static/david/2021/bourdons.jpg" alt="Deux bourdons qui butinent des chardons."
  364. loading="lazy" width="2048" height="1536" />
  365. </a>
  366. <a href="#_" class="lightbox" id="bourdons">
  367. <img src="/static/david/2021/bourdons.jpg" alt="Deux bourdons qui butinent des chardons."
  368. loading="lazy" width="2048" height="1536" />
  369. </a>
  370. <figcaption>Écrits pollinisateurs ?</figcaption>
  371. </figure>
  372. </details>
  373. <h2><a href="/david/2021/08/26/" title="Lien permanent vers cet article">Ambivalence</a> (2021-08-26)</h2>
  374. <details>
  375. <summary>Déplier pour lire le contenu de la publication</summary>
  376. <blockquote lang="en">
  377. <p>This is just what I’m used to nowadays – not using a technology because it’s the best-in-class or makes my life easier, but because it meets some high-minded criteria about how I think software should be: privacy-respecting, open-source, controlled by the user, etc.</p>
  378. <p>[…]</p>
  379. <p>For the time being, though, <mark>I’m going to keep acting like technology is an enemy</mark> I need to subdue rather than a purveyor of joys and delights.</p>
  380. <p><cite><em><a href="https://nolanlawson.com/2021/08/26/my-love-hate-affair-with-technology/">My love-hate affair with technology</a></em> (<a href="/david/cache/2021/67a6372e0d7e2b65224262106e8318b0/">cache</a>)</cite></p>
  381. </blockquote>
  382. <p>Toujours ce tiraillement très bien exprimé par Nolan Lawson entre l’insouciance des choses qui marchent (mais <a href="https://edwardsnowden.substack.com/p/all-seeing-i">on ne décide pas de la direction dans laquelle</a> (<a href="/david/cache/2021/9a458e7f3ad00b45d36511666ee29021/">cache</a>) elles vont) et la friction répétée d’outils qui ne prennent pas suffisamment soin des personnes trop éloignées — à différents niveaux et parfois de manière légitime — de l’équipe qui développe.</p>
  383. <p>Ces deux modèles encouragent des modèles de société différents et aucun des deux ne me convient. D’un côté des multi-milliardaires qui bousillent la planète, de l’autre des <em>tech bro</em> qui acquièrent un pouvoir soci·ét·al non négligeable (je caricature, #NotAllDevs, toussa). Ce n’est probablement pas le même ordre de grandeur mais ça me questionne pas mal quand même. Au milieu de tout ça, il y a probablement <a href="https://framablog.org/2019/12/10/archipelisation-comment-framasoft-concoit-les-relations-quelle-tisse/">des archipels</a> (<a href="/david/cache/2021/ef5bbfde106a3477ff728bf27413672d/">cache</a>) où il fait bon grandir, de manière un peu isolée pour se protéger, un peu entre-soi pour pouvoir se reposer. Ces endroits-refuges sont géniaux et j’ai de bons échanges sur Masto une fois mes interlocuteur·ices choisi·es, trié·es pour être acceptables. Mais peut-on rester insulaire indéfiniment&#8239;?</p>
  384. <p>J’ai beaucoup de doutes vis-à-vis de tous ces choix en ce moment. Quels sont les modèles les moins toxiques que je puisse encourager par mon attention&#8239;? Et potentiellement mon argent&#8239;?!</p>
  385. <p>Par ailleurs, je tombais aujourd’hui (via <a href="https://www.youtube.com/watch?v=ZdWx9_YfxFU">cette vidéo</a>) sur cette citation&nbsp;:</p>
  386. <blockquote>
  387. <p>L’histoire n’est pas quelque chose que l’on peut regarder en se disant «&nbsp;c’est inévitable&nbsp;», elle arrive parce que des gens ont pris des décisions […]</p>
  388. <p><cite>Marsha P. Johnson</cite></p>
  389. </blockquote>
  390. <figure>
  391. <a href="#geai-bleu-envers"
  392. title="Cliquer pour une version haute résolution">
  393. <img src="/static/david/2021/geai-bleu-envers.jpg" alt="Un geai bleu qui se tient à une branche, à l’envers (pour attraper des bleuets)."
  394. loading="lazy" width="2048" height="1366" />
  395. </a>
  396. <a href="#_" class="lightbox" id="geai-bleu-envers">
  397. <img src="/static/david/2021/geai-bleu-envers.jpg" alt="Un geai bleu qui se tient à une branche, à l’envers (pour attraper des bleuets)."
  398. loading="lazy" width="2048" height="1366" />
  399. </a>
  400. <figcaption>Peut-être faut-il prendre le problème à l’envers : de quoi ai-je besoin ? Vaste sujet.</figcaption>
  401. </figure>
  402. </details>
  403. <h2><a href="/david/2021/08/18/" title="Lien permanent vers cet article">Lettres</a> (2021-08-18)</h2>
  404. <details>
  405. <summary>Déplier pour lire le contenu de la publication</summary>
  406. <blockquote lang="en">
  407. <p>This is one small step towards something different: an ethic that prioritizes technologists’ agency, <mark>the need for self-reflection</mark>, and the importance of historical inquiry.</p>
  408. <p><cite><em><a href="https://letterstoayoungtechnologist.com/">Letters to a Young Technologist</a></em> (<a href="/david/cache/2021/2c416b360e5ea82c6be38cada47d9001/">cache</a>)</cite></p>
  409. </blockquote>
  410. <p>La déception du jour ce sont ces lettres avec un contenu profond mais une forme désastreuse. Le courrier est sollicité mais alors l’enveloppe&#8239;! Impossible d’afficher le moindre contenu sans charger pas moins de 13&nbsp;fichiers JavaScript depuis <code>static.cargo.site</code>, pour… 6&nbsp;pages de HTML qui pourraient facilement peser 10&nbsp;fois moins lourd.</p>
  411. <p>Pauvres jeunes, ils auront tellement à réparer…</p>
  412. <blockquote lang="en">
  413. <p>The second way that history can help us avoid mistakes is by showing us predictable ways things can go horribly wrong. In the light of history, we can take the long view on present-day crises and take care <mark>to not repeat the foibles of the past.</mark></p>
  414. <p><cite><em><a href="https://letterstoayoungtechnologist.com/Study-the-Past-Create-the-Future">Study the Past, Create the Future</a></em> (<a href="/david/cache/2021/520ea4867de8d36f3cd2b1132e44b719/">cache</a>)</cite></p>
  415. </blockquote>
  416. <p>Well, ¯\<em>(ツ)</em>/¯.</p>
  417. <figure>
  418. <a href="#merle-amerique"
  419. title="Cliquer pour une version haute résolution">
  420. <img src="/static/david/2021/merle-amerique.jpg" alt="Un merle d’Amérique mangeant une baie."
  421. loading="lazy" width="2048" height="1366" />
  422. </a>
  423. <a href="#_" class="lightbox" id="merle-amerique">
  424. <img src="/static/david/2021/merle-amerique.jpg" alt="Un merle d’Amérique mangeant une baie."
  425. loading="lazy" width="2048" height="1366" />
  426. </a>
  427. <figcaption>Vous reprendriez bien un peu de JS ?</figcaption>
  428. </figure>
  429. </details>
  430. <h2><a href="/david/2021/08/14/" title="Lien permanent vers cet article">Animalière</a> (2021-08-14)</h2>
  431. <details>
  432. <summary>Déplier pour lire le contenu de la publication</summary>
  433. <blockquote>
  434. <p>Wilderness without wildlife is just scenery. — Lois Crisler</p>
  435. </blockquote>
  436. <p>Envie de parler de <em>mon</em> approche concernant la photographie animalière. Ce n’est pas <em>la</em> bonne, ni même une que je recommande, c’est celle qui <em>me</em> convient en ce moment.</p>
  437. <ol>
  438. <li><strong>Légèreté</strong>&nbsp;: mon matériel fait 1,3&nbsp;Kg pour aller de 180&#8239;mm jusqu’à un équivalent 540&#8239;mm. Il n’a pas le meilleur piqué ou un <em>bokeh</em> de f(l)ou mais je peux le tenir à bout de bras pendant une balade de plusieurs heures sans qu’il soit un poids dont j’ai envie de me débarrasser. Et j’ai encore suffisamment de force pour ensuite tenir la pose lorsqu’il faut être statique à main levée pendant plusieurs minutes. Je parle de poids en premier car j’ai déjà eu du matériel beaucoup plus qualitatif (et dispendieux&#8239;!) et au final je ne l’avais que rarement avec moi, et encore moins en randonnée. Le meilleur appareil photo, c’est celui que j’ai (facilement) à portée de main&#8239;!</li>
  439. <li><strong>Qualité</strong>&nbsp;: tout est compromis, avec cette contrainte de poids je ne peux pas sortir LA photo. Et c’est correct, je reviens avec <em>les</em> photos. De toute façon, c’est principalement pour les partager sur des plateformes qui me font de la bouillie de pixels ou ici (et je prends soin de votre bande passante). À petites ambitions, petit capteur, un micro <sup>4</sup>/<sub>3</sub> me suffit amplement.</li>
  440. <li><strong>Comportement</strong>&nbsp;: j’essaye de photographier en dérangeant le moins possible. Il s’agit de capter des images, pas l’attention des animaux. Si j’en arrive à stresser l’animal, ça se verra de toute façon sur la photo… ou dans ma propre lecture de la photo. Les animaux sauvages sont extrêmement curieux, en étant plus dans l’attente et l’écoute ils finissent parfois par s’approcher d’eux-mêmes. <em>Toute ressemblance avec des animaux moins sauvage serait fortuite.</em></li>
  441. <li><strong>Contentement</strong>&nbsp;: mon intérêt actuel est dans l’observation et la connaissance que je peux acquérir de mon environnement. La photo qui vient avec, c’est le bonus pour ne pas oublier ces instants et éventuellement les partager. Je n’ai pas envie de la bonne «&nbsp;attitude&nbsp;» sur l’instantané mais de l’approche qui a permis à l’animal d’être suffisamment en confiance pour avoir ce comportement. Et tant pis si je loupe la photo à la fin, le simple fait d’en avoir été témoin me suffit.</li>
  442. <li><strong>Patience</strong>&nbsp;: j’ai envie de photographier des espèces locales, de prendre le temps de les connaître et de les approcher. Ce n’est pas un safari d’où il <em>faut</em> revenir avec des espèces exotiques mais un apprentissage — forcément lent — et une prise de conscience de mon environnement. Les animaux seront toujours là, différents… et moi aussi. Déguster cette exploration en prenant ce bien en patience, régulièrement.</li>
  443. </ol>
  444. <p>Un détail technique pour finir, j’essaye de progressivement m’extraire des produits Apple en commençant par les logiciels intégrés. J’utilise <a href="https://www.gentlemencoders.com/raw-power-for-macos/">RAW Power</a> depuis quelques mois, ça plante souvent mais j’ai l’impression de reprendre un peu le contrôle sur ma chaîne de développement et de pouvoir visualiser les fichiers sur lesquels je travaille dans l’explorateur. C’est déjà ça.</p>
  445. <figure>
  446. <a href="#heron-prairies"
  447. title="Cliquer pour une version haute résolution">
  448. <img src="/static/david/2021/heron-prairies.jpg" alt="Un héron dans la Rivière des Prairies."
  449. loading="lazy" width="2048" height="1366" />
  450. </a>
  451. <a href="#_" class="lightbox" id="heron-prairies">
  452. <img src="/static/david/2021/heron-prairies.jpg" alt="Un héron dans la Rivière des Prairies."
  453. loading="lazy" width="2048" height="1366" />
  454. </a>
  455. <figcaption>Like a rock.</figcaption>
  456. </figure>
  457. </details>
  458. <h2><a href="/david/2021/08/10/" title="Lien permanent vers cet article">HTTPSadness</a> (2021-08-10)</h2>
  459. <details>
  460. <summary>Déplier pour lire le contenu de la publication</summary>
  461. <blockquote lang="en">
  462. <p>At some point, you won’t be able to visit <a href="http://info.cern.ch/hypertext/WWW/TheProject.html">the first web page ever published</a> without first clicking through a full-page warning injected by your web browser</p>
  463. <p><cite><em><a href="https://adactio.com/links/18342">Chromium Blog: Increasing HTTPS adoption</a></em> (<a href="/david/cache/2021/b4ec4748a73b23b195366a74a17444f9/">cache</a>)</cite></p>
  464. </blockquote>
  465. <p>Cela me rend triste, alors qu’un effort particulier a toujours été fait pour <a href="https://github.com/styfle/breaking-changes-web">ne pas casser grand chose</a> sur le Web jusqu’à présent. Chrome est bien parti pour <a href="https://github.com/whatwg/html/issues/5407">nous les briser</a> pendant quelques années encore… #BeenThereSufferedThat</p>
  466. <p>Il y a 30&nbsp;ans (merci Karl), Tim nous incitait <a href="https://groups.google.com/g/comp.archives/c/CfsHlSNYPUI/m/DTs60INnuzcJ">à essayer</a> (<a href="/david/cache/2021/e4f0d4ea8f6ec975b114ade59aa7fda2/">cache</a>) son nouveau jouet&nbsp;:</p>
  467. <blockquote lang="en">
  468. <p>It’s just a question of generating plain text or SGML (ugh! but standard) mark-up on the fly. The browsers then parse it on the fly.</p>
  469. <p><cite><em><a href="https://www.w3.org/People/Berners-Lee/1991/08/art-6484.txt">Subject: Re: Qualifiers on Hypertext links...</a></em> (<a href="/david/cache/2021/e39a703ed0d93c479d9c7d3b2f8444a9/">cache</a>)</cite></p>
  470. </blockquote>
  471. <figure>
  472. <a href="#heron"
  473. title="Cliquer pour une version haute résolution">
  474. <img src="/static/david/2021/heron.jpg" alt="Un héron à la recherche de son futur repas au milieu des nénuphars."
  475. loading="lazy" width="1600" height="1067" />
  476. </a>
  477. <a href="#_" class="lightbox" id="heron">
  478. <img src="/static/david/2021/heron.jpg" alt="Un héron à la recherche de son futur repas au milieu des nénuphars."
  479. loading="lazy" width="1600" height="1067" />
  480. </a>
  481. <figcaption>Vous avez évité une n-ième photo de toile d’araignée.</figcaption>
  482. </figure>
  483. </details>
  484. <h2><a href="/david/2021/07/30/" title="Lien permanent vers cet article">Poignée</a> (2021-07-30)</h2>
  485. <details>
  486. <summary>Déplier pour lire le contenu de la publication</summary>
  487. <blockquote>
  488. <p>Un outil est une opportunité avec une poignée. — Kevin Kelly, traduction libre</p>
  489. </blockquote>
  490. <p>Je tombe sur cette citation aujourd’hui et je me demande si je suis un fabricant de poignées.</p>
  491. <p>La sagesse est de savoir résister à la tentation de concevoir des poignées pour toutes les portes.</p>
  492. <blockquote>
  493. <p>Tous les gouvernements sont affligés d’un grave problème chronique&nbsp;: Le pouvoir exerce une grande attraction sur les natures pathologiques. Ce n’est pas tant que le pouvoir corrompt, mais il fascine les sujets corruptibles. Ces gens ont tendance à s’enivrer de violence, ce qui crée rapidement les conditions d’une accoutumance fâcheuse.</p>
  494. <p><cite><em>Missionaria Protectiva, Texte QIV (dicto)</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> VI. La maison des mères</em>, Frank Herbert</cite></p>
  495. </blockquote>
  496. </details>
  497. <h2><a href="/david/2021/07/28/" title="Lien permanent vers cet article">CarbEAUne</a> (2021-07-28)</h2>
  498. <details>
  499. <summary>Déplier pour lire le contenu de la publication</summary>
  500. <blockquote>
  501. <p>L’hyper-focalisation sur le carbone et l’électricité cache efficacement les autres grands problèmes environnementaux. De tous ces problèmes, il me semble que <strong>la consommation d’eau du numérique peut devenir très problématique dans un futur proche et dans des zones très concentrés</strong>&nbsp;: les lieux d’extraction minière (approvisionnement en eau pour le nettoyage et la purification du minerai)&#8239;; la fabrication de circuits intégrés (eau ultra-pure, rinçage des wafers, etc.)&#8239;; le refroidissement des centres de données en zones désertiques (par évaporation d’eau)&#8239;; et la pollution des eaux (rejets miniers et industriels, décharges, etc.).</p>
  502. <p><cite><em><a href="https://gauthierroussilhe.com/post/paradoxes-enjeux.html">Paradoxes et enjeux environnementaux de la numérisation</a></em> (<a href="/david/cache/2021/8b4951ac1a12fd9431861f49af5886c8/">cache</a>)</cite></p>
  503. </blockquote>
  504. <p>Une excellente série de billets par Gauthier Roussilhe qui enchaîne avec&nbsp;:</p>
  505. <ul>
  506. <li><a href="https://gauthierroussilhe.com/post/limites-debat.html">Les limites pour débattre de numérisation</a> (<a href="/david/cache/2021/f442ffc39b7109ceebe8bc2a669589cb/">cache</a>)</li>
  507. <li><a href="https://gauthierroussilhe.com/post/ecoconception-critique.html">Eco-conception, le brouillard à venir</a> (<a href="/david/cache/2021/059ace3d9bcdbd911d83f1da84ced326/">cache</a>)</li>
  508. <li><a href="https://gauthierroussilhe.com/post/territoires-centres-de-donnees.html">Territorialiser les systèmes numériques, l’exemple des centres de données</a> (<a href="/david/cache/2021/618145b6b22de36fbbc1cd3162d41515/">cache</a>)</li>
  509. </ul>
  510. <p>Je suis particulièrement sensible à l’effort qui a été fait pour tenter de prendre en compte <em>l’ensemble</em> des coûts autour de ces sujets. Ainsi que l’impact sur le cycle de l’eau qui est localement redéfini par de telles industries.</p>
  511. <blockquote>
  512. <p>Les besoins en eau de certains acteurs du numérique pourraient se confronter avec le plus consommateur d’eau sur le globe&nbsp;: le secteur agricole. Plus précisément, <strong>certains acteurs du numérique pourraient rentrer en concurrence avec les acteurs agricoles pour pomper les eaux souterraines en zones de stress hydrique et pour la captation des eaux de surface (réservoirs, etc.).</strong> Par exemple, en avril 2021, le gouvernement taïwanais a demandé l’arrêt subventionné de l’irrigation de 74&#8239;000&nbsp;hectares de terres agricoles pour maintenir l’approvisionnement en eau d’usines de semi-conducteurs dans le nord de l’île. De plus, les rejets industriels d’usines de fabrication pourraient contaminer plus gravement des rivières et flux qui servent aux activités agricoles.</p>
  513. <p><cite><em>Ibid.</em></cite></p>
  514. </blockquote>
  515. <hr />
  516. <p>Et pendant ce temps-là au Québec, on parle d’un <q>traffic Internet plus vert</q> (<em>sic</em>), la route est longue&nbsp;:</p>
  517. <blockquote>
  518. <p>Hydro-Québec fait, elle aussi, partie de la solution. En incitant des centres de traitement de données à s’installer ici pour profiter de notre énergie propre, nous pouvons en effet contribuer à rendre le trafic Internet plus vert.</p>
  519. <p><cite><em><a href="https://www.hydroquebec.com/a/decarboner.html">Pollution numérique</a></em> (<a href="/david/cache/2021/75c2f55c5321a0afe4352f53da5e0b89/">cache</a>)</cite></p>
  520. </blockquote>
  521. </details>
  522. <h2><a href="/david/2021/07/25/" title="Lien permanent vers cet article">Dé·mont(r)age</a> (2021-07-25)</h2>
  523. <details>
  524. <summary>Déplier pour lire le contenu de la publication</summary>
  525. <p>J’ai passé les dernières 48&nbsp;heures à convertir, découper et colorer des fragments de vidéos. Suivant le <em>démon</em> de mes propres aspirations. S’assurer que le son soit cohérent parfois, pester contre l’auto-focus <a href="/david/2021/02/23/" title="Montage">encore une fois</a>, se rendre compte que certains réglages n’étaient pas adéquats, irrécupérables parfois. La <em>rage</em>.</p>
  526. <p>Et puis, il y a ce que l’on veut <em>montrer</em>. À quel point cette mise en scène est ridicule. Donner un sentiment de plénitude et d’apaisement alors que je suis en train de penser à ce chapelé de bits qui viennent remplir la carte mémoire. <em>Dé·montrer</em> aussi les instants où je coupe pour de vrai, où je nage pour moi, où je laisse le trépied dans un coin, où je suis ridicule (vous ne me verrez jamais m’extraire d’un raft&#8239;!). Je me rends compte qu’il faudrait que j’ai une idée préalable de scénario/script si je voulais vraiment partager une histoire. Or, c’est assez incompatible avec l’approche itérative et exploratoire de la forêt que je veux avoir.</p>
  527. <p><em>Démontage</em> enfin de mes peurs et de mes faiblesses vis-à-vis d’un medium que je ne maîtrise pas. Passer outre la tétanie, apprendre. Encore.</p>
  528. <blockquote>
  529. <p>En vous confinant dans un simple rôle d’observateur, vous passez systématiquement à côté du sens même de votre vie. L’idéal pourrait être ainsi défini&nbsp;: Vivez de votre mieux. <mark>La vie est un jeu</mark> dont les règles s’apprennent en y sautant à pieds joints pour être immergé jusqu’au cou sous peine d’être toujours pris au dépourvu, toujours surpris par le moindre changement de décor. Les spectateurs passifs se plaignent en gémissant que la chance est passée juste à côté d’eux. Ils refusent de voir qu’une bonne part de cette chance, c’est à eux qu’il revenait de la créer.</p>
  530. <p><cite><em>Darwi Odrade</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> VI. La maison des mères</em>, Frank Herbert</cite></p>
  531. </blockquote>
  532. </details>
  533. <h2><a href="/david/2021/07/22/" title="Lien permanent vers cet article">Vol d’eau</a> (2021-07-22)</h2>
  534. <details>
  535. <summary>Déplier pour lire le contenu de la publication</summary>
  536. <blockquote lang="en">
  537. <p>The drones don’t create rain themselves but help to jump-start rain production via cloud seeding. They “zap” the clouds with an electric charge, subsequently charging the droplets inside. Since the beginning of 2021, the National Center of Meteorology (NCM) has conducted 126&nbsp;instances of cloud seeding.</p>
  538. <p>“What we are trying to do is <mark>to make the droplets inside the clouds big enough so that when they fall</mark> out of the cloud, they survive down to the surface,” explained Keri Nicoll, one of the core investigators on the project.</p>
  539. <p>The technique has successfully created rain over Dubai and has even resulted in safety warnings for drivers over slippery roads.</p>
  540. <p><cite><em><a href="https://interestingengineering.com/the-uae-is-using-drones-to-control-dubais-weather">The UAE is Using Drones to Control Dubai’s Weather</a></em> (<a href="/david/cache/2021/1c411f71cef2f6a9d40cf09a62f71bb1/">cache</a>)</cite></p>
  541. </blockquote>
  542. <p>Suite de mes réflexions vis-à-vis de l’eau, des <a href="/david/2021/06/27/" title="Sécheresse">sécheresses</a> et de sa <a href="/david/2021/07/10/" title="Eau virtuelle">virtualité</a>. Ici, on arrive tout de même à une technologie qui permettrait à une localité de récupérer l’eau avant qu’elle arrive «&nbsp;naturellement&nbsp;» à un autre lieu. Ça augure de nouvelles tensions géo-politiques. C’est un peu équivalent aux conflits diplomatiques qui existent — dès à présent — avec des fleuves parcourant plusieurs états et des retenues/consommations d’eau en amont qui créent des sécheresses en aval.</p>
  543. <blockquote>
  544. <p>On ne manipule pas une marionnette avec un seul fil.</p>
  545. <p><cite><em>Le Fouet Zensunni</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> VI. La maison des mères</em>, Frank Herbert</cite></p>
  546. </blockquote>
  547. </details>
  548. <h2><a href="/david/2021/07/13/" title="Lien permanent vers cet article">ActivityStreams</a> (2021-07-13)</h2>
  549. <details>
  550. <summary>Déplier pour lire le contenu de la publication</summary>
  551. <p>On prend le temps avec <a href="https://buron.coffee/">La Bécasse</a> d’explorer ensemble l’idée d’avoir un générateur de Toots statique pour Mastodon. J’avais commencé en solo sans grand succès l’année dernière car je n’avais pas compris deux pré-requis&nbsp;:</p>
  552. <ol>
  553. <li>Ce protocole s’appuie sur du <em>push</em>, à chaque publication il faut faire un <code>POST</code> sur l’<em>inbox</em> de chacun de ses <em>followers</em>.</li>
  554. <li>Il faut pouvoir répondre aux requêtes des personnes qui souhaitent suivre le compte pour que le lien soit fait (et stocker l’identifiant de ce <em>follower</em>, cf. 1.).</li>
  555. </ol>
  556. <p>Autant dire que pour du statique et donc plus ou moins asynchrone, ça n’est pas gagné&#8239;! J’étais pas loin d’abandonner lorsque La Bécasse m’indique qu’il est tout à fait possible de générer une Note sur laquelle interagir (repouet par exemple) en utilisant la recherche de mastodon.social pointée vers le fichier <code>json</code> qui va bien. Après de multiples essais/erreurs (grr cache), on finit même par trouver comment mettre un autre compte en copie pour participer aux échanges qu’il peut y avoir au sujet d’une publication via le <code>tag</code> de <code>&quot;type&quot;: &quot;Mention&quot;</code>.</p>
  557. <p>J’hésite entre proposer une URL dédiée ou faire de la négociation de contenu sur la même URL ce qui pourrait faciliter le partage par d’autres personnes.</p>
  558. <p>Note&nbsp;: les 3&nbsp;jours suivants, je tente des choses à ce sujet et il semble y avoir toujours un blocage difficile à investiguer, probablement lié à la négociation de contenu justement… ça serait pas mal d’avoir un log mais ça nécessiterait probablement d’installer un serveur Mastodon.</p>
  559. <p>Masto 2 - 0&nbsp;David.</p>
  560. <blockquote>
  561. <p>Tel se présente l’univers impressionnant de la magie qu’il est constitué non pas d’atomes mais uniquement de mouvements et de vibrations. En son sein, il convient d’abandonner toute croyance aux barrières qui font obstacle à la compréhension. La notion de compréhension elle-même est à écarter, cet univers n’étant ni visible, ni audible, ni décelable par aucun moyen fixe de perception. C’est le vide ultime où aucun écran préalable n’existe sur lequel puissent être projetées des formes. Il ne connait qu’un seul mode de conscience et c’est l’écran de projection des images. L’imagination&#8239;! Ainsi, l’on apprend véritablement ce que signifie être humain, être un créateur d’ordre, de formes et de systèmes harmonieux, être, en somme, <mark>l’organisateur du chaos</mark>.</p>
  562. <p><cite><em>Manuel des Atréides, Archives du Bene Gesserit</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> V. Les Hérétiques de Dune</em>, Frank Herbert</cite></p>
  563. </blockquote>
  564. </details>
  565. <h2><a href="/david/2021/07/08/" title="Lien permanent vers cet article">Copilot</a> (2021-07-08)</h2>
  566. <details>
  567. <summary>Déplier pour lire le contenu de la publication</summary>
  568. <blockquote lang="en">
  569. <p>GitHub recently announced a tool called Copilot, a tool which uses machine learning to provide code suggestions, inciting no small degree of controversy. One particular facet of the ensuing discussion piques my curiosity: what happens if the model was trained using software licensed with the GNU General Public License?</p>
  570. <p><cite><em><a href="https://drewdevault.com/2021/07/04/Is-GitHub-a-derivative-work.html">Is GitHub a derivative work of GPL’d software?</a></em> (<a href="/david/cache/2021/0bb6418a58c977e7b142597213f6225d/">cache</a>)</cite></p>
  571. </blockquote>
  572. <p>Les <a href="https://mjtsai.com/blog/2021/07/07/github-copilot-and-copyright/">réactions ont été assez salées</a> (<a href="/david/cache/2021/05391381e6590e32184162110762aa62/">cache</a>) — et à juste titre&#8239;! — suite à cette annonce, et je ne parle même pas des <a href="https://fossbytes.com/github-copilot-generating-functional-api-keys/"><em>bugs</em> fâcheux</a> (<a href="/david/cache/2021/b7e5f13409115890c2478466f01369d8/">cache</a>) lors de cet apprentissage. Pour ma part, ça m’a fait glousser que Microsoft fasse du blanchiment de code sous GPL, mais c’est probablement car je commence à me faire vieux.</p>
  573. <p>Il y a tout de même une approche séduisante à imaginer une façon hybride de produire du code. J’y vois un parallèle avec les <a href="/david/2021/06/19/" title="Échecs">échecs</a> et le fait que ce soit la combinaison humain + machine qui devienne la plus puissante (passé un certain niveau permettant de comprendre les propositions de l’ordinateur, c’est une condition importante). Il n’y a probablement pas tout à jeter dans cette exploration, j’aimais bien aussi l’idée d’<a href="https://github.com/drathier/stack-overflow-import">importer directement depuis StackOverflow</a> sans même savoir ce qu’il y a dans la fonction. De <em>batteries included</em> à <em>copy-pasta included</em>, cela introduit une notion de confiance sociale et technique&nbsp;:-).</p>
  574. <p>Je n’en reste pas moins fidèle à <a href="https://www.sublimetext.com">SublimeText</a>, j’ai besoin d’un éditeur fonctionnel et rapide.</p>
  575. <blockquote>
  576. <p>À mon sens, les réformateurs ont causé plus de tort à eux seuls que n’importe quelle autre force dans toute l’histoire humaine. Montrez-moi quelqu’un qui déclare&nbsp;: «&nbsp;Tout cela doit être changé&nbsp;» et vous aurez devant vous une tête gonflée d’intentions pernicieuses qui n’ont aucun autre exutoire. Ce que nous devons au contraire nous efforcer de faire toujours, c’est découvrir les cours naturels des choses et nous y insérer sans heurt.</p>
  577. <p><cite><em>Révérende Mère Taraza, Extrait d’une convention</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> V. Les Hérétiques de Dune</em>, Frank Herbert</cite></p>
  578. </blockquote>
  579. </details>
  580. <h2><a href="/david/2021/06/24/" title="Lien permanent vers cet article">Long terme</a> (2021-06-24)</h2>
  581. <details>
  582. <summary>Déplier pour lire le contenu de la publication</summary>
  583. <blockquote lang="en">
  584. <p>Agile’s success at the expense of UX is just one manifestation of a deeper truth: Businesses want scaling. And foundational UX work doesn’t scale. It doesn’t lend itself to predictable, repeatable processes and generic cookie-cutter roles. It can’t, because by definition it deals with unknown, slippery, hard-to-define problems that characterize the leading edge of an organically evolving business.</p>
  585. <p>The same things that make agile a great fit for scaling engineering work—regular sprint tempos; clearly articulated outcomes to be produced; breaking down the complex, unfolding experience of users into concrete elements that can be tied to code—are the very things that make it a terrible fit for foundational UX work. <mark>The holism necessary to do foundational UX is antithetical to the assembly-line chunks of user behavior</mark> agile requires.</p>
  586. <p><cite><em><a href="https://www.fastcompany.com/90642462/i-helped-pioneer-ux-design-what-i-see-today-horrifies-me">I helped pioneer UX design. What I see today disturbs me</a></em> (<a href="/david/cache/2021/f5a7f2346b8c7317be12857b52321f52/">cache</a>)</cite></p>
  587. </blockquote>
  588. <p>Je ne vais pas me focaliser sur l’opposition agile/UX car il y a pas mal de façons de pratiquer ces deux domaines. C’est certain qu’il est malheureux d’avoir appelé ces itérations des <em>sprints</em> et qu’il faut réussir à avoir suffisamment de recul pour ne pas prendre ce terme au pied de la lettre (sinon ça finit par brûler).</p>
  589. <p><strong>Déterminer ensemble ce que l’on veut produire à long terme est très complexe pour une équipe.</strong> Le contexte change, les utilisateur·ices évoluent, l’équipe elle-même se renouvelle, dans cet espace mouvant il est difficile de conserver un semblant d’unité et de cohérence. Au moins vis-à-vis des interactions avec l’extérieur.</p>
  590. <p>On peut être tenté d’avoir recours à un <em>Design System</em> ou <a href="https://gouvfr.atlassian.net/wiki/spaces/DB/pages/736362561/Version+1.0.0">Système de Design</a> même si ce cadre arrive avec une lourdeur qui lui est propre. Ça peut donner l’impression de mettre une carrosserie sur une trottinette qui n’en nécessitait pas tant. C’est une réponse technique efficace (sans être performante) à une problématique qui a trait <a href="/david/2021/06/23/" title="FullStack">à l’humain et à l’empathie</a>.</p>
  591. <p>Comment combiner la tactique (faire à court terme) à la stratégie (penser à long terme) alors&#8239;? <strong>Sans technique</strong>, avec des <em>personnes</em> qui font le liant. Qui agrègent, qui reli(s)ent, qui partagent l’enthousiasme.</p>
  592. <p>Qui prennent soin. Qui donnent loin.</p>
  593. </details>
  594. <h2><a href="/david/2021/06/23/" title="Lien permanent vers cet article">FullStack</a> (2021-06-23)</h2>
  595. <details>
  596. <summary>Déplier pour lire le contenu de la publication</summary>
  597. <blockquote lang="en">
  598. <p>It’s almost like it’s a culture of masculinity stretching its legs wide across the seats of the tech industry.</p>
  599. <p>If a skill is worth masculinity points, it’s claimed. If a skill is coded as feminine it’s remade with masculine tools. If a skill can’t be remade it’s dropped and ignored.</p>
  600. <p>Which is why front end got turned into a programmatic hardcore engineering fest. It’s malleable to that (at huge cost to the users). <mark>It’s also why accessibility will never be considered full stack, as it can’t be automated.</mark> It requires empathy and communication.</p>
  601. <p>To feed the ego of a masculine webtech industry we sacrificed accessibility and usability.</p>
  602. <p><cite><em>Charlie Don’t Surf</em>, <a href="https://twitter.com/sonniesedge/status/1405099209913679872">sur Twitter</a></cite></p>
  603. </blockquote>
  604. <p>On touche un point sensible ici, celui de l’automatisation pour pallier ses propres faiblesses de communication. C’est ce que j’observe assez régulièrement avec ma boîte noire favorite&nbsp;:</p>
  605. <p>Docker. <a href="https://blog.newsblur.com/2021/06/28/story-of-a-hacking/">Oups</a> (<a href="/david/cache/2021/5b96c01bfd8b66a26135b7ce8bdff79d/">cache</a>).</p>
  606. <p>Derrière cette tentative de reproductibilité, on masque un processus d’installation et surtout une remise en cause des dépendances. On perd l’occasion d’avoir la friction (répétée) qui va générer cette discussion. On prolétarise les personnes non-érudites à coups de <code>docker-compose up</code> en cachant une technique qui serait la voie vers leur autonomie. On contraint les utilisateur·ices <a href="/david/2021/06/06/" title="Abonnement">à s’abonner</a> à nos se(r)vices.</p>
  607. <p>Ce ne sont pas nos produits que l’on met en boîte mais nos pairs que l’on enferme dans cette façon de (dé)penser pour le confort de quelques uns. Ce domaine a besoin <a href="/david/2021/05/11/" title="Paradigme">de voiliers</a>, pas de cargos.</p>
  608. <blockquote lang="en">
  609. <p>💯 To claim full stack as a title is to declare that you are a replaceable unit in the cog of capitalism. The ultimate human resource to be exploited!</p>
  610. <p><cite><em>Charlie Don’t Surf</em>, <a href="https://twitter.com/sonniesedge/status/1405123679801991175">sur Twitter</a></cite></p>
  611. </blockquote>
  612. <p><a href="/david/2021/03/28/" title="Smolstack">Yup.</a></p>
  613. </details>
  614. <h2><a href="/david/2021/06/17/" title="Lien permanent vers cet article">API statique</a> (2021-06-17)</h2>
  615. <details>
  616. <summary>Déplier pour lire le contenu de la publication</summary>
  617. <p>Discussion avec les <a href="https://github.com/pyrates/">pyrates</a> au sujet de blogs, d’articles, d’API et de minimalisme. J’imagine qu’un générateur d’API statique est possible, on est plutôt habitué·es à produire du HTML (qui est lui-même un format d’échange possible) mais on pourrait tout aussi bien générer un <a href="https://jsonfeed.org/">flux en JSON</a> ou tout autres petits fichiers statiques pré-générés.</p>
  618. <p>La dernière fois que j’ai essayé c’était pour tenter de créer un flux mastodon de manière statique ici-même mais la barre était trop haute pour ma maigre connaissance de cette combinaison de protocoles. Surtout que je n’avais pas vraiment d’autre intérêt que l’exploit technique en lui-même.</p>
  619. <p>Il faudrait que je maintienne une page de tout ce que je n’ai pas réussi à faire pour compenser des <a href="/david/2021/05/28/" title="Curriculum chain">chaînes</a> plus reluisantes. Pour équilibrer. J’imagine que ça en dirait encore davantage sur mes compétences et ma capacité à me laisser échouer sur une page (web).</p>
  620. <p>Et pendant ce temps là 🤩&nbsp;:</p>
  621. <blockquote lang="en">
  622. <p>They are little challenges I give myself, usually without too many stakes involved, and with small enough a scope so that I can ship it in a day or two, while keeping spare family time.</p>
  623. <p><cite><em><a href="https://francoisbest.com/posts/2021/hashvatars">Representing SHA-256&nbsp;Hashes As Avatars</a></em> (<a href="/david/cache/2021/be7ca5728939adfc50b9eef6818d6f63/">cache</a>)</cite></p>
  624. </blockquote>
  625. </details>
  626. <h2><a href="/david/2021/06/03/" title="Lien permanent vers cet article">Flux lisibles</a> (2021-06-03)</h2>
  627. <details>
  628. <summary>Déplier pour lire le contenu de la publication</summary>
  629. <blockquote lang="en">
  630. <p>Use web feeds to <strong>subscribe</strong> to websites and get the <strong>latest content in one place</strong>.</p>
  631. <p><strong>Feeds put you in control.</strong> It’s like subscribing to a podcast, or following a company on Facebook. You don’t need to pay or hand over your email address. You get the latest content without having to visit lots of sites, and without cluttering up your inbox. Had enough? Easy: unsubscribe from the feed.</p>
  632. <p>You just need a special app called a <strong>newsreader</strong>.</p>
  633. <p><cite><em><a href="https://aboutfeeds.com/">What is a feed? (a.k.a. RSS)</a></em> (<a href="/david/cache/2021/0086cb1d562c02cd96f9f2a38e5bcc42/">cache</a>)</cite></p>
  634. </blockquote>
  635. <p>Cela faisait un moment que je voulais expérimenter des choses à ce sujet. Et puis j’avais vu passer le rendu des flux de <a href="https://adactio.com/journal/rss">Jeremy Keith</a> ou <a href="https://interconnected.org/home/feed">Matt Webb</a> que je trouvais inspirants mais j’avais l’impression que c’était compliqué à mettre en place. Alors que le travail avait en fait été <a href="https://lepture.com/en/2019/rss-style-with-xsl">pas mal pré-mâché&#8239;!</a> (<a href="/david/cache/2021/40d98edeb7835abd7f9d4c1917e3ea5c/">cache</a>) Le rendu par défaut dans Firefox ressemblait à ça&nbsp;:</p>
  636. <figure>
  637. <a href="#rendu_flux_defaut"
  638. title="Cliquer pour une version haute résolution">
  639. <img src="/static/david/2021/rendu_flux_defaut.png" alt="Rendu par défaut d’un flux RSS dans Firefox"
  640. loading="lazy" width="1676" height="1444" />
  641. </a>
  642. <a href="#_" class="lightbox" id="rendu_flux_defaut">
  643. <img src="/static/david/2021/rendu_flux_defaut.png" alt="Rendu par défaut d’un flux RSS dans Firefox"
  644. loading="lazy" width="1676" height="1444" />
  645. </a>
  646. <figcaption>Non seulement c’est pas joli mais surtout c’est incompréhensible aux non-technicien·nes !</figcaption>
  647. </figure>
  648. <p>La feuille <abbr title="Extensible Stylesheet Language">XSL</abbr> de base est commentée et <a href="https://github.com/genmon/aboutfeeds/blob/main/tools/pretty-feed-v3.xsl">disponible ici</a>. L’exercice le plus difficile est d’adapter les valeurs pour que ça corresponde à votre flux, j’ai aussi enlevé la CSS par défaut pour mettre la mienne en ayant l’intuition que ça permettrait de maintenir une certaine cohérence avec la page d’où la personne vient. J’ai aussi fait en sorte d’utiliser la <a href="/david/2021/05/26/" title="Follow">notion de suivi</a> d’un flux/individu.</p>
  649. <p>Mon code <a href="https://git.larlet.fr/davidbgk/larlet-fr-david/src/branch/master/david/log/feed.xsl">ressemble à ça</a> et permet d’obtenir le <a href="/david/log/">rendu suivant</a>&nbsp;:</p>
  650. <figure>
  651. <a href="#rendu_flux_style"
  652. title="Cliquer pour une version haute résolution">
  653. <img src="/static/david/2021/rendu_flux_style.png" alt="Rendu après transformation de mon flux RSS dans Firefox"
  654. loading="lazy" width="1668" height="1642" />
  655. </a>
  656. <a href="#_" class="lightbox" id="rendu_flux_style">
  657. <img src="/static/david/2021/rendu_flux_style.png" alt="Rendu après transformation de mon flux RSS dans Firefox"
  658. loading="lazy" width="1668" height="1642" />
  659. </a>
  660. <figcaption>Et voilà ! C’est quand même bien plus stylé 😎</figcaption>
  661. </figure>
  662. <p>J’ai une petite frustration que Firefox ne supporte pas la propriété <code>disable-output-escaping=&quot;yes&quot;</code> ce qui ne me permet pas d’avoir un rendu HTML satisfaisant lorsqu’on déplie les entrées (le plus frustrant étant que c’est implémenté chez Webkit…). J’imagine que je pourrais changer le format de mon flux pour ne pas avoir à faire cette conversion, par exemple avec du <code>CDATA</code>, à creuser.</p>
  663. <p>Il s’agit bien évidemment d’une première version et je vous encourage à me faire part de vos incompréhensions ou propositions d’amélioration pour le texte d’introduction. Je suis déjà bien content d’avoir pu mettre ça en place, c’est une frustration que je me traîne depuis… plus de 15&nbsp;ans&#8239;!</p>
  664. </details>
  665. <h2><a href="/david/2021/05/13/" title="Lien permanent vers cet article">Obsolescence chiffrée</a> (2021-05-13)</h2>
  666. <details>
  667. <summary>Déplier pour lire le contenu de la publication</summary>
  668. <blockquote lang="en">
  669. <p>On September 30, there will be a change in how older browsers and devices trust Let’s Encrypt certificates, resulting in a <mark>minor decrease</mark> in compatibility. -- The Let’s Encrypt team</p>
  670. <p><cite>Un courriel adressé à toutes les personnes ayant généré des certificats Let’s Encrypt (incluant indirectement cet espace)</cite></p>
  671. </blockquote>
  672. <p>C’est un bon rappel que <a href="https://letsencrypt.org/docs/dst-root-ca-x3-expiration-september-2021/">HTTPS crée de l’obsolescence</a> (<a href="/david/cache/2021/372cdbf3dc67c7796673bec4aaeb9f0f/">cache</a>) en ne supportant plus des périphériques plus anciens (au même titre qu’un système d’exploitation par exemple). La durée acceptable semble être de 10&nbsp;ans dans le cas du compromis qui a été fait. Les personnes détentrices (<a href="https://letsencrypt.org/docs/certificate-compatibility/">entre beaucoup d’autres</a>) d’un iPhone 4&nbsp;ne pourront plus accéder à cet espace — et des millions d’autres — d’ici la fin de l’année et ça me rend triste.</p>
  673. <p>Voir les <a href="/david/stream/2018/01/06/">épisodes</a> <a href="/david/stream/2018/01/10/">précédents</a> au <a href="/david/stream/2018/01/24/">sujet de HTTPS</a>.</p>
  674. </details>
  675. <h2><a href="/david/2021/05/05/" title="Lien permanent vers cet article">Accessibilité</a> (2021-05-05)</h2>
  676. <details>
  677. <summary>Déplier pour lire le contenu de la publication</summary>
  678. <p>Aujourd’hui, on a reçu le rapport d’un audit d’accessibilité. Cela fait maintenant <a href="/david/2020/05/26/">un an</a> que nous travaillons sur <a href="https://mesconseilscovid.sante.gouv.fr/">MesConseilsCovid</a> et c’est intéressant d’avoir des <a href="https://access42.net/?lang=fr">personnes tierces et expertes</a> qui viennent analyser tout cela avec un peu de recul. Je pensais que l’on n’était pas trop mauvais·es et nous étions en fait <a href="https://github.com/Delegation-numerique-en-sante/mesconseilscovid/labels/rgaa">assez loin</a> du compte&#8239;! Une belle leçon d’humilité, même en pensant faire attention à ces aspects.</p>
  679. <p>La difficulté — une fois les erreurs corrigées à l’instant <code>t</code> — est de rester accessibles à l’instant <code>t + 1</code>.</p>
  680. </details>
  681. <h2><a href="/david/2021/04/19/" title="Lien permanent vers cet article">Conversions</a> (2021-04-19)</h2>
  682. <details>
  683. <summary>Déplier pour lire le contenu de la publication</summary>
  684. <p>Lorsque je capte les vidéos lors d’une sortie en forêt, je sélectionne le format <code>MOV</code> en <code>C4K/10bit/150M/24p</code> ce qui signifie une résolution de 4096x2160&nbsp;pixels à 23,98&#8239;images par seconde (150&nbsp;Mpbs de bit rate) en <code>4:2:2/10 bit</code> avec compression <code>Long GOP</code>. Beaucoup de jargon pour dire que j’essaye de capter l’une des meilleures qualités proposées par le capteur. Je pourrais aller encore plus haut mais ça me consommerait 400&#8239;Mo par seconde sur la carte et pour une carte de 128&#8239;Go je passe de 1&#8239;h 48&#8239;min de captation disponible à seulement 41&#8239;min en choisissant ce format.</p>
  685. <p>Lors de ma ballade, je suis revenu avec 1&#8239;h 45&#8239;min de prises de vue pour un total de 124&#8239;Go. Or, je suis obligé de les convertir en un format moins compressé pour pouvoir procéder au montage avec DaVinci Resolve, j’utilise la commande suivante pour les convertir en <code>ProRes</code>&nbsp;:</p>
  686. <pre><code>for f in *.MOV; do ffmpeg -i &quot;$f&quot; -c:v prores -profile:v 3 -c:a pcm_s16le &quot;../prores/${f%.*}.mov&quot;; done
  687. </code></pre>
  688. <p>Cela signifie que je prends tous les fichiers avec l’extension <code>.MOV</code> dans le répertoire en cours et que je les convertis dans un dossier <code>prores</code> un cran plus haut en gardant le nom du fichier. Cette opération m’a pris 3&#8239;h 30&#8239;min avec 4&nbsp;cœurs i7&nbsp;à 2,3&#8239;GHz&nbsp;: le résultat de la conversion fait l’astronomique 903&#8239;Go&#8239;!</p>
  689. <p>Autant dire que j’ai dû faire ça sur un disque externe, ce qui me contraint une fois dans DaVinci Resolve à utiliser des média sous forme de proxy (cache local) qui sont en moindre qualité mais qui font en sorte que l’ordinateur ne souffle (ni souffre) pas trop pendant le montage. Ça aussi, ça prend un temps/CPU non négligeable…</p>
  690. <p>Tout ça pour dire qu’<em>avant même</em> d’agencer deux morceaux de vidéos j’ai déjà consommé une énergie assez considérable. Le plus frustrant étant que Vimeo me fasse parfois une bouillie de pixels, quand ça n’est pas juste à l’export car je ne maîtrise pas encore très bien ce qu’il se passe dans cette boîte noire.</p>
  691. <p>Bon, au moins j’apprends des trucs 🤷.</p>
  692. </details>
  693. <h2><a href="/david/2021/04/15/" title="Lien permanent vers cet article">Dark mode</a> (2021-04-15)</h2>
  694. <details>
  695. <summary>Déplier pour lire le contenu de la publication</summary>
  696. <blockquote>
  697. <p>Je suis le cas typique du client qui a besoin obligatoirement d’un <em>light mode</em>, sans quoi je n’utilise plus l’application et/ou <mark>je ne consulte plus le site</mark> (c’est déjà arrivé, j’ai désinstallé l’application et fermé l’onglet de mon navigateur). Dans mon cas, le <em>dark mode</em>, contrairement à ce que dit [le document dont parlaient mes collègues], augmente très fortement ma fatigue oculaire. Au bout de trois lignes j’ai la rétine imprimée, des lignes qui flottent devant les yeux, c’est très désagréable.</p>
  698. <p><cite><em><a href="https://nota-bene.org/Dark-mode-et-accessibilite">Dark mode et accessibilité</a></em> (<a href="/david/cache/2021/544ecea9397616a9f4cfcc6fe27afc3d/">cache</a>)</cite></p>
  699. </blockquote>
  700. <p>C’est la raison pour laquelle — même après avoir <a href="/david/2020/06/25/#paillasse">cédé à la mode du foncé</a> — je laisse la personne qui consulte cet espace choisir. Utiliser les préférences du système (<code>prefers-color-scheme</code>) me semble être insuffisant. Certain·es préfèrent un thème sombre sans pour autant vouloir lire du clair sur foncé, d’autres ne savent pas comment changer le thème au niveau du système.</p>
  701. <p>Pour les astigmates (au moins certain·es en tout cas), ça semble être problématique tout ce qui est clair sur trop sombre, surtout la nuit. Et je crois que c’est un pourcentage non négligeable des internautes…</p>
  702. <hr />
  703. <p>Quelques jours plus tard, je tombe sur&nbsp;:</p>
  704. <blockquote lang="en">
  705. <p>People with astigmatism (approximately <mark>50% of the population</mark>) find it harder to read white text on black than black text on white. Part of this has to do with light levels: with a bright display (white background) the iris closes a bit more, decreasing the effect of the “deformed” lens; with a dark display (black background) the iris opens to receive more light and the deformation of the lens creates a much fuzzier focus at the eye.</p>
  706. <p><cite><em><a href="https://tatham.blog/2008/10/13/why-light-text-on-dark-background-is-a-bad-idea/">Why light text on dark background is a bad idea</a></em> (<a href="/david/cache/2021/9f3a8d345963dac24bef4df547fef72c/">cache</a>)</cite></p>
  707. </blockquote>
  708. </details>
  709. <h2><a href="/david/2021/04/05/" title="Lien permanent vers cet article">Honte</a> (2021-04-05)</h2>
  710. <details>
  711. <summary>Déplier pour lire le contenu de la publication</summary>
  712. <blockquote>
  713. <p>D’autre part, lorsque j’ai commencé, je n’avais aucune formation de développeur&nbsp;: Je me suis formé sur le tas, et je n’étais de toute façon pas suffisamment assuré de mon code pour le mettre en licence libre (<mark>j’aurai trop honte qu’un vrai développeur vienne regarder le code de mes premières productions&#8239;!</mark>). Je suis enseignant, pas développeur&#8239;!</p>
  714. <p><cite><em><a href="https://blog.faire-ecole.org/2021/04/05/jenseigne-je-code-et-je-partage-ep-02-christophe-auclair/">J’enseigne, je code et je partage - EP 02&nbsp;: Christophe Auclair</a></em> (<a href="/david/cache/2021/d51a0d0c661dbc22417ff5d0266f3faa/">cache</a>)</cite></p>
  715. </blockquote>
  716. <p>Cette remarque m’attriste car je sais qu’elle n’est pas isolée. Même parmi les développeur·euses, il y a cette crainte que le code publié soit analysé et serve à établir un certain jugement sur la personne.</p>
  717. <p>Je vais vous faire une confession&nbsp;: je publie du code depuis des dizaines d’années et il est loin d’être propre, ni même parfois présentable selon les standards en vigueur. Mon premier constat, c’est que pas grand monde ne prend le temps d’aller voir ce que vous avez partagé (et/ou de vous notifier). Même dans le cadre d’un <a href="/david/2021/03/23/" title="Recrutement">recrutement</a>, j’ai l’intuition qu’aucune des personnes avec lesquelles j’ai interagi n’a consulté la moindre ligne de code, que ce soit sur Github ou ailleurs.</p>
  718. <p>C’est pourtant une source d’information intéressante, pas pour le code produit en lui-même mais pour la façon dont il est produit et la nature des interactions qu’il occasionne. Pour savoir si je peux travailler avec un·e pair, j’ai davantage besoin de voir ses commentaires récents lors d’une <em>pull/merge-request</em> que ses dernières 10&#8239;000&nbsp;lignes de code…</p>
  719. <p>Cela étant exprimé, je considère que publier du code (sans la façon de travailler qui va avec) s’apparente à la publication d’idées sur cet espace. Des petits cailloux <a href="/david/2021/03/26/" title="Stimulant">stimulants</a> pour aider d’autres à bâtir — et éventuellement partager — d’autres choses. Et à ce niveau, vous ne <a href="https://gist.github.com/davidbgk/b10113c3779b8388e96e6d0c44e03a74">savez jamais</a> quelle ligne va potentiellement être une aide pour un contexte donné. Vous ne savez même pas si plus il y a de lignes plus la personne a des chances de rencontrer la bonne.</p>
  720. <p>Le partage n’est qu’un espoir… mais quel espoir&#8239;!</p>
  721. </details>
  722. <h2><a href="/david/2021/03/28/" title="Lien permanent vers cet article">Smolstack</a> (2021-03-28)</h2>
  723. <details>
  724. <summary>Déplier pour lire le contenu de la publication</summary>
  725. <blockquote lang="en">
  726. <p>The “smol” net is the “small” net. It’s small because it is build for friends and friends of friends. It doesn’t have to scale to millions of people because those millions should build their own local small nets.</p>
  727. <p><cite><em><a href="https://communitywiki.org/wiki/SmolNet">CommunityWiki: Smol Net</a></em> (<a href="/david/cache/2021/cd910565715dbc18d4b31ad60546a4a3/">cache</a>)</cite></p>
  728. </blockquote>
  729. <p>On me demandait <a href="/david/2021/03/23/" title="Recrutement">récemment</a> si je me considérais comme étant un développeur <em>fullstack</em>. Avec le recul, cette question m’a permis d’affiner ce que j’entends par ce terme et pourquoi je ne veux pas l’être. Je me suis aussi <a href="/david/blog/2017/web-developer/">replongé</a> dans mes <a href="/david/blog/2016/inclusive-developer/">archives</a> car le sujet n’est pas nouveau mais j’ai besoin de le revisiter régulièrement.</p>
  730. <p>Ce que l’on entend traditionnellement par le terme <em>fullstack</em> me semble aller de l’orchestration de containers (incluant sécurité, disponibilité, redondance, etc.) à l’interface utilisateur·ice et à son expérience que l’on espère la plus pertinente possible (incluant l’accessibilité, les performances, etc.) en passant par le <em>backend</em> et le <em>frontend</em> qui apportent leur lot de connaissances à maîtriser et maintenir à jour. Mais ce n’est pas tant le périmètre en lui-même que l’appétence que l’on peut avoir pour l’ensemble de ce spectre qui est une attente qui <em>m</em>’est irréaliste.</p>
  731. <p>Je vais maintenant essayer de définir ce que j’entends par <em>smolstack</em>, c’est brouillon et je vais probablement avoir besoin de plusieurs itérations&nbsp;:</p>
  732. <ul>
  733. <li>vérifier la pertinence des fonctionnalités avec des tests utilisateur·ices&#8239;;</li>
  734. <li>réduire les dépendances au maximum et être guidé par le besoin plus que par la tendance actuelle&#8239;;</li>
  735. <li>prendre le temps de faire le ménage à tous les niveaux&nbsp;: nouvelles attentes, évolution de dépendance, retrait de fonctionnalités, etc.&#8239;;</li>
  736. <li>faire en sorte que les données soient accessibles au plus grand nombre (je vais avoir besoin de préciser ce point)&#8239;;</li>
  737. <li>privilégier le statique tant que c’est possible, il n’y a rien qui soit plus performant et polyvalent&#8239;;</li>
  738. <li>arbitrer la <a href="/david/blog/2017/bugs-complexite/">complexité</a> vis-à-vis de l’impact que cela va avoir sur les utilisateur·ices mais aussi la maintenance, la fiabilité et la légèreté du produit&#8239;;</li>
  739. <li>documenter les choix techniques ainsi que les joies/échecs associés (journal d’équipe&#8239;?)&#8239;;</li>
  740. <li>envisager l’essaimage plutôt que le passage à l’échelle.</li>
  741. </ul>
  742. <p>Je vais m’arrêter là pour ce soir, je n’ai pas l’ambition d’en faire un manifeste, ni la prétention d’en faire un terme consacré. Je le vois plus comme une ébauche <a href="/david/2021/03/26/" title="Stimulant">inspirante et vivante</a>. C’est incomplet à dessein. Et ce sera obsolète dès demain.</p>
  743. <p><em>Keep smoling!</em> 😀</p>
  744. <blockquote lang="en">
  745. <p>That last bit is a bit of a concern as ageism is already strong enough in web development for 30&nbsp;to be considered old. <mark>The last thing I want is to be labelled a conservative old fogey in an industry dominated by novelty-seeking.</mark> Mostly because it really isn’t accurate. I really <em>do</em> enjoy some of the new developments in the field. So much so that I constantly have to fight the urge to start building projects using the latest bit of shiny.</p>
  746. <p><cite><em><a href="https://www.baldurbjarnason.com/2021/which-kind-of-web-developer-are-you/">Which type of novelty-seeking web developer are you?</a></em> (<a href="/david/cache/2021/809290eb60d9bda55b427919091533f0/">cache</a>)</cite></p>
  747. </blockquote>
  748. </details>
  749. <h2><a href="/david/2021/03/15/" title="Lien permanent vers cet article">Partage</a> (2021-03-15)</h2>
  750. <details>
  751. <summary>Déplier pour lire le contenu de la publication</summary>
  752. <blockquote lang="en">
  753. <p>80&nbsp;emojis in, forking over money for a goat emoji domain name, you <mark>seriously</mark> start to question what you’re doing.</p>
  754. <p>$1200&nbsp;later, 150&nbsp;emoji domains were mine.</p>
  755. <p><cite><em><a href="https://tinyprojects.dev/projects/mailoji">I bought 300&nbsp;emoji domain names from Kazakhstan and built an email service</a></em> (<a href="/david/cache/2021/45af171610f986077420b27c2da46ec1/">cache</a>)</cite></p>
  756. </blockquote>
  757. <p>J’aime lorsque des inconnu·es partagent leurs brins de folie.</p>
  758. </details>
  759. <h2><a href="/david/2021/03/13/" title="Lien permanent vers cet article">In·dépendance</a> (2021-03-13)</h2>
  760. <details>
  761. <summary>Déplier pour lire le contenu de la publication</summary>
  762. <blockquote lang="en">
  763. <p>I read a lot of other people’s code. I highly recommend it. One of my golden rules is that you shouldn’t blackbox things you don’t need to. I like to <mark>“use dependencies for efficiency, not ignorance.”</mark></p>
  764. <p>When I’m vendoring code - copying it into the project and making it pass my basic eslint &amp; testing standards, I’ll do light rewrites and refactors of new code, allowing me to get a deeper understanding of how they work and where their limits lie.</p>
  765. <p>[…]</p>
  766. <p>And sometimes, sure - I’ll read through a dependency, start refactoring, and realize that it’s going to be simpler to write it myself, or I should find another option. It doesn’t matter if something is a dependency or my code: when you ship a product, it’s all your responsibility.</p>
  767. <p><cite><em><a href="https://macwright.com/2021/03/11/vendor-by-default.html">Vendor by default</a></em> (<a href="/david/cache/2021/4b81d4d9d89fb1d417aa292463529271/">cache</a>)</cite></p>
  768. </blockquote>
  769. <p>C’est l’une des raisons pour lesquelles j’essaye d’aller le plus loin possible avec un produit sans avoir de système de dépendances JS autre que la récupération du <em>build</em> qui est présent sur le dépôt source (s’il n’y en a pas, tant pis…). Le fait de copier manuellement ce fichier sur mon propre dépôt donne du poids à la dépendance, ce n’est pas une simple ligne dans un fichier. Un effet de bord que j’apprécie beaucoup aussi est de pouvoir identifier et corriger les <em>bugs</em> localement plus facilement.</p>
  770. <p>Cela me rappelle les pistes que <a href="/david/blog/2016/simplicite-defaut/">j’explorais déjà il y a 5&nbsp;ans</a>, notamment la partie sur les budgets.</p>
  771. </details>
  772. <h2><a href="/david/2021/03/04/" title="Lien permanent vers cet article">HTML-over-WebSockets</a> (2021-03-04)</h2>
  773. <details>
  774. <summary>Déplier pour lire le contenu de la publication</summary>
  775. <blockquote lang="en">
  776. <p>But this wasn’t terribly easy for many developers to grok at first. I sure didn’t. And the benefits weren’t exactly clear either. After years (decades, even) of wrapping our heads around the HTTP request cycle, to which all server-handled features must conform, <mark>adopting this WebSocket tech layer required a lot of head scratching</mark>. As with many clever new technologies or protocols, we needed a higher-level abstraction that provided something really effective for getting a new feature in front of a user, fast.</p>
  777. <p><cite><em><a href="https://alistapart.com/article/the-future-of-web-software-is-html-over-websockets/">The Future of Web Software Is HTML-over-WebSockets</a></em> (<a href="/david/cache/2021/a722bf15647dfe923d3c28b2e229098c/">cache</a>)</cite></p>
  778. </blockquote>
  779. <p>En ce moment, ça me gratte justement bien la tête. Je me retrouve <a href="https://benhoyt.com/writings/the-small-web-is-beautiful/">davantage dans cette approche</a> (<a href="/david/cache/2021/862d065d924906f327f8a95e23659295/">cache</a>) et j’ai presque du plaisir à utiliser <a href="https://stimulus.hotwire.dev/">Stimulus</a>, ça semble être le niveau de structuration et de non-abstraction dont j’ai besoin. J’ai aussi essayé <a href="https://turbo.hotwire.dev/">Turbo</a> (Frames) mais je n’ai pas été assez loin pour voir les avantages décrits dans l’article (et c’est trop jeune pour mon niveau de confiance)&nbsp;: j’ai fini par recoder juste ce qu’il me fallait avec Stimulus.</p>
  780. <p>J’apprécie le fait que ces ré-explorations donnent lieux à de nouvelles initiatives comme <a href="https://www.django-unicorn.com/">Django-Unicorn</a> ou <a href="https://sockpuppet.argpar.se/">Sockpuppet</a> pour ne citer que les déclinaisons dans l’écosystème Django. J’ai l’impression que c’est le compromis acceptable pour le vieux développeur que je suis&nbsp;: de la réactivité au niveau de l’interface pour les utilisateur·ices, de la logique et de la stabilité côté développement pour ma sénilité d’esprit.</p>
  781. <p>Attention si vous partez sur des WebSockets, j’ai <a href="https://httptoolkit.tech/blog/http-wtf/">récemment appris</a> (<a href="/david/cache/2021/cbd2101777421fa7549472859210a69c/">cache</a>) que les restrictions de type <abbr title="Cross-Origin Resource Sharing">CORS</abbr> ne sont pas du tout respectées.</p>
  782. <p>Note&nbsp;: je suis surpris qu’il n’y ait pas encore un projet intitulé <strong>RESTream</strong> dans le domaine 🙃🚎.</p>
  783. </details>
  784. <h2><a href="/david/2021/03/01/" title="Lien permanent vers cet article">Responsabilité</a> (2021-03-01)</h2>
  785. <details>
  786. <summary>Déplier pour lire le contenu de la publication</summary>
  787. <blockquote>
  788. <p><em>La technique rend les hommes irresponsables.</em> Les manifestations principales du développement de la technique sont le gigantisme, la concentration et l’abstraction. Cet état de fait aboutit à une dispersion des effets de l’action&nbsp;: <mark>à l’ère technique, l’identification et la responsabilité des acteurs est devenue problématique</mark>, voire impossible&nbsp;: «&nbsp;Dans une telle société, le type de l’homme agissant consciemment disparaît.&nbsp;» L’action morale est donc impossible puisque l’homme ne peut pas se représenter les effets de son action.</p>
  789. <p>[…]</p>
  790. <p>Une des idées fondamentales de Charbonneau et d’Ellul est de mettre radicalement en question <em>l’idée de la neutralité de la technique</em>&nbsp;: plus qu’un progrès, elle engendre le développement de la puissance. Loin de permettre l’émancipation, la puissance engendre des déséquilibres et devient incontrôlable, car elle appelle nécessairement la concentration et le gigantisme.</p>
  791. <p><cite><em>Nous sommes des révolutionnaires malgré nous</em>, Bernard Charbonneau, Jacques Ellul, introduction de Quentin Hardy</cite></p>
  792. </blockquote>
  793. <p>Plus j’explore la vie et les écrits de ces deux personnes et plus je me rends compte qu’il est possible d’anticiper l’évolution technique. Ce qui est plus difficile c’est d’identifier les moments de rupture, ces instants où il y a la formation d’un contre-pouvoir de la part des humains, un contre-<strong>vouloir</strong> lorsque les soupapes ne suffisent plus. Peut-être que l’on s’en approche, j’ai l’intuition que ces retours de flammes peuvent être relativement brutaux. Peut-être que l’on en est encore très loin car la technique procure un confort incroyable aux oppresseurs.</p>
  794. <p>C’est même peut-être sa véritable définition…</p>
  795. </details>
  796. <h2><a href="/david/2021/02/19/" title="Lien permanent vers cet article">Optimisation</a> (2021-02-19)</h2>
  797. <details>
  798. <summary>Déplier pour lire le contenu de la publication</summary>
  799. <blockquote lang="en">
  800. <p>But when you increase complexity in order to optimise, demand never really goes down. The optimisation becomes an opportunity to do more, and so the complexity gets locked in – there will never be the chance to remove it.</p>
  801. <p>And that compounding complexity, layers upon layers of it, a nest of interlocking feedback loops, <mark>increases the risk of fatal, emergent complexity quakes</mark>.</p>
  802. <p>All of which colours my approach to everything from how I architect my code, to how I organise my finances, to what government policies I like.</p>
  803. <p><cite><em><a href="http://interconnected.org/home/2021/02/12/optimisation">Anxious feelings about optimisation through complexity</a></em> (<a href="/david/cache/2021/eef2b3e3085a9b71cd7fe64f21fa0453/">cache</a>)</cite></p>
  804. </blockquote>
  805. <p>Je réfléchis beaucoup à ces choses là en ce moment. Sur le fait d’ouvrir des portes que l’on ne peut plus refermer ensuite. Chaque porte étant en fait sur un palier qui demande aux autres de passer une marche de plus, ce qui n’est pas forcément dans les moyens de la majorité.</p>
  806. <p>Sur un de mes produits actuels, je me suis rendu compte aujourd’hui qu’en le rendant plus «&nbsp;propre&nbsp;» je l’ai aussi rendu moins convivial (au sens d’Illich) pour les personnes qui vont devoir le reprendre. Les concepts utilisés sont un peu plus complexes, les versions un peu plus modernes, autant de marches qui m’ont semblées petites mais qui mises bout à bout rendent le produit moins accessible.</p>
  807. <p>À méditer… ne plus oublier le 10<sup>e</sup> principe&nbsp;:</p>
  808. <blockquote lang="en">
  809. <p>Design mediates so much of our realities and has tremendous impact on our lives, yet very few of us participate in design processes. In particular, the people who are most adversely affected by design decisions — about visual culture, new technologies, the planning of our communities, or the structure of our political and economic systems — tend to have the least influence on those decisions and how they are made.</p>
  810. <p>[…]</p>
  811. <p>Before seeking new design solutions, <mark>we look for what is already working at the community level</mark>. We honor and uplift traditional, indigenous, and local knowledge and practices.</p>
  812. <p><cite><em><a href="https://designjustice.org/read-the-principles">Read the Principles - Design Justice Network</a></em> (<a href="/david/cache/2021/d685a0ad4878f3d833374164b49b3438/">cache</a>)</cite></p>
  813. </blockquote>
  814. </details>
  815. <h2><a href="/david/2021/02/15/" title="Lien permanent vers cet article">Comptabilité</a> (2021-02-15)</h2>
  816. <details>
  817. <summary>Déplier pour lire le contenu de la publication</summary>
  818. <p>Je me rends compte que j’ai de plus en plus envie/besoin de compter ce que coûtent certaines choses. J’avais commencé avec la <a href="http://tmp.larlet.fr/ccmc/">voiture achetée en octobre dernier</a> (OK, c’était aussi pour tester TailwindCSS, j’en reparlerai). Je me demande si je ne vais pas faire un truc du même acabit pour le matériel vidéo, une façon de mieux prendre conscience de la valeur des choses.</p>
  819. <p><em>Je dois vieillir aussi…</em></p>
  820. <p>Mais bon tout ça, c’était juste pour planter le contexte. Je suis confronté à des soucis techniques avec ces représentations. Je pourrais mettre ça dans une feuille de calcul mais ça serait me trahir un peu. Les tableaux en HTML c’est quand même pas terrible en terme d’édition/visualisation et en markdown ça demande d’avoir recours à des <a href="https://www.tablesgenerator.com/markdown_tables">outils externes</a> également pour que ça reste lisible. Oh et aussi, j’ai la contrainte que ce soit un brin dynamique — par exemple pour calculer un poids d’équipement, au hasard. Idéalement que ça me fasse la somme des colonnes numériques (peut-être au choix de l’utilisateur·ice&#8239;?).</p>
  821. <p>J’avais besoin de noter ceci quelque part, comme un point de départ. En l’exprimant, je me dis que quelques lignes de JavaScript sur un tableau pourraient faire l’affaire ou alors je tente <a href="https://package.elm-lang.org/packages/mdgriffith/elm-ui/latest/">un truc complètement fou</a>. Si vous avez d’autres idées/propositions, je prends.</p>
  822. </details>
  823. <h2><a href="/david/2021/02/05/" title="Lien permanent vers cet article">Réparation</a> (2021-02-05)</h2>
  824. <details>
  825. <summary>Déplier pour lire le contenu de la publication</summary>
  826. <blockquote lang="en">
  827. <p>A heavier and well-designed object feels different. You don’t have it always with you just in case. You don’t throw it in your bag without thinking about it. It is not there to relieve you from your boredom. Instead, moving the object is a commitment. A conscious act that you need it. You feel it in your hands, you feel the weight. You are telling the object: «&nbsp;I need you. You have a purpose.&nbsp;» When such a commitment is done, the purpose is rarely «&nbsp;scroll an endless stream of cat videos&nbsp;». <mark>Having a purpose makes it harder to throw the object away because a shiny new version has been released.</mark> It also helps draw the line between the times where you are using the object and the times you are not.</p>
  828. <p>Besides sturdiness, one main objective from the ForeverComputer would be to use as little electricity as possible. Batteries should be easily swappable.</p>
  829. <p><cite><em><a href="https://ploum.net/the-computer-built-to-last-50-years/">The computer built to last 50&nbsp;years</a></em> (<a href="/david/cache/2021/c4dd46c6f0fe9310b47dd3abda0b5280/">cache</a>)</cite></p>
  830. </blockquote>
  831. <p>Superbe initiative. Je suis en train de creuser le monde de la vidéo et (bien que chaque fabricant de matériel ait son propre format, batterie, stockage, etc.) je me demandais à quoi pourrait ressembler un ordinateur avec écran indépendant et alimenté par sa propre batterie comme ceux que l’on peut connecter à une caméra depuis son port HDMI. Je vois bien la contrainte mais je vois aussi la modularité et la possibilité de changer des pièces indépendamment les unes des autres.</p>
  832. <p>Un petit bémol sur la partie chiffrement, je ne pense pas que ce soit un pré-requis pertinent pour limiter la consommation énergétique de ce ForeverComputer. À la limite, un hash pour vérifier l’intégrité des fichiers après leur copie et suivre leur évolution mais tout ce qui a trait à la cryptographie évolue trop au cours du temps à mon avis. Sans compter qu’en perdant la clé de déchiffrement, on perd les contenus qui vont avec, ce qui me semble à l’opposé de l’idée de pouvoir les conserver plusieurs décennies.</p>
  833. <p>J’apprécie aussi l’approche qui consiste à commencer par faire un petit pas avec WriteOnly qui permettrait de tester la partie usage avant de passer à la suite.</p>
  834. <blockquote lang="en">
  835. <p>To mend is to comprehend a human scale problem, and without this understanding our creations become strange creatures. We see this in the common examples of our time, from architecture to websites: <mark>Things used daily that, inexplicably, do not seem to be invented for human use.</mark> In the case of housing, bad architecture treats a human-scale environment as if it were a commodity-scale problem. The creators of some places see inhabitants not as humans but parameters. I do not need to spoil your view with visions of this architecture, I only wonder, what have their creators ever repaired?</p>
  836. <p><cite><em><a href="https://simonsarris.substack.com/p/that-which-is-unique-breaks">That which is unique, breaks</a></em> (<a href="/david/cache/2021/6ad5b5985682512c140781b2b3c9ff7c/">cache</a>)</cite></p>
  837. </blockquote>
  838. </details>
  839. <h2><a href="/david/2021/02/02/" title="Lien permanent vers cet article">Complexité</a> (2021-02-02)</h2>
  840. <details>
  841. <summary>Déplier pour lire le contenu de la publication</summary>
  842. <blockquote lang="en">
  843. <p>As much as we talk about avoiding complexity <em>in</em> our programs, we seem to love the complexity of the tooling <em>around</em> our programs. As Ousterhout notes, <mark>every time you add a tool or configuration to a project, you’re adding an element that developers must learn</mark>, be aware of, or at minimum be exposed to. So while we think we’re lowering the bar of contributing and collaborating on a project — which may be true for <em>some</em> people — it’s possible we’re actually excluding people from contribution and collaboration because of the overwhelming complexity of our team of robots.</p>
  844. <p><cite><em><a href="https://blog.jim-nielsen.com/2021/codbase-collaboration-between-humans-and-robots/">Codebase Collaboration Between Humans and Robots</a></em> (<a href="/david/cache/2021/321b85630164ca075bd3be265f23aed5/">cache</a>)</cite></p>
  845. </blockquote>
  846. <p><a href="/david/2021/02/01/" title="Software">Suite</a> de mes réflexions sur le sujet (et en fait il s’agit d’un truc autour duquel je tourne depuis <a href="/david/blog/2014/gaspillage-numerique/">pas mal de temps</a>), je doute de plus en plus de la pertinence de ces enchaînements d’étapes à chaque <em>commit/push</em>. Ma difficulté actuelle est de faire la distinction entre les moments où c’est important et ceux où ça peut être facultatif (et potentiellement le rendre désactivable). On peut rapidement être <a href="https://osd.ovh/index.php?article10/nostalgie-de-lancien-web">nostalgique</a> (<a href="/david/cache/2021/59bd3fea3b3b370bd6b116e77effb69e/">cache</a>) d’un temps où l’on n’avait pas tout ça mais je me rappelle aussi du renommage des fichiers en direct sur le serveur et des conflits ou des oublis lorsqu’on travaille à plusieurs dessus, etc. C’était l’enfer et c’est bien pour cela que l’on s’est outillé un minimum depuis.</p>
  847. <p>Il y a probablement un entre-deux plus sain à trouver. Et en fait <em>plusieurs</em> en fonction du contexte. Je regrette parfois d’avoir lâché du lest sur certains aspects, j’en apprécie d’autres au quotidien. Une histoire de compromis.</p>
  848. <blockquote lang="en">
  849. <p>The technology stack was not the limit we faced in this project over the years. It was rather the <mark>abstractions</mark> we created our own that got in our way.</p>
  850. <p><cite><em><a href="https://9elements.com/blog/maintaining-javascript-applications-in-the-long-term/">Maintaining JavaScript applications in the long term</a></em> (<a href="/david/cache/2021/6d16a2f955aeaa4f23c239373824143f/">cache</a>)</cite></p>
  851. </blockquote>
  852. </details>
  853. <h2><a href="/david/2021/01/23/" title="Lien permanent vers cet article">Gratitude</a> (2021-01-23)</h2>
  854. <details>
  855. <summary>Déplier pour lire le contenu de la publication</summary>
  856. <blockquote lang="en">
  857. <p>thanks for your nice idea after 10&nbsp;years&#8239;!</p>
  858. <p><cite><em><a href="https://gist.github.com/davidbgk/651080#gistcomment-3604718">En commentaire d’un gist</a></em></cite></p>
  859. </blockquote>
  860. <p>Je suis toujours surpris que l’on puisse <a href="https://gist.github.com/davidbgk/b10113c3779b8388e96e6d0c44e03a74#gistcomment-3115327">utiliser</a> quelques bouts de code que je partage ici et là. Pour rappel, j’essaye de réunir des petits cailloux regroupés par langage&nbsp;: <a href="https://gist.github.com/davidbgk/d3d6e6477d45b4527d9609b7e96cd82a">CSS</a>, <a href="https://gist.github.com/davidbgk/8700969263bdb9d2a31ccc1ec2328f00">JS</a>, <a href="https://gist.github.com/davidbgk/b5989d129dabebea1ce8d253d4b7a6c7">Python</a> et bien sûr HTML en faisant un <code>view-source:</code> ici&nbsp;:-).</p>
  861. <p><strong>Quand on plante un graine on ne sait jamais où et quand est-ce qu’elle va germer.</strong></p>
  862. <p>À titre personnel, je n’oublierais jamais la réponse de <a href="https://fr.wikipedia.org/wiki/Guido_van_Rossum">Guido</a> à <a href="/david/stream/2015/12/02/">mon courriel</a>&nbsp;:</p>
  863. <blockquote lang="en">
  864. <p>Well thank you! So much fan mail is asking for a favor, I’m really grateful that you just express your thanks. Enjoy programming in Python, and tell your friends!</p>
  865. </blockquote>
  866. </details>
  867. <h2><a href="/david/2021/01/14/" title="Lien permanent vers cet article">Parler</a> (2021-01-14)</h2>
  868. <details>
  869. <summary>Déplier pour lire le contenu de la publication</summary>
  870. <p><em>Avertissement&nbsp;: je n’ai jamais utilisé cette application et je n’apprécie pas la nature des échanges nauséabonds qu’il semblait y avoir dessus.</em></p>
  871. <blockquote lang="en">
  872. <p>If one were looking for evidence to demonstrate that these tech behemoths are, in fact, monopolies that engage in anti-competitive behavior in violation of antitrust laws, and will obliterate any attempt to compete with them in the marketplace, it would be difficult to imagine anything more compelling than how they just used their unconstrained power to utterly <mark>destroy a rising competitor.</mark></p>
  873. <p><cite><em><a href="https://greenwald.substack.com/p/how-silicon-valley-in-a-show-of-monopolistic">How Silicon Valley, in a Show of Monopolistic Force, Destroyed Parler</a></em> (<a href="/david/cache/2021/765e28efb1fa6aa0dc9c15166f66cdf3/">cache</a>)</cite></p>
  874. </blockquote>
  875. <p>Je n’avais pas envisagé cette histoire sous cet angle là. Et s’il s’agissait «&nbsp;juste&nbsp;» de bâillonner un concurrent, <em>business as usual</em>&#8239;? J’ai presque envie de <a href="https://fr.wikipedia.org/wiki/Rasoir_de_Hanlon">me raser</a> avec&nbsp;:</p>
  876. <blockquote>
  877. <p>Ne jamais attribuer à une quelconque éthique ce que le capitalisme suffit à expliquer.</p>
  878. </blockquote>
  879. <p><strong>Les seuls outils qui seraient autorisés à concurrencer de tels monopoles seraient forcément décentralisés.</strong> C’est bien la raison pour laquelle ces plateformes sont <em>contre</em> le Web, il ne peut en être autrement car leur survie en dépend. Est-ce que Parler utilisant <a href="https://en.wikipedia.org/wiki/Secure_Scuttlebutt">Secure Scuttlebutt</a> aurait continué à fonctionner&#8239;? (<a href="/david/blog/2017/confiance-transparence/">Pour rappel.</a>) Probablement, en tout cas le bâillon n’aurait pas été aussi simple à nouer. Espérons (presque, dans un tel contexte) que ma conclusion tienne toujours&nbsp;: un tel réseau est trop beau pour percer.</p>
  880. <blockquote>
  881. <p>On ne soulignera jamais assez que la révolution ne sert à rien si elle n’est pas inspirée par son idéal ultime. Les méthodes révolutionnaires doivent être en harmonie avec les objectifs révolutionnaires. <mark>Les moyens utilisés pour approfondir la révolution doivent correspondre à ses buts.</mark> En d’autres termes, les valeurs éthiques que la révolution infusera dans la nouvelle société doivent être disséminées par les activités révolutionnaires de la période de transition. Cette dernière peut faciliter le passage à une vie meilleure mais seulement à condition qu’elle soit construite avec les mêmes matériaux que la nouvelle vie que l’on veut construire. La révolution est le miroir des jours qui suivent&#8239;; elle est l’enfant qui annonce l’Homme de demain.</p>
  882. <p><cite><em>My Desillusionment in Russia</em>, Emma Goldman</cite></p>
  883. </blockquote>
  884. </details>
  885. <h2><a href="/david/2021/01/11/" title="Lien permanent vers cet article">Marche ou trêve</a> (2021-01-11)</h2>
  886. <details>
  887. <summary>Déplier pour lire le contenu de la publication</summary>
  888. <blockquote>
  889. <p>L’engouement de nos sociétés pour la marche témoigne de cette volonté de s’arracher aux routines de la vie personnelle pour quelques heures ou davantage et devenir anonyme sur les chemins, sans plus avoir de contraintes d’identité. Le marcheur est libre de ses mouvements, de son rythme, il ne doit plus rien à personne, et nul ne vient le rappeler à ses responsabilités. Il est ailleurs, nul ne sait qui il est ni où il va. Il noue des relations provisoires ou durables avec les autres, mais à son gré. <mark>Sur les chemins de traverse, le sentiment de soi se dénoue, les exigences de la vie sociale se relâchent.</mark> La marche est un exercice ludique et contrôlé de disparition, une réappropriation heureuse de l’existence.</p>
  890. <p><cite><em>Disparaître de soi</em>, David Le Breton</cite></p>
  891. </blockquote>
  892. <p>Il est très surfait de faire une ode à la marche. Et pourtant, c’est là où je me sens le plus «&nbsp;<a href="/david/2021/01/07/" title="Blancheur">blanc</a>&nbsp;» et je regrette parfois d’avoir commencé à <a href="https://vimeo.com/473661570/46af2e921e">filmer</a> <a href="https://vimeo.com/485769887/190546b69c">ces</a> <a href="https://vimeo.com/492686199/31ac11260c">moments</a>. L’impression de perdre une partie de l’intimité que me procurent ces balades en forêt. De tenter de disparaitre en revenant avec un pancarte «&nbsp;J’existe&#8239;!&nbsp;» (en 4k s’il vous plait). Une incohérence de plus…</p>
  893. <p><strong>J’ai transformé un moment de trêve avec moi-même.</strong> Un moment où je mettais en pause mon envie d’exprimer des émotions et des réactions pour mieux les ressentir. Un moment où les seules techniques étaient celles me permettant de (sur)vivre. Et cela s’est transformé en une mise en scène et une attention au partage. Une chorégraphie malaisante de ma personne dans un moment où je pouvais enfin l’oublier.</p>
  894. <p>Peut-être que les limites matérielles auxquelles je me heurte sont le signe qu’il faut que je laisse le corps en paix dans ces moments là.</p>
  895. <blockquote>
  896. <p>En cet âge où les humains disposent de moyens de transport capables de traverser les profondeurs de l’espace-temps ou de survoler des surfaces planétaires virtuellement infranchissables, l’idée d’entreprendre de longs voyages à pied semble étrange. Pourtant, la marche demeure le premier moyen de locomotion sur Arrakis. On attribue ce fait aussi bien à un choix délibéré qu’aux rudes traitements que cette planète réserve à toute espèce mécanique. Dans les rigueurs d’Arrachis, <mark>la chair de l’homme est le recours le plus durable et le plus sûr</mark> du Hajj. Peut-être est-ce la conscience implicite de ce fait qui explique qu’Arrakis soit l’ultime miroir de l’âme.</p>
  897. <p><cite><em>Guide du Hajj</em>, <a href="/david/2020/12/21/#dune">Dune</a> III. Les enfants de Dune</cite></p>
  898. </blockquote>
  899. </details>
  900. <h2><a href="/david/2021/01/05/" title="Lien permanent vers cet article">Statu quo</a> (2021-01-05)</h2>
  901. <details>
  902. <summary>Déplier pour lire le contenu de la publication</summary>
  903. <blockquote>
  904. <p>Le <em>statu quo</em> n’a rien de passif. C’est même très actif. Dire “c’est comme ça”, “on n’y peut rien”&#8239;; <mark>c’est faire un choix actif</mark> en se protégeant, par la validation d’une norme, d’un regard silencieux qui cautionne ce choix actif.</p>
  905. <p><cite><em><a href="https://oncletom.io/2021/01/05/statu-quo/">Statu quo</a></em> (<a href="/david/cache/2021/aeb0a60038b91bf1fbbbd39b358366fb/">cache</a>)</cite></p>
  906. </blockquote>
  907. <p>Précieux rappel de Thomas. J’associe le <em>statu quo</em> à l’expression de la culture locale. On peut l’accepter, la quitter ou être en opposition. Il s’agit bien souvent d’une combinaison des trois qui s’exprime et s’étouffe en chaque individu. Une fois que l’on a mis le doigt dessus, c’est difficile à ignorer.</p>
  908. <p>C’est comme lorsqu’on m’indique qu’un outil (technique) est a-politique. Rarement, toutes nos productions et nos usages sont politiques. Le <a href="/david/2020/12/13/#gemini">gain de notre attention</a> est politique. Un format et un protocole <a href="https://jcs.org/2021/01/06/plaintext">sont politiques</a> (<a href="/david/cache/2021/9e5d68c7459c77716c44dd1463be36d8/">cache</a>). <strong>Dès que vous êtes en capacité d’inclure/exclure quelqu’un, vous êtes dans une in·action politique.</strong></p>
  909. <blockquote>
  910. <p>La technique moderne est insécable&#8239;; il est devenu impossible de parler de bonnes ou de mauvaises techniques, puisque qu’<mark>il existe une interdépendance entre les différents processus qui rendent possible l’existence des objets</mark> qui nous entourent.</p>
  911. <p>C’est pourquoi il nous est désormais impossible de considérer les objets techniques, les machines produites par l’industrie comme des moyens. À vrai dire, aucune d’entre elles ne peut être isolée et détachée de l’ensemble du système des machines produites de manière industrielle. On a toujours affaire à des produits et à des objets techniques qui n’ont aucune existence indépendante, qui ne sont pas des objets insulaires, ni des outils neutres.</p>
  912. <p><cite><em><a href="https://polemos-decroissance.org/lemprise-de-la-machine-une-critique-decroissanciste-de-la-domination-technique/">L’emprise de la machine&nbsp;: une critique décroissanciste de la domination technique</a></em> (<a href="/david/cache/2021/b19c86fa9c66389e26495165b442d0c0/">cache</a>)</cite></p>
  913. </blockquote>
  914. </details>
  915. </main>
  916. <hr>
  917. <footer>
  918. <p>
  919. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  920. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  921. </svg> Accueil</a> •
  922. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  923. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
  924. </svg> Suivre</a> •
  925. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  926. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
  927. </svg> Pro</a> •
  928. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  929. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
  930. </svg> Email</a> •
  931. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  932. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
  933. </svg> Légal</abbr>
  934. </p>
  935. <template id="theme-selector">
  936. <form>
  937. <fieldset>
  938. <legend><svg class="icon icon-brightness-contrast">
  939. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
  940. </svg> Thème</legend>
  941. <label>
  942. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  943. </label>
  944. <label>
  945. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  946. </label>
  947. <label>
  948. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  949. </label>
  950. </fieldset>
  951. </form>
  952. </template>
  953. </footer>
  954. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  955. <script>
  956. function loadThemeForm(templateName) {
  957. const themeSelectorTemplate = document.querySelector(templateName)
  958. const form = themeSelectorTemplate.content.firstElementChild
  959. themeSelectorTemplate.replaceWith(form)
  960. form.addEventListener('change', (e) => {
  961. const chosenColorScheme = e.target.value
  962. localStorage.setItem('theme', chosenColorScheme)
  963. toggleTheme(chosenColorScheme)
  964. })
  965. const selectedTheme = localStorage.getItem('theme')
  966. if (selectedTheme && selectedTheme !== 'undefined') {
  967. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  968. }
  969. }
  970. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  971. window.addEventListener('load', () => {
  972. let hasDarkRules = false
  973. for (const styleSheet of Array.from(document.styleSheets)) {
  974. let mediaRules = []
  975. for (const cssRule of styleSheet.cssRules) {
  976. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  977. continue
  978. }
  979. // WARNING: Safari does not have/supports `conditionText`.
  980. if (cssRule.conditionText) {
  981. if (cssRule.conditionText !== prefersColorSchemeDark) {
  982. continue
  983. }
  984. } else {
  985. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  986. continue
  987. }
  988. }
  989. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  990. }
  991. // WARNING: do not try to insert a Rule to a styleSheet you are
  992. // currently iterating on, otherwise the browser will be stuck
  993. // in a infinite loop…
  994. for (const mediaRule of mediaRules) {
  995. styleSheet.insertRule(mediaRule.cssText)
  996. hasDarkRules = true
  997. }
  998. }
  999. if (hasDarkRules) {
  1000. loadThemeForm('#theme-selector')
  1001. }
  1002. })
  1003. </script>
  1004. </body>
  1005. </html>