Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 18KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357
  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>
  13. Transmission
  14. — David Larlet</title>
  15. <meta name="description" content="So I would. I would grab a coffee, sit down, and start reading. Often we’d share posts back and forth, or chat about some of the more interesting ones we had read. It was something we did that was never on accident… it was intentional, deliberate. It was a way, I think, of investing in ourselves while also acknowledging how much we still could learn from others.">
  16. <!-- That good ol' feed, subscribe :). -->
  17. <link rel="alternate"
  18. type="application/atom+xml"
  19. title="Feed"
  20. href="/david/log/">
  21. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  22. <link rel="apple-touch-icon"
  23. sizes="180x180"
  24. href="/static/david/icons2/apple-touch-icon.png">
  25. <link rel="icon"
  26. type="image/png"
  27. sizes="32x32"
  28. href="/static/david/icons2/favicon-32x32.png">
  29. <link rel="icon"
  30. type="image/png"
  31. sizes="16x16"
  32. href="/static/david/icons2/favicon-16x16.png">
  33. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  34. <link rel="mask-icon"
  35. href="/static/david/icons2/safari-pinned-tab.svg"
  36. color="#07486c">
  37. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  38. <meta name="msapplication-TileColor" content="#f7f7f7">
  39. <meta name="msapplication-config"
  40. content="/static/david/icons2/browserconfig.xml">
  41. <meta name="theme-color"
  42. content="#f7f7f7"
  43. media="(prefers-color-scheme: light)">
  44. <meta name="theme-color"
  45. content="#272727"
  46. media="(prefers-color-scheme: dark)">
  47. <!-- Is that even respected? Retrospectively? What a shAItshow…
  48. https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  49. <meta name="robots" content="noai, noimageai">
  50. <!-- Documented, feel free to shoot an email. -->
  51. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  52. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  53. <link rel="preload"
  54. href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2"
  55. as="font"
  56. type="font/woff2"
  57. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  58. crossorigin>
  59. <link rel="preload"
  60. href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2"
  61. as="font"
  62. type="font/woff2"
  63. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  64. crossorigin>
  65. <link rel="preload"
  66. href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2"
  67. as="font"
  68. type="font/woff2"
  69. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  70. crossorigin>
  71. <link rel="preload"
  72. href="/static/david/css/fonts/triplicate_t3_regular.woff2"
  73. as="font"
  74. type="font/woff2"
  75. media="(prefers-color-scheme: dark)"
  76. crossorigin>
  77. <link rel="preload"
  78. href="/static/david/css/fonts/triplicate_t3_bold.woff2"
  79. as="font"
  80. type="font/woff2"
  81. media="(prefers-color-scheme: dark)"
  82. crossorigin>
  83. <link rel="preload"
  84. href="/static/david/css/fonts/triplicate_t3_italic.woff2"
  85. as="font"
  86. type="font/woff2"
  87. media="(prefers-color-scheme: dark)"
  88. crossorigin>
  89. <script>
  90. function toggleTheme(themeName) {
  91. document.documentElement.classList.toggle(
  92. 'forced-dark',
  93. themeName === 'dark'
  94. )
  95. document.documentElement.classList.toggle(
  96. 'forced-light',
  97. themeName === 'light'
  98. )
  99. }
  100. const selectedTheme = localStorage.getItem('theme')
  101. if (selectedTheme !== 'undefined') {
  102. toggleTheme(selectedTheme)
  103. }
  104. </script>
  105. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick"
  106. data-instant-intensity="viewport-all">
  107. <article>
  108. <header>
  109. <h1>Transmission</h1>
  110. </header>
  111. <nav>
  112. <p class="center">
  113. <a rel="prev"
  114. href="/david/2023/02/18/"
  115. title="Publication précédente : Quiz">← Précédent</a> •
  116. <nobr>
  117. <a href="/david/" title="Aller à l’accueil" rel="up">
  118. <svg class="icon icon-home">
  119. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"></use>
  120. </svg>
  121. Accueil</a>
  122. </nobr>
  123. <nobr>
  124. <a href="/david/recherche/"
  125. title="Aller à la page de recherche"
  126. rel="search">
  127. <svg class="icon icon-search">
  128. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-search"></use>
  129. </svg>
  130. Recherche</a>
  131. </nobr>
  132. • <a rel="next"
  133. href="/david/2023/02/28/"
  134. title="Publication suivante : AlgoRSSithme">Suivant →</a>
  135. </p>
  136. </nav>
  137. <hr>
  138. <blockquote lang="en">
  139. <p>So I would. I would grab a coffee, sit down, and start reading. Often we’d share posts back and forth, or chat about some of the more interesting ones we had read. It was something we did that was never on accident… <mark>it was intentional, deliberate.</mark> It was a way, I think, of investing in ourselves while also acknowledging how much we still could learn from&nbsp;others.</p>
  140. <p><cite><em><a href="https://timkadlec.com/remembers/2023-02-23-investing-in-rss/">Investing in RSS</a></em>&nbsp;(<a href="/david/cache/2023/19ec475bd5d92b02fbef043c52ea0589/">cache</a>)</cite></p>
  141. </blockquote>
  142. <p>Il y a ce réveil des blogs qui me rend silencieux, laisser la place d’une attention pour les autres. Et en même temps, ce sont plutôt des réveils que de nouvelles personnes. <strong>Je suis très disposé à me faire le relais de nouveaux blogs si vous en créez&nbsp;un.</strong></p>
  143. <p>Il y a la constatation récurrente que la <a href="https://fr.wikipedia.org/wiki/Loi_de_Conway">Loi de Conway</a> se vérifie dès que je travaille avec des structures à taille inhumaine. L’aliénation de l’humain aux processus est l’un des grands mystères de ce temps. L’expérience de ces hiérarchies me permet d’attendre d’être en communication avec LA personne compétente pour aller de&nbsp;l’avant.</p>
  144. <p>Il y a la transmission douloureuse, je me demande par exemple si sa génération sera la dernière à pouvoir faire du ski de fond dans les parcs montréalais. Au même titre qu’il a été l’un des derniers à pouvoir patiner sur le Lac aux Castors du Mont-Royal. Et encore, il était dans la&nbsp;poussette.</p>
  145. <p>Il y a cette rupture vraiment pas conventionnelle qui me questionne sur le fait qu’une transmission ultime puisse passer par la destruction pour voir ce qui est recréé ensuite, valider les acquis et les envies en quelque sorte. Tellement difficile de décortiquer certaines intentions sans raviver les&nbsp;tensions.</p>
  146. <hr />
  147. <blockquote>
  148. <p>🔄 Que se passe-t-il quand un LLM se nourrit en continu&#8239;&#8239;? Soit il se retrouve exposé à des <mark>contenus produits par d’autres LLM</mark>, soit il continue à être alimenté par des données hiérarchisées par des scrutins alimentés par des personnes qui, elles-mêmes, sont exposées à des contenus produits par un LLM.&nbsp;Quel impact cela pourrait-il avoir sur la qualité des&nbsp;contenus&#8239;&#8239;?</p>
  149. <p><cite><em><a href="https://boris.schapira.dev/notes/2023-02-des-questions/">Des questions · Boris Schapira</a></em>&nbsp;(<a href="/david/cache/2023/482252d2b8806e99bc30ffab2b2c51c9/">cache</a>)</cite></p>
  150. </blockquote>
  151. <blockquote lang="en">
  152. <p>🚜 Today’s cloud services have the look and feel of that tractor. They’re conceived by infrastructure people who care about efficient computation, fast networking, and cheap storage. The comfort and convenience of the developers who need to drive these services to build end-user facing applications has been an&nbsp;afterthought.</p>
  153. <p>Both the tractor and the cloud service of the past made sense: <mark>The majority of people who made the purchasing decisions didn’t operate them</mark>, and those who did had little influence. Why bother making them nice to&nbsp;operate?</p>
  154. <p><cite><em><a href="https://pydantic.dev/announcement/">Company Announcement | Pydantic</a></em>&nbsp;(<a href="/david/cache/2023/0f8bbba127c48a13b35fdf265c2dc106/">cache</a>)</cite></p>
  155. </blockquote>
  156. <blockquote lang="en">
  157. <p>🤸 It comes down to this annoying, upsetting, stupid fact: <mark>the only way to build a great product is to use it every day, to stare at it, to hold it in your hands to feel its lumps.</mark> The data and customers will lie to you but the product never will. And most product orgs suck because they simply don’t use the products that they’re building; they ship incremental nothings without direction because they’re looking at spreadsheets all day long filled with junk data&nbsp;nothings.</p>
  158. <p><cite><em><a href="https://www.robinrendle.com/notes/vibe-driven-development/">Vibe Driven Development</a></em>&nbsp;(<a href="/david/cache/2023/660b2a27b116787ac44e536e6c9dbcd3/">cache</a>)</cite></p>
  159. </blockquote>
  160. <blockquote lang="en">
  161. <p>🧑‍⚖️ Traditional open source is based on the flawed premise that technology is fundamentally neutral, and that unrestricted access to source code— even for explicitly “evil” purposes— is in fact an unqualified good. But around the world, open source developers are starting to realize that the software that they create, with its tremendous potential to change the world for the better, is also being abused to sustain and promote systems of inequity and injustice, globally, and at unprecedented&nbsp;scale.</p>
  162. <p>The Hippocratic License 3.0 (HL3) aims <mark>to confront the potential harms and abuses technology can have</mark> on fundamental human rights. It empowers open source communities to establish a clear set of ethical standards that licensees must abide by in order to adopt their&nbsp;code.</p>
  163. <p><cite><em><a href="https://firstdonoharm.dev/">The Hippocratic License</a></em>&nbsp;(<a href="/david/cache/2023/e44bfaaecad989f67cb2032fac000276/">cache</a>)</cite></p>
  164. </blockquote>
  165. <blockquote lang="en">
  166. <p>😮 I am all for radical criticism, especially targeted at billion-dollar tech corporations and powerful project leaders who <a href="https://fediverse.zachleat.com/@zachleat/109830047951867907">try to silence critics</a>. We need <mark>to hold them accountable</mark> for tech that produces harmful, subpar web experiences. They deserve their decent share of “told you&nbsp;so”.</p>
  167. <p><cite><em><a href="https://molily.de/update-on-robust-javascript/">An update on Robust Client-Side JavaScript</a></em>&nbsp;(<a href="/david/cache/2023/9718ae2062146285e1c4f406240e04af/">cache</a>)</cite></p>
  168. </blockquote>
  169. <blockquote lang="en">
  170. <p>🤗 As we build stuff, we make trade-off decisions like this all the time. If I have a point, it’s that we should consider these tradeoffs <mark>with our most junior teammates in mind;</mark> how much complexity are we adding for them? Is it worth&nbsp;it?</p>
  171. <p><cite><em><a href="https://www.joshwcomeau.com/career/clever-code-considered-harmful/">Clever Code Considered Harmful</a></em>&nbsp;(<a href="/david/cache/2023/a09b5bf450d2cf86fb9e9d6f13b070e0/">cache</a>)</cite></p>
  172. </blockquote>
  173. <nav>
  174. <p>
  175. <a href="/david/2023/attention/"
  176. title="Liste de tous les articles 2023 associés à cette étiquette"
  177. rel="tag">#attention</a>
  178. <a href="/david/2023/confiance/"
  179. title="Liste de tous les articles 2023 associés à cette étiquette"
  180. rel="tag">#confiance</a>
  181. <a href="/david/2023/solastalgia/"
  182. title="Liste de tous les articles 2023 associés à cette étiquette"
  183. rel="tag">#solastalgia</a>
  184. <a href="/david/#tags-2023" title="Liste de toutes les étiquettes 2023">
  185. <svg class="icon icon-tags">
  186. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-tags"></use>
  187. </svg>
  188. tous ?</a>
  189. </p>
  190. </nav>
  191. <nav>
  192. <p class="center">
  193. <a rel="prev"
  194. href="/david/2023/02/18/"
  195. title="Publication précédente : Quiz">← Précédent</a> •
  196. <a href="/david/2023/" title="Liste des publications récentes">↑ En 2023</a>
  197. • <a rel="next"
  198. href="/david/2023/02/28/"
  199. title="Publication suivante : AlgoRSSithme">Suivant →</a>
  200. </p>
  201. </nav>
  202. </article>
  203. <hr>
  204. <footer>
  205. <p>
  206. <nobr>
  207. <a href="/david/" title="Aller à l’accueil">
  208. <svg class="icon icon-home">
  209. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"></use>
  210. </svg>
  211. Accueil</a>
  212. </nobr>
  213. <nobr>
  214. <a href="/david/log/" title="Accès au flux RSS">
  215. <svg class="icon icon-rss2">
  216. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-rss2"></use>
  217. </svg>
  218. Suivre</a>
  219. </nobr>
  220. <nobr>
  221. <a href="http://larlet.com"
  222. title="Go to my English profile"
  223. data-instant>
  224. <svg class="icon icon-user-tie">
  225. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-user-tie"></use>
  226. </svg>
  227. Pro</a>
  228. </nobr>
  229. <nobr>
  230. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">
  231. <svg class="icon icon-mail">
  232. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-mail"></use>
  233. </svg>
  234. Email</a>
  235. </nobr>
  236. <nobr>
  237. <abbr class="nowrap"
  238. title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">
  239. <svg class="icon icon-hammer2">
  240. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-hammer2"></use>
  241. </svg>
  242. Légal</abbr>
  243. </nobr>
  244. </p>
  245. <template id="theme-selector">
  246. <form>
  247. <fieldset>
  248. <legend>
  249. <svg class="icon icon-brightness-contrast">
  250. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-brightness-contrast"></use>
  251. </svg>
  252. Thème
  253. </legend>
  254. <label>
  255. <input type="radio" value="auto" name="chosen-color-scheme" checked>
  256. Auto
  257. </label>
  258. <label>
  259. <input type="radio" value="dark" name="chosen-color-scheme">
  260. Foncé
  261. </label>
  262. <label>
  263. <input type="radio" value="light" name="chosen-color-scheme">
  264. Clair
  265. </label>
  266. </fieldset>
  267. </form>
  268. </template>
  269. </footer>
  270. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  271. <script>
  272. function loadThemeForm(templateName) {
  273. const themeSelectorTemplate = document.querySelector(templateName)
  274. const form = themeSelectorTemplate.content.firstElementChild
  275. themeSelectorTemplate.replaceWith(form)
  276. form.addEventListener('change', (e) => {
  277. const chosenColorScheme = e.target.value
  278. localStorage.setItem('theme', chosenColorScheme)
  279. toggleTheme(chosenColorScheme)
  280. })
  281. const selectedTheme = localStorage.getItem('theme')
  282. if (selectedTheme && selectedTheme !== 'undefined') {
  283. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  284. }
  285. }
  286. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  287. window.addEventListener('load', () => {
  288. let hasDarkRules = false
  289. for (const styleSheet of Array.from(document.styleSheets)) {
  290. let mediaRules = []
  291. for (const cssRule of styleSheet.cssRules) {
  292. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  293. continue
  294. }
  295. // WARNING: Safari does not have/supports `conditionText`.
  296. if (cssRule.conditionText) {
  297. if (cssRule.conditionText !== prefersColorSchemeDark) {
  298. continue
  299. }
  300. } else {
  301. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  302. continue
  303. }
  304. }
  305. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  306. }
  307. // WARNING: do not try to insert a Rule to a styleSheet you are
  308. // currently iterating on, otherwise the browser will be stuck
  309. // in a infinite loop…
  310. for (const mediaRule of mediaRules) {
  311. styleSheet.insertRule(mediaRule.cssText)
  312. hasDarkRules = true
  313. }
  314. }
  315. if (hasDarkRules) {
  316. loadThemeForm('#theme-selector')
  317. }
  318. })
  319. </script>
  320. </body>
  321. </html>