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 45KB

8 kuukautta sitten
8 kuukautta sitten
8 kuukautta sitten
3 viikkoa sitten
8 kuukautta sitten
1 kuukausi sitten
7 kuukautta sitten
8 kuukautta sitten
8 kuukautta sitten
8 kuukautta sitten
8 kuukautta sitten
8 kuukautta sitten
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692
  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. Étiquette #adaptation
  14. — David Larlet</title>
  15. <script>
  16. function toggleTheme(themeName) {
  17. document.documentElement.classList.toggle(
  18. 'forced-dark',
  19. themeName === 'dark'
  20. )
  21. document.documentElement.classList.toggle(
  22. 'forced-light',
  23. themeName === 'light'
  24. )
  25. }
  26. const selectedTheme = localStorage.getItem('theme')
  27. if (selectedTheme !== 'undefined') {
  28. toggleTheme(selectedTheme)
  29. }
  30. </script>
  31. <!-- Documented, feel free to shoot an email. -->
  32. <link rel="stylesheet" href="/static/david/css/style_2024-03-09.css">
  33. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  34. <link rel="preload"
  35. href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
  36. as="font"
  37. type="font/woff2"
  38. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  39. crossorigin>
  40. <link rel="preload"
  41. href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
  42. as="font"
  43. type="font/woff2"
  44. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  45. crossorigin>
  46. <link rel="preload"
  47. href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
  48. as="font"
  49. type="font/woff2"
  50. media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
  51. crossorigin>
  52. <link rel="preload"
  53. href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
  54. as="font"
  55. type="font/woff2"
  56. media="(prefers-color-scheme: dark)"
  57. crossorigin>
  58. <link rel="preload"
  59. href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
  60. as="font"
  61. type="font/woff2"
  62. media="(prefers-color-scheme: dark)"
  63. crossorigin>
  64. <link rel="preload"
  65. href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
  66. as="font"
  67. type="font/woff2"
  68. media="(prefers-color-scheme: dark)"
  69. crossorigin>
  70. <meta name="description" content="Publications relatives au tag #adaptation">
  71. <!-- That good ol' feed, subscribe :). -->
  72. <link rel="alternate"
  73. type="application/atom+xml"
  74. title="Feed"
  75. href="/david/log/">
  76. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  77. <link rel="apple-touch-icon"
  78. sizes="180x180"
  79. href="/static/david/icons2/apple-touch-icon.png">
  80. <link rel="icon"
  81. type="image/png"
  82. sizes="32x32"
  83. href="/static/david/icons2/favicon-32x32.png">
  84. <link rel="icon"
  85. type="image/png"
  86. sizes="16x16"
  87. href="/static/david/icons2/favicon-16x16.png">
  88. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  89. <link rel="mask-icon"
  90. href="/static/david/icons2/safari-pinned-tab.svg"
  91. color="#07486c">
  92. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  93. <meta name="msapplication-TileColor" content="#f7f7f7">
  94. <meta name="msapplication-config"
  95. content="/static/david/icons2/browserconfig.xml">
  96. <meta name="theme-color"
  97. content="#f7f7f7"
  98. media="(prefers-color-scheme: light)">
  99. <meta name="theme-color"
  100. content="#272727"
  101. media="(prefers-color-scheme: dark)">
  102. <!-- Is that even respected? Retrospectively? What a shAItshow…
  103. https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  104. <meta name="robots" content="noai, noimageai">
  105. <!-- To get attribution when linking on mastodon. -->
  106. <meta name="fediverse:creator" content="@david@larlet.fr">
  107. <style type="text/css">
  108. details[open] summary {
  109. display: none;
  110. }
  111. </style>
  112. <body data-instant-intensity="viewport-all">
  113. <article>
  114. <header>
  115. <hgroup>
  116. <h1>#adaptation</h1>
  117. <p>Publications relatives à cette étiquette</p>
  118. </hgroup>
  119. </header>
  120. <nav>
  121. <p>
  122. <a href="/david/" title="Aller à l’accueil">
  123. Accueil</a>
  124. <a rel="tags"
  125. href="/david/2024/#tags"
  126. title="Liste de toutes les étiquettes">
  127. Étiquettes</a>
  128. <a href="/david/recherche/" title="Aller à la page de recherche" rel="search" data-no-instant>Recherche</a>
  129. <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
  130. </p>
  131. </nav>
  132. <h2>
  133. <a href="/david/2024/09/30/" title="Lien permanent vers cet article">Vain</a> <time datetime="2024-09-30">30 septembre 2024</time>
  134. </h2>
  135. <blockquote lang="en">
  136. <p>wordfreq was built by collecting a whole lot of text in a lot of languages. That used to be a pretty reasonable thing to do, and not the kind of thing someone would be likely to object to. Now, the text-slurping tools are mostly used for training generative AI, and people are quite rightly on the defensive. <mark>If someone is collecting all the text from your books, articles, Web site, or public posts, it’s very likely because they are creating a plagiarism machine</mark> that will claim your words as its&nbsp;own.</p>
  137. <p>So I don’t want to work on anything that could be confused with generative AI, or that could benefit generative&nbsp;AI.</p>
  138. <p><cite><em><a data-link-domain="github.com" href="https://github.com/rspeer/wordfreq/blob/master/SUNSET.md#i-dont-want-to-be-part-of-this-scene-anymore" hreflang="en"
  139. title="Consultation de l’article (anglais)">I don’t want to be part of this scene anymore - Why wordfreq will not be updated</a>
  140. <a href="/david/cache/2024/1cd6127ccec88387f4804f0c3cf1011a/" hreflang="en"
  141. data-tippy data-description="Access a database of word frequencies, in various natural languages. - rspeer/wordfreq"
  142. data-source="https://github.com/rspeer/wordfreq/blob/master/SUNSET.md#i-dont-want-to-be-part-of-this-scene-anymore"
  143. data-date="2024-09-30"
  144. data-favicon="https://github.githubassets.com/favicons/favicon.png"
  145. data-domain="github.com"
  146. ><svg xmlns="http://www.w3.org/2000/svg"
  147. width="24" height="24" viewBox="0 0 24 24" fill="none"
  148. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  149. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  150. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  151. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  152. </svg>
  153. <span class="sr-only">[archive]</span></a></em></cite></p>
  154. </blockquote>
  155. <p>Je me devais de <a href="/david/biologeek/archives/20040930-ouverture-de-rideau/">marquer le coup</a>&nbsp;🎂.</p>
  156. <p>Ces derniers mois, je me pose beaucoup de questions au sujet du partage, du pillage, de ce que ça veut dire de transmettre aujourd’hui et surtout à quelle échelle. Peut-être que les <abbr lang="en" title="Large Language Model">LLM</abbr> sont une <strong>nouvelle forme de transmission</strong> qui passe par une transformation sur laquelle l’instigateur n’a aucun contrôle. Cela laisse reposer une incroyable responsabilité sur les intermédiaires. La communication directe est déjà un exercice tellement difficile… quels effets de bord à moyen terme sur la crédibilité et la confiance de ce qui est&nbsp;partagé&#8239;?</p>
  157. <p>Et comment peut-on refuser&#8239;? Comment conserver une interaction directe, humaine&#8239;? Peut-être que c’est finalement cela qui est en train d’être perdu lorsqu’on écrit sur le Web&nbsp;: douter du nombre d’intermédiaires. Un premier cercle va avoir droit à la pensée «&nbsp;originale&nbsp;» (interprétée), les suivants auront une pensée «&nbsp;transformée&nbsp;» (hybridée) par la machine et ses concepteur·ices pour une diffusion à une échelle qui m’échappe encore, avec une potentielle volonté manipulatrice qui m’échappe encore&nbsp;plus.</p>
  158. <p>Je ne sais pas encore si j’accepterais ici un <em>loginwall</em>, un <em>paywall</em>, un <em>throttling</em> hyper agressif ou une autre solution à inventer. Je sens bien que ma motivation à publier ouvertement est en chute libre dans un tel contexte. Quitte a être inéluctablement aspiré, peut-être qu’il faut que je me concentre sur des projets qui ont du sens et qui produisent / mettent en scène de la donnée qui mérite davantage d’être&nbsp;diffusée.</p>
  159. <p>À vingt ans, il est peut-être temps de laisser cet espace vivre sa vie aussi, le libérer et recommencer ailleurs, plus petit, différent. Toute corrélation avec ma <a href="/david/2024/06/06/" title="Sensibilité">situation professionnelle</a> serait bien évidemment&nbsp;fortuite.</p>
  160. <blockquote lang="en">
  161. <p>There’s something subversive about writing <mark>without concern</mark> for marketability or&nbsp;scale.</p>
  162. <p><cite><em><a data-link-domain="tracydurnell.com" href="https://tracydurnell.com/2024/09/29/the-secret-power-of-a-blog/" hreflang="en"
  163. title="Consultation de l’article (anglais)">The secret power of a blog</a>
  164. <a href="/david/cache/2024/72bb85e63c3eb4caed75fbb77608a638/" hreflang="en"
  165. data-tippy data-description=""
  166. data-source="https://tracydurnell.com/2024/09/29/the-secret-power-of-a-blog/"
  167. data-date="2024-09-30"
  168. data-favicon="https://tracydurnell.com/favicon.ico"
  169. data-domain="tracydurnell.com"
  170. ><svg xmlns="http://www.w3.org/2000/svg"
  171. width="24" height="24" viewBox="0 0 24 24" fill="none"
  172. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  173. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  174. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  175. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  176. </svg>
  177. <span class="sr-only">[archive]</span></a></em></cite></p>
  178. </blockquote>
  179. <p>Une part d’innocence n’est&nbsp;plus.</p>
  180. <a href="#hr-202" title="Lien vers cette section de la page"><hr id="hr-202" /></a>
  181. <blockquote lang="en">
  182. <p>It will no longer be enough to blog in order to merely “put out content”. The key will be what has always been key to great blogging: expressing your unique, inimitable&nbsp;impression.</p>
  183. <p>Blogging is expressing your impression. It’s deriving action from thought. <mark>Regardless of how much the AI sphere may not be giving thought to its actions, continued blogging in the face of that reality is deliberate action with thought</mark> — something only us humans can do. Blog. Blog against the dying of the&nbsp;light.</p>
  184. <p><cite><em><a data-link-domain="blog.jim-nielsen.com" href="https://blog.jim-nielsen.com/2024/impressionist-blogging/" hreflang="en"
  185. title="Consultation de l’article (anglais)">The Impressionist Blogging Movement</a>
  186. <a href="/david/cache/2024/1a30c47a2b293dcfaee45ee5a67efdd1/" hreflang="en"
  187. data-tippy data-description="Writing about the big beautiful mess that is making things for the world wide web."
  188. data-source="https://blog.jim-nielsen.com/2024/impressionist-blogging/"
  189. data-date="2024-09-30"
  190. data-favicon="https://blog.jim-nielsen.com/favicon.ico"
  191. data-domain="blog.jim-nielsen.com"
  192. ><svg xmlns="http://www.w3.org/2000/svg"
  193. width="24" height="24" viewBox="0 0 24 24" fill="none"
  194. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  195. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  196. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  197. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  198. </svg>
  199. <span class="sr-only">[archive]</span></a></em></cite></p>
  200. </blockquote>
  201. <a href="#hr-203" title="Lien vers cette section de la page"><hr id="hr-203" /></a>
  202. <blockquote>
  203. <p>En ce qui concerne la recherche, il me semble qu’il faudrait interdire toutes les applications: si on veut faire de la recherche avec les LLM, il me semble nécessaire de les utiliser en dehors des couches applicatives, en créant des applications ad hoc. Tous les autres usages devraient être bannis, parce que <mark>l’usage de LLM dans des applications existantes rend impossible la compréhension</mark> précise de la&nbsp;méthodologie.</p>
  204. <p><cite><em><a data-link-domain="blog.sens-public.org" href="http://blog.sens-public.org/marcellovitalirosati/chatgpttronconneuse.html" hreflang="en"
  205. title="Consultation de l’article (anglais)">ChatGPT et la tronçonneuse</a>
  206. <a href="/david/cache/2024/62e66665ed5fa02d7beff383c877fdce/" hreflang="en"
  207. data-tippy data-description="Blogue de Marcello Vitali-Rosati"
  208. data-source="http://blog.sens-public.org/marcellovitalirosati/chatgpttronconneuse.html"
  209. data-date="2024-09-30"
  210. data-favicon="http://blog.sens-public.org/marcellovitalirosati/favicon.png"
  211. data-domain="blog.sens-public.org"
  212. ><svg xmlns="http://www.w3.org/2000/svg"
  213. width="24" height="24" viewBox="0 0 24 24" fill="none"
  214. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  215. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  216. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  217. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  218. </svg>
  219. <span class="sr-only">[archive]</span></a></em></cite></p>
  220. </blockquote>
  221. <a href="#hr-204" title="Lien vers cette section de la page"><hr id="hr-204" /></a>
  222. <blockquote>
  223. <p>Révolution dans l’identité biologique! Des cellules de votre mère, de votre frère aîné ou même de votre tante pourraient bien se cacher dans votre propre&nbsp;corps.</p>
  224. <p>Ces cellules, qui ne vous appartiennent pas, vous ont été transmises in utero et sont hébergées dans vos organes, votre sang, votre moelle osseuse. Mais quel rôle jouent-elles? Longtemps associées aux maladies auto-immunes, la découverte de leur capacité à régénérer certains tissus change complètement la perception qu’on a de ces cellules étrangères. <mark>L’étude du microchimérisme ouvre une nouvelle voie</mark> thérapeutique en médecine de&nbsp;régénération.</p>
  225. <p><cite><em><a data-link-domain="coeurdessciences.uqam.ca" href="https://coeurdessciences.uqam.ca/component/eventlist/details/1220-microchimerisme-ces-autres-en-nous.html">Ces autres en nous</a></em>, Nathalie&nbsp;Lambert</cite></p>
  226. </blockquote>
  227. <p>Fascinante intervention de Nathalie Lambert sur les cellules qui se transmettent entre générations et fratries. Et même d’enfants qui ne sont pas arrivés à terme. Avec le côté <em>pharmakon</em> de ces cellules (souches) qui peuvent aider dans certaines situations et potentiellement activer des réactions auto-immunes dans&nbsp;d’autres.</p>
  228. <p>Une bonne partie de ce que j’ai appris en biologie il y a 20&nbsp;ans est déjà fausse. C’est extrêmement&nbsp;stimulant.</p>
  229. <p><a href="/david/biologeek/archives/20060119-open-articles-liberez-votre-savoir/">D’autres choses</a> n’ont <a data-link-domain="forbes.com" href="https://www.forbes.com/sites/michaeltnietzel/2024/09/16/scientists-file-antitrust-lawsuit-against-six-journal-publishers/">pas beaucoup</a> <a data-link-domain="affordance.framasoft.org" href="https://affordance.framasoft.org/2024/09/chercheur-auteur-argent-du-beurre-nantes-universite-contre-philippe-forest/">changé</a> par&nbsp;contre…</p>
  230. <a href="#hr-205" title="Lien vers cette section de la page"><hr id="hr-205" /></a>
  231. <blockquote>
  232. <p>J’aime cette façon qu’on a, aussi, en vieillissant, de ne pas vraiment changer, au contraire, de se retrouver un peu, tout en découvrant sur soi des choses qui&nbsp;apaisent.</p>
  233. <p><cite><em><a data-link-domain="sacripanne.net" href="https://sacripanne.net/post/2024/09/20/Le-privil%C3%A8ge-de-l-%C3%A2ge" hreflang="fr"
  234. title="Consultation de l’article">Le privilège de l’âge</a>
  235. <a href="/david/cache/2024/4703553d711667b5d3a10c0592c51508/" hreflang="fr"
  236. data-tippy data-description="L'âge est un sujet de conversation qui passionne les foules. On est toujours trop vieux ou trop jeune pour : quelque chose, les autres, faire bien, faire mal, être à temps, en"
  237. data-source="https://sacripanne.net/post/2024/09/20/Le-privil%C3%A8ge-de-l-%C3%A2ge"
  238. data-date="2024-09-30"
  239. data-favicon=""
  240. data-domain="sacripanne.net"
  241. ><svg xmlns="http://www.w3.org/2000/svg"
  242. width="24" height="24" viewBox="0 0 24 24" fill="none"
  243. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  244. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  245. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  246. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  247. </svg>
  248. <span class="sr-only">[archive]</span></a></em></cite></p>
  249. </blockquote>
  250. <a href="#hr-206" title="Lien vers cette section de la page"><hr id="hr-206" /></a>
  251. <p>Mot du jour&nbsp;: Friluftsliv.</p>
  252. <a href="#hr-207" title="Lien vers cette section de la page"><hr id="hr-207" /></a>
  253. <p>Acronyme du jour&nbsp;: <a data-link-domain="rationalwiki.org" href="https://rationalwiki.org/wiki/WEIRD">W.E.I.R.D.</a></p>
  254. <a href="#hr-208" title="Lien vers cette section de la page"><hr id="hr-208" /></a>
  255. <p>Lecture du jour&nbsp;: <a data-link-domain="segalcentre.org" href="https://www.segalcentre.org/common/sitemedia/201819_Shows/FR_AllyToolkit.pdf">Trousse d’outils pour les alliées aux luttes autochtones</a> (PDF, 4Mo, <a href="/static/david/blog/2024/FR_AllyToolkit.pdf">cache</a>).</p>
  256. <nav>
  257. <p>
  258. <a href="/david/2024/adaptation/"
  259. title="Liste de tous les articles 2024 associés à cette étiquette"
  260. rel="tag">#adaptation</a>
  261. <a href="/david/2024/ecriture/"
  262. title="Liste de tous les articles 2024 associés à cette étiquette"
  263. rel="tag">#écriture</a>
  264. <a href="/david/2024/ia/"
  265. title="Liste de tous les articles 2024 associés à cette étiquette"
  266. rel="tag">#IA</a>
  267. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  268. </p>
  269. </nav>
  270. <h2>
  271. <a href="/david/2024/04/22/" title="Lien permanent vers cet article">Alimentation</a> <time datetime="2024-04-22">22 avril 2024</time>
  272. </h2>
  273. <p>Je réfléchis beaucoup au nombre de <a data-link-domain="fr.wiktionary.org" href="https://fr.wiktionary.org/wiki/Calorie">Calories</a> dont j’ai besoin sur une journée d’activités intensives. J’ai l’impression d’être autour de 3000-3500 —&nbsp;selon la température notamment. Il m’est difficile d’arriver à une telle quantité en restant en-dessous du kilo par jour <em>et</em> sans perdre l’appétit au cours du&nbsp;temps.</p>
  274. <p>J’en suis à me dire que pour de la rando-course, il faut que j’expérimente une approche nutritive hybride aussi avec un petit déjeuner, un repas complet le soir et entre les deux des «&nbsp;collations&nbsp;» variées / équilibrées / hypercaloriques tous les 4-5&#8239;km par exemple. C’est très approximatif et à tester en conditions réelles bien sûr avant de&nbsp;ré-adapter.</p>
  275. <p>Je suis en train d’itérer sur ma propre recette de <a data-link-domain="fr.wikipedia.org" href="https://fr.wikipedia.org/wiki/Bannique">bannique</a>, tiraillé entre l’appropriation culturelle et la reconnaissance qu’il y a eu des siècles d’itérations avant moi… l’avantage d’une base relativement neutre étant de pouvoir la décliner en de multiples saveurs car le <em><a data-link-domain="fr.wikipedia.org" href="https://fr.wikipedia.org/wiki/Lembas">lembas</a></em> c’est un peu lassant au bout de quelques&nbsp;jours&#8239;!</p>
  276. <p>On va voir si j’arrive à perdre du poids —&nbsp;dans le sac seulement&nbsp;— avec cette stratégie. J’ai déjà l’impression d’être à bord du <a data-link-domain="en.wikipedia.org" href="https://en.wikipedia.org/wiki/Nebuchadnezzar_(The_Matrix)">Nebuchadnezzar</a> lorsque je mange mon gruau le matin, je ne suis pas encore prêt à me retrouver dans <a data-link-domain="en.wikipedia.org" href="https://en.wikipedia.org/wiki/Soylent_(meal_replacement)">Soleil Vert</a>.</p>
  277. <a href="#hr-157" title="Lien vers cette section de la page"><hr id="hr-157" /></a>
  278. <blockquote lang="en">
  279. <p>Too often, I notice that the instinct to give feedback works to cut off that kind of exploration. We assume that the person who is the object of our feedback has something to learn and fail to notice the same thing about ourselves. We presume that if something uncomfortable or unexpected happens, <mark>it represents an opportunity (or even an obligation) to give feedback—rather than an opportunity to get curious,</mark> to inquire into what’s going&nbsp;on.</p>
  280. <p>We’ve funneled so much energy into feedback processes that I fear we’ve neglected more foundational skills: the ability to ask questions, to listen deeply, to see the things before us that we’re wont to&nbsp;ignore.</p>
  281. <p><cite><em><a data-link-domain="everythingchanges.us" href="https://everythingchanges.us/blog/what-you-see/" hreflang="en"
  282. title="Consultation de l’article (anglais)">What you see | everything changes</a>
  283. <a href="/david/cache/2024/1fc13a9dd6654dd40f95de0d7d657128/" hreflang="en"
  284. data-tippy data-description="Attending to your own attention."
  285. data-source="https://everythingchanges.us/blog/what-you-see/"
  286. data-date="2024-04-22"
  287. data-favicon="https://everythingchanges.us/favicon.ico"
  288. data-domain="everythingchanges.us"
  289. ><svg xmlns="http://www.w3.org/2000/svg"
  290. width="24" height="24" viewBox="0 0 24 24" fill="none"
  291. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  292. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  293. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  294. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  295. </svg>
  296. <span class="sr-only">[archive]</span></a></em></cite></p>
  297. </blockquote>
  298. <p>🤐</p>
  299. <a href="#hr-158" title="Lien vers cette section de la page"><hr id="hr-158" /></a>
  300. <blockquote>
  301. <p>Partout on dégaine l’adjectif «&nbsp;systémique&nbsp;» sauf là, où il serait pourtant bien utile. C’est pas un problème de personnes, c’est pas que les masculinités alternatives sont un modèle qui ne s’est pas encore assez diffusé, c’est parce que l’appartenance à une classe qui a des privilèges sur une autre produit quelque chose chez les dominants, une certaine répugnance à ne pas en profiter. Difficile dans ces conditions de se mettre au service du <mark>féminisme entendu comme l’émancipation des femmes et non comme une aventure de développement personnel</mark>&nbsp;[…]</p>
  302. <p><cite><em><a data-link-domain="blog.ecologie-politique.eu" href="https://blog.ecologie-politique.eu/post/Les-hommes-doux-sont-ils-l-avenir-du-feminisme" hreflang="fr"
  303. title="Consultation de l’article">Les hommes doux sont-ils l’avenir du féminisme&#8239;?</a>
  304. <a href="/david/cache/2024/ece1ee6687c7070e9bf39adb74294b8c/" hreflang="fr"
  305. data-tippy data-description="Même si lafemme est l’avenir de l’homme, c’est moins sur nous que sur les hommes que sont projetées nombre d’attentes concernant le recul espéré du sexisme. Comme si nous ne"
  306. data-source="https://blog.ecologie-politique.eu/post/Les-hommes-doux-sont-ils-l-avenir-du-feminisme"
  307. data-date="2024-04-22"
  308. data-favicon=""
  309. data-domain="blog.ecologie-politique.eu"
  310. ><svg xmlns="http://www.w3.org/2000/svg"
  311. width="24" height="24" viewBox="0 0 24 24" fill="none"
  312. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  313. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  314. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  315. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  316. </svg>
  317. <span class="sr-only">[archive]</span></a></em></cite></p>
  318. </blockquote>
  319. <p>Ça pique là où il faut que ça&nbsp;pique.</p>
  320. <a href="#hr-159" title="Lien vers cette section de la page"><hr id="hr-159" /></a>
  321. <blockquote lang="en">
  322. <p>Even if you decide not to post the comment or delete it after it is posted, the files are not deleted from GitHub’s CDN, and the download URLs continue to work&nbsp;forever.</p>
  323. <p>As the file’s URL contains the name of the repository the comment was created in, and as almost every software company uses GitHub, this flaw can allow threat actors to develop extraordinarily crafty and trustworthy&nbsp;lures.</p>
  324. <p><cite><em><a data-link-domain="bleepingcomputer.com" href="https://www.bleepingcomputer.com/news/security/github-comments-abused-to-push-malware-via-microsoft-repo-urls/" hreflang="en"
  325. title="Consultation de l’article (anglais)">GitHub comments abused to push malware via Microsoft repo URLs</a>
  326. <a href="/david/cache/2024/81659ceed4b37a8c94095c3b743fe13a/" hreflang="en"
  327. data-tippy data-description="A GitHub flaw, or possibly&nbsp;a design decision, is being abused by threat actors to distribute malware using URLs associated with a Microsoft repository, making the files appear trustworthy."
  328. data-source="https://www.bleepingcomputer.com/news/security/github-comments-abused-to-push-malware-via-microsoft-repo-urls/"
  329. data-date="2024-04-22"
  330. data-favicon="https://www.bleepstatic.com/favicon/bleeping.ico"
  331. data-domain="bleepingcomputer.com"
  332. ><svg xmlns="http://www.w3.org/2000/svg"
  333. width="24" height="24" viewBox="0 0 24 24" fill="none"
  334. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  335. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  336. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  337. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  338. </svg>
  339. <span class="sr-only">[archive]</span></a></em></cite></p>
  340. </blockquote>
  341. <p>Une astuce pour un hébergement d’images aux frais de Microsoft est en train d’être documentée. À juste titre, je n’avais pas conscience que l’URL était liée au dépôt ce qui ouvre pas mal de possibilités niveau&nbsp;sécurité.</p>
  342. <nav>
  343. <p>
  344. <a href="/david/2024/adaptation/"
  345. title="Liste de tous les articles 2024 associés à cette étiquette"
  346. rel="tag">#adaptation</a>
  347. <a href="/david/2024/laboratoire/"
  348. title="Liste de tous les articles 2024 associés à cette étiquette"
  349. rel="tag">#laboratoire</a>
  350. <a href="/david/2024/sport/"
  351. title="Liste de tous les articles 2024 associés à cette étiquette"
  352. rel="tag">#sport</a>
  353. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  354. </p>
  355. </nav>
  356. <h2>
  357. <a href="/david/2024/03/18/" title="Lien permanent vers cet article">Casquettes</a> <time datetime="2024-03-18">18 mars 2024</time>
  358. </h2>
  359. <p>L’impression de porter beaucoup de casquettes dans la même journée en ce moment. Genre ces dernières années en fait. Je ne sais pas encore si ça mène à l’épuisement ou si c’est ce qui me permet de ne pas&nbsp;m’ennuyer.</p>
  360. <p>Je vais bientôt pouvoir ajouter «&nbsp;nocoder&nbsp;» à mon CV. Petite joie technique&nbsp;(?) de la journée, on a réussi à connecter une feuille AiTable à la banque. On place une date dans une cellule et ça programme un virement de l’autre côté. C’était marrant de le faire en&nbsp;binôme.</p>
  361. <a href="#hr-121" title="Lien vers cette section de la page"><hr id="hr-121" /></a>
  362. <blockquote lang="en">
  363. <p>When you’re designing a piece of software, the single most important thing to design for is understandability. Security, performance, and correctness are all important, but <mark>they come after&nbsp;understandability.</mark></p>
  364. <p><cite><em><a data-link-domain="ntietz.com" href="https://ntietz.com/blog/the-most-important-goal-in-designing-software-is-understandability/" hreflang="en"
  365. title="Consultation de l’article (anglais)">The most important goal in designing software is understandability</a>
  366. <a href="/david/cache/2024/f154db1b6eccf69f498b4a31980367bd/" hreflang="en"
  367. data-tippy data-description="When you're designing a piece of software, the single most important thing to design for is understandability."
  368. data-source="https://ntietz.com/blog/the-most-important-goal-in-designing-software-is-understandability/"
  369. data-date="2024-03-18"
  370. data-favicon="https://ntietz.com/favicon-32x32.png"
  371. data-domain="ntietz.com"
  372. ><svg xmlns="http://www.w3.org/2000/svg"
  373. width="24" height="24" viewBox="0 0 24 24" fill="none"
  374. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  375. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  376. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  377. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  378. </svg>
  379. <span class="sr-only">[archive]</span></a></em></cite></p>
  380. </blockquote>
  381. <a href="#hr-122" title="Lien vers cette section de la page"><hr id="hr-122" /></a>
  382. <blockquote lang="en">
  383. <p>Open Source is rewarding- but it can also be&nbsp;exhausting.</p>
  384. <p>The linking project’s code is provided as-is, and is not actively&nbsp;maintained.</p>
  385. <p><cite><em><a data-link-domain="unmaintained.tech" href="https://unmaintained.tech/" hreflang="en"
  386. title="Consultation de l’article (anglais)">No Maintenance Intended</a>
  387. <a href="/david/cache/2024/590887213b24404c8d1e8355127ce2e2/" hreflang="en"
  388. data-tippy data-description="The linking project’s code is provided as-is, and is not actively maintained."
  389. data-source="https://unmaintained.tech/"
  390. data-date="2024-03-18"
  391. data-favicon=""
  392. data-domain="unmaintained.tech"
  393. ><svg xmlns="http://www.w3.org/2000/svg"
  394. width="24" height="24" viewBox="0 0 24 24" fill="none"
  395. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  396. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  397. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  398. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  399. </svg>
  400. <span class="sr-only">[archive]</span></a></em></cite></p>
  401. </blockquote>
  402. <nav>
  403. <p>
  404. <a href="/david/2024/adaptation/"
  405. title="Liste de tous les articles 2024 associés à cette étiquette"
  406. rel="tag">#adaptation</a>
  407. <a href="/david/2024/addiction/"
  408. title="Liste de tous les articles 2024 associés à cette étiquette"
  409. rel="tag">#addiction</a>
  410. <a href="/david/2024/evolution/"
  411. title="Liste de tous les articles 2024 associés à cette étiquette"
  412. rel="tag">#évolution</a>
  413. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  414. </p>
  415. </nav>
  416. <h2>
  417. <a href="/david/2024/03/10/" title="Lien permanent vers cet article">Dune</a> <time datetime="2024-03-10">10 mars 2024</time>
  418. </h2>
  419. <p>Je crois bien n’être allé que 3&nbsp;fois dans une salle de cinéma ces 10&nbsp;dernières années. Et puis l’occasion s’est présentée, sans prévenir, aujourd’hui. J’avais <a href="/david/2021/10/18/">quelques retenues sur la première partie</a> mais j’attendais quand même avec impatience la suite. Et j’avais réussi à ne pas trop regarder les bandes annonces, ni les&nbsp;critiques.</p>
  420. <p><em>Note&nbsp;: ça va forcément divulgâcher un peu dans la&nbsp;suite.</em></p>
  421. <p>L’adaptation est bonne, le défi était de taille et —&nbsp;en dépit des quelques ajustements qui piquent un peu le <em>fan</em> que je suis (surtout vers la fin&#8239;!)&nbsp;— la scénarisation est cohérente. Ce qui n’était pas une mince affaire car encore une fois la temporalité n’est pas évidente et rendre l’évolution des personnages visible avec tout ce qui est censé se passer dans leur tête requiert des redéfinitions et des&nbsp;raccourcis.</p>
  422. <p>Mon erreur a probablement été de choisir de l’IMAX alors que c’était Hans “<a data-link-domain="20k.org" href="https://www.20k.org/episodes/boojstrikesback">booj</a>” Zimmer aux platines. Autant dire que le siège a vibré la moitié du film&#8239;! Au-delà de la bande originale, le son a vraiment été travaillé mais je crois que c’était un peu trop pour mes vieilles oreilles plus vraiment adaptées à de tels volumes. Il y a des moments où j’ai même trouvé que ça altérait la compréhension des dialogues… j’avais un peu l’impression de me noyer dans la volonté im·mer·sive alors que l’on est en plein désert. Je doute de retourner dans une salle de si&nbsp;tôt.</p>
  423. <p>Tout ce qui tourne autour des vers est bien fait, j’avais toujours eu du mal à me faire ma propre représentation des tailles et interactions à la lecture et là ça me semble être respecté / réaliste. Idem pour les <em>Sietchs</em>, c’est fidèle à la projection mentale que je pouvais m’en faire, même si l’on n’en voit pas grand chose au final. J’ai particulièrement apprécié le choix de faire une <em>Chani</em> forte qui est davantage consciente des enjeux et des répercutions. La jalousie aurait mérité d’être plus subtile, la différence entre la femme (politique) de Paul et sa compagne (amoureuse) est vraiment explicite dans le&nbsp;livre.</p>
  424. <p>Paul Muad’dib perd un peu trop d’eau à mon goût au cours de nombreuses scènes. Il était probablement plus difficile de transmettre des émotions&nbsp;sèches&nbsp;(?).</p>
  425. <p>Pour finir sur une note positive, l’image bien sûr. C’est à la limite du trop <em>et</em> c’est magnifique au niveau des différents tableaux qui s’enchaînent avec leurs propres couleurs, cinématiques et points de vues. On sent le travail de recherche sans qu’il ne devienne complètement distrayant. J’y serai d’autant plus attentif lors d’un second visionnage, chez moi, en choisissant le volume&nbsp;sonore.</p>
  426. <p>Je ne vois pas comment est-ce qu’il ne pourrait pas y avoir une troisième partie. À voir comment / si ça raccroche les wagons des livres. J’aurais presque envie que ça explore sa propre branche. <em>Dune&nbsp;multi·vers·e&#8239;!</em></p>
  427. <nav>
  428. <p>
  429. <a href="/david/2024/adaptation/"
  430. title="Liste de tous les articles 2024 associés à cette étiquette"
  431. rel="tag">#adaptation</a>
  432. <a href="/david/2024/cinema/"
  433. title="Liste de tous les articles 2024 associés à cette étiquette"
  434. rel="tag">#cinéma</a>
  435. <a href="/david/2024/lecture/"
  436. title="Liste de tous les articles 2024 associés à cette étiquette"
  437. rel="tag">#lecture</a>
  438. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  439. </p>
  440. </nav>
  441. <h2>
  442. <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour 2</a> <time datetime="2024-03-05">5 mars 2024</time>
  443. </h2>
  444. <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>
  445. <figure>
  446. <a href="/static/david/2024/2024-03-05-lac-corbeau.jpg"
  447. title="Cliquer pour une version haute résolution">
  448. <img
  449. src="/static/david/2024/2024-03-05-lac-corbeau.jpg"
  450. width="4032" height="3024"
  451. srcset="/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w"
  452. sizes="min(100vw, calc(100vh * 4032 / 3024))"
  453. loading="lazy"
  454. decoding="async"
  455. alt="Lac corbeau à l’aube.">
  456. </a>
  457. <figcaption>De bien jolies couleurs au&nbsp;réveil.</figcaption>
  458. </figure>
  459. <p>Cet épisode me confirme encore une fois que les enfants ont des corps de sportifs de très haut niveau. Je suis impatient de pouvoir le charger un peu plus car c’est frustrant de le voir gambader devant de bon matin alors que mes muscles sont à peine réveillés. J’aime bien lorsqu’on va explorer un peu plus loin et que l’on se projette sur ce que l’on pourrait faire l’année&nbsp;suivante.</p>
  460. <figure>
  461. <a href="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
  462. title="Cliquer pour une version haute résolution">
  463. <img
  464. src="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
  465. width="3024" height="4032"
  466. srcset="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w"
  467. sizes="min(100vw, calc(100vh * 3024 / 4032))"
  468. loading="lazy"
  469. decoding="async"
  470. alt="Un enfant qui court dans la neige vers un refuge.">
  471. </a>
  472. <figcaption>Jamais&nbsp;fatigué.</figcaption>
  473. </figure>
  474. <p>Le retour est moins joyeux car il s’agit d’enchainer les efforts et chaque heure qui passe rend la neige plus meuble. À tel point que l’on décide de couper par une piste sur une courte section. Mon évaluation est que la saison de ski est terminée, même une sous-couche bien travaillée ne tiendra pas la semaine qui s’en&nbsp;vient.</p>
  475. <p>J’aurais aimé faire une boucle un peu plus longue au retour mais il faut savoir s’adapter aux conditions. Le plus important est de terminer sans blessure ni&nbsp;dégoût.</p>
  476. <p><em>Je commence à imaginer un parcours rapide sur plusieurs jours dans cette forêt que je connais bien. Peut-être qu’une fenêtre se dessine en avril… il faut que je récupère un peu de cardio d’ici&nbsp;là.</em></p>
  477. <nav>
  478. <p>
  479. <a href="/david/2024/adaptation/"
  480. title="Liste de tous les articles 2024 associés à cette étiquette"
  481. rel="tag">#adaptation</a>
  482. <a href="/david/2024/aventure/"
  483. title="Liste de tous les articles 2024 associés à cette étiquette"
  484. rel="tag">#aventure</a>
  485. <a href="/david/2024/psychologie/"
  486. title="Liste de tous les articles 2024 associés à cette étiquette"
  487. rel="tag">#psychologie</a>
  488. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  489. </p>
  490. </nav>
  491. <form action="/david/recherche/" method="get">
  492. <fieldset>
  493. <legend>Recherche</legend>
  494. <label for="input-search">Termes de votre recherche :</label>
  495. <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
  496. <input type="submit" value="Chercher">
  497. <p id="indexation-infos">
  498. <small>
  499. Seuls les contenus de ces 8 dernières années sont indexés.
  500. </small>
  501. </p>
  502. </fieldset>
  503. </form>
  504. <aside>
  505. <theme-toggle></theme-toggle>
  506. </aside>
  507. </article>
  508. <hr>
  509. <footer>
  510. <p>
  511. <a href="/david/" title="Aller à l’accueil">Accueil</a>
  512. <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
  513. <a href="http://larlet.com"
  514. title="Go to my English profile"
  515. data-instant>Pro</a>
  516. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
  517. <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
  518. </p>
  519. <template id="theme-selector">
  520. <form>
  521. <style type="text/css">
  522. fieldset div {
  523. text-align: center;
  524. }
  525. </style>
  526. <fieldset>
  527. <legend>Thème</legend>
  528. <div>
  529. <label>
  530. <input type="radio" value="auto" name="chosen-color-scheme" checked>
  531. Auto
  532. </label>
  533. <label>
  534. <input type="radio" value="dark" name="chosen-color-scheme">
  535. Foncé
  536. </label>
  537. <label>
  538. <input type="radio" value="light" name="chosen-color-scheme">
  539. Clair
  540. </label>
  541. </div>
  542. </fieldset>
  543. </form>
  544. </template>
  545. </footer>
  546. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  547. <script>
  548. class ThemeToggle extends HTMLElement {
  549. constructor() {
  550. super()
  551. const themeSelectorTemplate = document.querySelector('#theme-selector')
  552. const form = themeSelectorTemplate.content.firstElementChild
  553. this.attachShadow({ mode: 'open' })
  554. this.shadowRoot.appendChild(form.cloneNode(true))
  555. }
  556. connectedCallback() {
  557. const form = this.shadowRoot.querySelector('form')
  558. form.addEventListener('change', (e) => {
  559. const chosenColorScheme = e.target.value
  560. localStorage.setItem('theme', chosenColorScheme)
  561. toggleTheme(chosenColorScheme)
  562. })
  563. const selectedTheme = localStorage.getItem('theme')
  564. if (selectedTheme && selectedTheme !== 'undefined') {
  565. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  566. }
  567. }
  568. }
  569. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  570. window.addEventListener('load', () => {
  571. let colorsLayer = undefined
  572. let hasDarkRules = false
  573. for (const styleSheet of Array.from(document.styleSheets)) {
  574. let mediaRules = []
  575. for (const layerRule of styleSheet.cssRules) {
  576. if (!(layerRule instanceof CSSLayerBlockRule)) {
  577. continue
  578. }
  579. if (layerRule.name === 'colors') {
  580. colorsLayer = layerRule
  581. }
  582. for (const cssRule of layerRule.cssRules) {
  583. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  584. continue
  585. }
  586. // WARNING: Safari does not have/supports `conditionText`.
  587. if (cssRule.conditionText) {
  588. if (cssRule.conditionText !== prefersColorSchemeDark) {
  589. continue
  590. }
  591. } else {
  592. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  593. continue
  594. }
  595. }
  596. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  597. }
  598. }
  599. // WARNING: do not try to insert a Rule to a styleSheet you are
  600. // currently iterating on, otherwise the browser will be stuck
  601. // in a infinite loop…
  602. for (const mediaRule of mediaRules) {
  603. // Safari requires the `0` second parameter (even if default).
  604. colorsLayer.insertRule(mediaRule.cssText, 0)
  605. hasDarkRules = true
  606. }
  607. }
  608. if (hasDarkRules) {
  609. if ('customElements' in window && !customElements.get('theme-toggle')) {
  610. customElements.define('theme-toggle', ThemeToggle)
  611. }
  612. }
  613. })
  614. </script>
  615. </body>
  616. </html>