Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

index.html 90KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335
  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 #évolution
  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 #évolution">
  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>#évolution</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/06/09/" title="Lien permanent vers cet article">Possibilités</a> <time datetime="2024-06-09">9 juin 2024</time>
  134. </h2>
  135. <p>Prendre et communiquer <a href="/david/2024/06/06/" title="Sensibilité">cette décision</a> m’a autorisé à envisager de nouvelles pistes que j’excluais jusque là pour ne pas biaiser mon choix. Depuis, mon cerveau est en effervescence, surtout la nuit. J’aimerais me laisser le temps d’explorer ce que j’ai envie de faire et avec qui, m’extraire un moment de la relative facilité de me remettre à mon compte en tant que développeur offrant sa lance au plus offrant pour imaginer d’autres possibles. Peut-être même plusieurs activités en&nbsp;parallèle&#8239;?</p>
  136. <p>Une des contraintes qu’il faut que je garde en tête c’est que je ne supporterais probablement plus la&nbsp;subordination…</p>
  137. <a href="#hr-181" title="Lien vers cette section de la page"><hr id="hr-181" /></a>
  138. <blockquote lang="en">
  139. <p>But I have this dream for barefoot developers that is like the barefoot&nbsp;doctor.</p>
  140. <p>These people are deeply embedded in their communities, so they understand the needs and problems of the people around&nbsp;them.</p>
  141. <p>So <mark>they are perfectly placed to solve local&nbsp;problems.</mark></p>
  142. <p>If given access to the right training and tools, they could provide the equivalent of basic healthcare, but instead, it’s basic software&nbsp;care.</p>
  143. <p>And they could become an unofficial, distributed, emergent public&nbsp;service.</p>
  144. <p><cite><em><a data-link-domain="maggieappleton.com" href="https://maggieappleton.com/home-cooked-software" hreflang="en"
  145. title="Consultation de l’article (anglais)">Home-Cooked Software and Barefoot Developers</a>
  146. <a href="/david/cache/2024/2076d04718bb00f7824155298c32c216/" hreflang="en"
  147. data-tippy data-description="The emerging golden age of home-cooked software, barefoot developers, and why the local-first community should help build it"
  148. data-source="https://maggieappleton.com/home-cooked-software"
  149. data-date="2024-06-09"
  150. data-favicon="https://maggieappleton.com/images/favicon/favicon.ico"
  151. data-domain="maggieappleton.com"
  152. ><svg xmlns="http://www.w3.org/2000/svg"
  153. width="24" height="24" viewBox="0 0 24 24" fill="none"
  154. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  155. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  156. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  157. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  158. </svg>
  159. <span class="sr-only">[archive]</span></a></em></cite></p>
  160. </blockquote>
  161. <p>En parlant de possibilités, cette intervention de Maggie Appleton est vraiment inspirante. Il y a des <abbr lang="en" title="Large Language Model">LLM</abbr> au milieu et il y a très certainement d’autres façons d’envisager des <em>barefoot developers</em>. Il y a beaucoup de personnes auxquelles il ne manquerait pas grand chose pour envisager un ordre de grandeur de plus en terme de littératie / écriture / création numérique. Comment devenir ce&nbsp;marche-pied&#8239;?</p>
  162. <a href="#hr-182" title="Lien vers cette section de la page"><hr id="hr-182" /></a>
  163. <blockquote>
  164. <p>Plus il est autonome (dans sa responsabilité au monde), moins il sera bloqué par ma lenteur du&nbsp;monde.</p>
  165. <p><cite><em><a data-link-domain="la-grange.net" href="https://www.la-grange.net/2024/04/15/pilea" hreflang="fr"
  166. title="Consultation de l’article">pilea - Carnets Web de La Grange</a>
  167. <a href="/david/cache/2024/b0a65aa568c958e4dae4f3aa1613ab6b/" hreflang="fr"
  168. data-tippy data-description=""
  169. data-source="https://www.la-grange.net/2024/04/15/pilea"
  170. data-date="2024-06-09"
  171. data-favicon="https://www.la-grange.net/favicon.ico"
  172. data-domain="la-grange.net"
  173. ><svg xmlns="http://www.w3.org/2000/svg"
  174. width="24" height="24" viewBox="0 0 24 24" fill="none"
  175. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  176. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  177. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  178. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  179. </svg>
  180. <span class="sr-only">[archive]</span></a></em></cite></p>
  181. </blockquote>
  182. <p>💚</p>
  183. <nav>
  184. <p>
  185. <a href="/david/2024/evolution/"
  186. title="Liste de tous les articles 2024 associés à cette étiquette"
  187. rel="tag">#évolution</a>
  188. <a href="/david/2024/processus/"
  189. title="Liste de tous les articles 2024 associés à cette étiquette"
  190. rel="tag">#processus</a>
  191. <a href="/david/2024/protopie/"
  192. title="Liste de tous les articles 2024 associés à cette étiquette"
  193. rel="tag">#protopie</a>
  194. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  195. </p>
  196. </nav>
  197. <h2>
  198. <a href="/david/2024/05/24/" title="Lien permanent vers cet article">Tout</a> <time datetime="2024-05-24">24 mai 2024</time>
  199. </h2>
  200. <blockquote lang="en">
  201. <p>We’re expected to do everything, keep up with everything, adapt to constant changes, and understand multiple conflicting architectural paradigms ranging from immediate mode rendering, to relational databases, to REST API designs, to both imperative and declarative programming, to complex state querying languages like GraphQL, to all of the various intricacies of how CSS handles&nbsp;rendering.</p>
  202. <p>We’re made <mark>to do all this while watching</mark> our peers lose their jobs, our employers savage society through pervasive surveillance and collaboration with authoritarian companies, and our data centres suck up the entire water supply for entire&nbsp;municipalities.</p>
  203. <p>No wonder we’re all fucked up emotionally and&nbsp;mentally.</p>
  204. <p><cite><em><a data-link-domain="baldurbjarnason.com" href="https://www.baldurbjarnason.com/2024/the-deskilling-of-web-dev-is-harming-us-all/" hreflang="en"
  205. title="Consultation de l’article (anglais)">The deskilling of web dev is harming the product but, more importantly, it’s damaging our health</a>
  206. <a href="/david/cache/2024/8672047b982b09475a59605ed0f9a011/" hreflang="en"
  207. data-tippy data-description="Even before the web developer job market became as dire as it is today, I was regularly seeing developers burn out and leave the industry. Some left for good; some only temporarily."
  208. data-source="https://www.baldurbjarnason.com/2024/the-deskilling-of-web-dev-is-harming-us-all/"
  209. data-date="2024-05-21"
  210. data-favicon="https://www.baldurbjarnason.com/dark-bird.svg"
  211. data-domain="baldurbjarnason.com"
  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. <p>J’aimerais bien papoter avec Baldur Bjarnason un jour. Et je sais que mon niveau d’anglais actuel ne me permettrait pas d’aborder ces sujets avec la subtilité qui le&nbsp;nécessite.</p>
  222. <a href="#hr-169" title="Lien vers cette section de la page"><hr id="hr-169" /></a>
  223. <blockquote lang="en">
  224. <p>My web experience was thus enlightenment and disempowerment. Opportunity and anxiety. Tears and&nbsp;joy.</p>
  225. <p>[…]</p>
  226. <p>My vision for the web over the next ten years is that <mark>we can turn that feeling of malaise,</mark> which I think is rooted in disempowerment, into a feeling that things can be&nbsp;different.</p>
  227. <p>No one person set off a light bulb in my mind that made me think I could have a personal website where I blog about all the things I find fun and interesting. Rather, it was seeing role models from all different backgrounds that made me think I could take more control of the web, and use the web as a platform not for consumption or creation for capital, but as a place of&nbsp;expression.</p>
  228. <p><cite><em><a data-link-domain="jamesg.blog" href="https://jamesg.blog/2024/05/19/next-web-decade/" hreflang="en"
  229. title="Consultation de l’article (anglais)">The next decade of the web</a>
  230. <a href="/david/cache/2024/50fb34a41d67e9468fce639e97fd62a3/" hreflang="en"
  231. data-tippy data-description="My experience on the web has been one of dualities."
  232. data-source="https://jamesg.blog/2024/05/19/next-web-decade/"
  233. data-date="2024-05-21"
  234. data-favicon="https://jamesg.blog/favicon.ico"
  235. data-domain="jamesg.blog"
  236. ><svg xmlns="http://www.w3.org/2000/svg"
  237. width="24" height="24" viewBox="0 0 24 24" fill="none"
  238. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  239. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  240. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  241. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  242. </svg>
  243. <span class="sr-only">[archive]</span></a></em></cite></p>
  244. </blockquote>
  245. <p>Un peu d’optimisme ne fait pas de&nbsp;mal.</p>
  246. <a href="#hr-170" title="Lien vers cette section de la page"><hr id="hr-170" /></a>
  247. <blockquote>
  248. <p>The best way to think of SLS is as a balding guy with a mullet: there are fireworks down below that are meant to distract you from a sad situation up&nbsp;top.</p>
  249. <p><cite><em><a data-link-domain="idlewords.com" href="https://idlewords.com/2024/5/the_lunacy_of_artemis.htm" hreflang=""
  250. title="Consultation de l’article">The Lunacy of Artemis (Idle Words)</a>
  251. <a href="/david/cache/2024/b1099381931e530393ab2740d48ae1ef/" hreflang=""
  252. data-tippy data-description="For the first time since the 1960's, it looks doubtful whether the US space agency is even capable of getting us to the Moon."
  253. data-source="https://idlewords.com/2024/5/the_lunacy_of_artemis.htm"
  254. data-date="2024-05-21"
  255. data-favicon=""
  256. data-domain="idlewords.com"
  257. ><svg xmlns="http://www.w3.org/2000/svg"
  258. width="24" height="24" viewBox="0 0 24 24" fill="none"
  259. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  260. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  261. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  262. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  263. </svg>
  264. <span class="sr-only">[archive]</span></a></em></cite></p>
  265. </blockquote>
  266. <p>Maciej Cegłowski, in style&nbsp;😂.</p>
  267. <p>Voir aussi&nbsp;: <a data-link-domain="idlewords.com" href="https://idlewords.com/2023/1/why_not_mars.htm" hreflang="en"
  268. title="Consultation de l’article (anglais)">Why Not Mars</a>
  269. <a href="/david/cache/2024/9dee199dbf71b1176eaac521e828693b/" hreflang="en"
  270. data-tippy data-description="It's slow, expensive, the engineering is mostly port-a-potty chemistry, and the best-case outcome is that thirty years from now we’ll get to watch someone remotely operate a soil scoop from Mars instead of Pasadena"
  271. data-source="https://idlewords.com/2023/1/why_not_mars.htm"
  272. data-date="2024-05-21"
  273. data-favicon=""
  274. data-domain="idlewords.com"
  275. ><svg xmlns="http://www.w3.org/2000/svg"
  276. width="24" height="24" viewBox="0 0 24 24" fill="none"
  277. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  278. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  279. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  280. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  281. </svg>
  282. <span class="sr-only">[archive]</span></a>.</p>
  283. <a href="#hr-171" title="Lien vers cette section de la page"><hr id="hr-171" /></a>
  284. <blockquote lang="en">
  285. <p>Rye said Apple’s response addressed the most depressing aspect of their research: That there was previously no way for anyone to opt out of this data&nbsp;collection.</p>
  286. <p>“You may not have Apple products, but if you have an access point and someone near you owns an Apple device, your BSSID will be in [Apple’s] database,” he said. “What’s important to note here is that <mark>every access point is being tracked, without opting in, whether they run an Apple device or not.</mark> Only after we disclosed this to Apple have they added the ability for people to opt&nbsp;out.”</p>
  287. <p><cite><em><a data-link-domain="krebsonsecurity.com" href="https://krebsonsecurity.com/2024/05/why-your-wi-fi-router-doubles-as-an-apple-airtag/" hreflang="en"
  288. title="Consultation de l’article (anglais)">Why Your Wi-Fi Router Doubles as an Apple AirTag</a>
  289. <a href="/david/cache/2024/34b4deffee5820ed20c6e57d6c0ee000/" hreflang="en"
  290. data-tippy data-description="Apple and the satellite-based broadband service Starlink each recently took steps to address new research into the potential security and privacy implications of how their services geo-locate devices. Researchers from the University of Maryland say they relied on publicly available…"
  291. data-source="https://krebsonsecurity.com/2024/05/why-your-wi-fi-router-doubles-as-an-apple-airtag/"
  292. data-date="2024-05-22"
  293. data-favicon="https://krebsonsecurity.com/favicon.ico"
  294. data-domain="krebsonsecurity.com"
  295. ><svg xmlns="http://www.w3.org/2000/svg"
  296. width="24" height="24" viewBox="0 0 24 24" fill="none"
  297. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  298. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  299. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  300. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  301. </svg>
  302. <span class="sr-only">[archive]</span></a></em></cite></p>
  303. </blockquote>
  304. <p>Le ver est dans la pomme depuis un peu trop longtemps à mon&nbsp;goût…</p>
  305. <p>Un <a data-link-domain="infosec.exchange" href="https://infosec.exchange/@briankrebs/112480004285401846">résumé sur masto</a>.</p>
  306. <a href="#hr-172" title="Lien vers cette section de la page"><hr id="hr-172" /></a>
  307. <blockquote lang="en">
  308. <p>Recall works by <mark>taking a screenshot of your active window every few seconds</mark>, recording everything you do in Windows for up to three months by&nbsp;default.</p>
  309. <p>These snapshots will be analyzed by the on-device Neural Processing Unit (NPU) and an AI model to extract data from the screenshot. The data will be saved in a semantic index, allowing Windows users to browse through the snapshot history or search using human language&nbsp;queries.</p>
  310. <p><cite><em><a data-link-domain="bleepingcomputer.com" href="https://www.bleepingcomputer.com/news/microsoft/microsofts-new-windows-11-recall-is-a-privacy-nightmare/" hreflang="en"
  311. title="Consultation de l’article (anglais)">Microsoft’s new Windows 11&nbsp;Recall is a privacy nightmare</a>
  312. <a href="/david/cache/2024/e1f6125fe416ecd26f2804cdab5cc571/" hreflang="en"
  313. data-tippy data-description="Microsoft&#039;s announcement of the new AI-powered Windows 11 Recall feature has sparked a lot of concern, with many thinking that it has created massive privacy risks and a new attack vector that threat actors can exploit to steal data."
  314. data-source="https://www.bleepingcomputer.com/news/microsoft/microsofts-new-windows-11-recall-is-a-privacy-nightmare/"
  315. data-date="2024-05-24"
  316. data-favicon="https://www.bleepstatic.com/favicon/bleeping.ico"
  317. data-domain="bleepingcomputer.com"
  318. ><svg xmlns="http://www.w3.org/2000/svg"
  319. width="24" height="24" viewBox="0 0 24 24" fill="none"
  320. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  321. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  322. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  323. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  324. </svg>
  325. <span class="sr-only">[archive]</span></a></em></cite></p>
  326. </blockquote>
  327. <p>C’est la porte ouverte à toute les fenêtres, Windows Unlimited eut été un meilleur nom. 🤡</p>
  328. <a href="#hr-173" title="Lien vers cette section de la page"><hr id="hr-173" /></a>
  329. <blockquote lang="en">
  330. <p>Russian troops in Ukraine are using thousands of Starlink satellite communications terminals made by Elon Musk’s SpaceX, the Ukrainian military intelligence chief told the Wall Street Journal in an interview published on&nbsp;Thursday.</p>
  331. <p>Lieutenant General Kyrylo Budanov said that <mark>Russian troops have been communicating over the Starlink system “for quite a long time”</mark> and acquired the terminals from private Russian firms that purchased them from&nbsp;intermediaries.</p>
  332. <p><cite><em><a data-link-domain="reuters.com" href="https://www.reuters.com/world/europe/russia-using-thousands-spacex-starlink-terminals-ukraine-wsj-says-2024-02-15/" hreflang="en"
  333. title="Consultation de l’article (anglais)">Russia using thousands of SpaceX Starlink terminals in Ukraine, WSJ says</a>
  334. <a href="/david/cache/2024/664e0f4028089315e2fa0be1c8c70300/" hreflang="en"
  335. data-tippy data-description="The Russian Embassy and SpaceX did not respond immediately to requests for comment."
  336. data-source="https://www.reuters.com/world/europe/russia-using-thousands-spacex-starlink-terminals-ukraine-wsj-says-2024-02-15/"
  337. data-date="2024-05-22"
  338. data-favicon="https://www.reuters.com/favicon.ico"
  339. data-domain="reuters.com"
  340. ><svg xmlns="http://www.w3.org/2000/svg"
  341. width="24" height="24" viewBox="0 0 24 24" fill="none"
  342. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  343. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  344. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  345. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  346. </svg>
  347. <span class="sr-only">[archive]</span></a></em></cite></p>
  348. </blockquote>
  349. <p>Neutralité du net vs. héroïsation des fournisseurs d’accès à&nbsp;internet.</p>
  350. <a href="#hr-174" title="Lien vers cette section de la page"><hr id="hr-174" /></a>
  351. <blockquote lang="en">
  352. <p>This leads us straight back to the original conversation about “Man or Bear,” which has nothing to do with bears. (Sorry, bears!) <mark>“Would you rather be stuck in a forest with a man or a bear?” is just another way of asking, “Are you afraid of men?”</mark> It’s the same question I’ve been fielding for the entirety of my life as a solo female traveler. It’s the same question that hovers over women all the time as we move through the&nbsp;world.</p>
  353. <p>And it’s a question that’s always been difficult for me to answer. I’m not afraid of all men. But I am afraid of some men. The real problem is the gray area in between and what it takes to manage the murkiness of that&nbsp;unknown.</p>
  354. <p><cite><em><a data-link-domain="bikepacking.com" href="https://bikepacking.com/plog/man-or-bear-debate/" hreflang="en"
  355. title="Consultation de l’article (anglais)">A Woman Who Left Society to Live With Bears Weighs in on “Man or Bear”</a>
  356. <a href="/david/cache/2024/cba1417ac2338abde14bb06d0a1f505d/" hreflang="en"
  357. data-tippy data-description="In this piece, long-term bicycle traveler Laura Killingbeck reflects on the Man or Bear debate and adds her unique perspective..."
  358. data-source="https://bikepacking.com/plog/man-or-bear-debate/"
  359. data-date="2024-05-24"
  360. data-favicon="https://bikepacking.com/icon.svg?v=2"
  361. data-domain="bikepacking.com"
  362. ><svg xmlns="http://www.w3.org/2000/svg"
  363. width="24" height="24" viewBox="0 0 24 24" fill="none"
  364. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  365. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  366. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  367. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  368. </svg>
  369. <span class="sr-only">[archive]</span></a></em></cite></p>
  370. </blockquote>
  371. <p>En tant qu’homme qui peut croiser des hommes et des ours dans la forêt, j’ai déjà plus peur de croiser un homme. Je n’imagine même pas en tant que&nbsp;femme.</p>
  372. <p>À mon niveau, lorsque je croise une femme seule dans la forêt (très rare, mais ça arrive), j’essaye de rester à bonne distance en ayant l’attitude que j’aurais vis-à-vis… d’un&nbsp;ours.</p>
  373. <blockquote lang="en">
  374. <p>As I listened to his laughter, a visceral understanding rose from my stomach and landed in my brain. In that moment I knew something that I could no longer prevent myself from knowing. That the person I loved got bigger when I got smaller. That he could not stop bringing me down, because bringing me down was what brought him&nbsp;up.</p>
  375. <p><cite><em><a data-link-domain="bicycling.com" href="https://www.bicycling.com/rides/a34466128/search-for-the-wild-reindeer/" hreflang="en"
  376. title="Consultation de l’article (anglais)">In Search of the Wild Reindeer</a>
  377. <a href="/david/cache/2024/49b61c702d03a23ba3e0801bdaa3cb07/" hreflang="en"
  378. data-tippy data-description="When her life fell apart, Laura Killingbeck went on an epic bike journey to find wild reindeer in Labrador."
  379. data-source="https://www.bicycling.com/rides/a34466128/search-for-the-wild-reindeer/"
  380. data-date="2024-05-24"
  381. data-favicon="https://www.bicycling.com/_assets/design-tokens/bicycling/static/images/favicon.94f0fb3.ico"
  382. data-domain="bicycling.com"
  383. ><svg xmlns="http://www.w3.org/2000/svg"
  384. width="24" height="24" viewBox="0 0 24 24" fill="none"
  385. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  386. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  387. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  388. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  389. </svg>
  390. <span class="sr-only">[archive]</span></a></em></cite></p>
  391. </blockquote>
  392. <p>😭</p>
  393. <nav>
  394. <p>
  395. <a href="/david/2024/evolution/"
  396. title="Liste de tous les articles 2024 associés à cette étiquette"
  397. rel="tag">#évolution</a>
  398. <a href="/david/2024/liens/"
  399. title="Liste de tous les articles 2024 associés à cette étiquette"
  400. rel="tag">#liens</a>
  401. <a href="/david/2024/web/"
  402. title="Liste de tous les articles 2024 associés à cette étiquette"
  403. rel="tag">#web</a>
  404. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  405. </p>
  406. </nav>
  407. <h2>
  408. <a href="/david/2024/03/18/" title="Lien permanent vers cet article">Casquettes</a> <time datetime="2024-03-18">18 mars 2024</time>
  409. </h2>
  410. <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>
  411. <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>
  412. <a href="#hr-121" title="Lien vers cette section de la page"><hr id="hr-121" /></a>
  413. <blockquote lang="en">
  414. <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>
  415. <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"
  416. title="Consultation de l’article (anglais)">The most important goal in designing software is understandability</a>
  417. <a href="/david/cache/2024/f154db1b6eccf69f498b4a31980367bd/" hreflang="en"
  418. data-tippy data-description="When you're designing a piece of software, the single most important thing to design for is understandability."
  419. data-source="https://ntietz.com/blog/the-most-important-goal-in-designing-software-is-understandability/"
  420. data-date="2024-03-18"
  421. data-favicon="https://ntietz.com/favicon-32x32.png"
  422. data-domain="ntietz.com"
  423. ><svg xmlns="http://www.w3.org/2000/svg"
  424. width="24" height="24" viewBox="0 0 24 24" fill="none"
  425. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  426. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  427. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  428. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  429. </svg>
  430. <span class="sr-only">[archive]</span></a></em></cite></p>
  431. </blockquote>
  432. <a href="#hr-122" title="Lien vers cette section de la page"><hr id="hr-122" /></a>
  433. <blockquote lang="en">
  434. <p>Open Source is rewarding- but it can also be&nbsp;exhausting.</p>
  435. <p>The linking project’s code is provided as-is, and is not actively&nbsp;maintained.</p>
  436. <p><cite><em><a data-link-domain="unmaintained.tech" href="https://unmaintained.tech/" hreflang="en"
  437. title="Consultation de l’article (anglais)">No Maintenance Intended</a>
  438. <a href="/david/cache/2024/590887213b24404c8d1e8355127ce2e2/" hreflang="en"
  439. data-tippy data-description="The linking project’s code is provided as-is, and is not actively maintained."
  440. data-source="https://unmaintained.tech/"
  441. data-date="2024-03-18"
  442. data-favicon=""
  443. data-domain="unmaintained.tech"
  444. ><svg xmlns="http://www.w3.org/2000/svg"
  445. width="24" height="24" viewBox="0 0 24 24" fill="none"
  446. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  447. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  448. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  449. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  450. </svg>
  451. <span class="sr-only">[archive]</span></a></em></cite></p>
  452. </blockquote>
  453. <nav>
  454. <p>
  455. <a href="/david/2024/adaptation/"
  456. title="Liste de tous les articles 2024 associés à cette étiquette"
  457. rel="tag">#adaptation</a>
  458. <a href="/david/2024/addiction/"
  459. title="Liste de tous les articles 2024 associés à cette étiquette"
  460. rel="tag">#addiction</a>
  461. <a href="/david/2024/evolution/"
  462. title="Liste de tous les articles 2024 associés à cette étiquette"
  463. rel="tag">#évolution</a>
  464. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  465. </p>
  466. </nav>
  467. <h2>
  468. <a href="/david/2024/03/09/" title="Lien permanent vers cet article">Marque</a> <time datetime="2024-03-09">9 mars 2024</time>
  469. </h2>
  470. <blockquote lang="en">
  471. <p><mark>Removing the brand from the person</mark> is all but straightforward. I now start my about page with a quick way to introduce myself by putting forward some of my values. […] Beside saying <em>people</em> instead of <em>users</em>, stop considering who’s reading my stuff as <em>audience</em>, and quit referring to what I do as <em>content</em>, I want to modify a few more&nbsp;behaviours:</p>
  472. <ul>
  473. <li>Quit mentioning well-known bloggers on a first-name basis. […]</li>
  474. <li>Keep writing about different things. […]</li>
  475. <li>Don’t quote so-called thought leaders&nbsp;[…]</li>
  476. <li>Stop sugar-coating concepts&nbsp;[…]</li>
  477. </ul>
  478. <p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/" hreflang="en"
  479. title="Consultation de l’article (anglais)">A Kafkaesque digital relationship with ourselves</a>
  480. <a href="/david/cache/2024/34590090e8c8ea82be14fcc3dd7b734c/" hreflang="en"
  481. data-tippy data-description="Words are crucial to build a sense of online community, however many of us have been using them straight out of a soulless corporate lingo in order to sell ourselves as a product."
  482. data-source="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/"
  483. data-date="2024-03-09"
  484. data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg"
  485. data-domain="minutestomidnight.co.uk"
  486. ><svg xmlns="http://www.w3.org/2000/svg"
  487. width="24" height="24" viewBox="0 0 24 24" fill="none"
  488. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  489. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  490. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  491. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  492. </svg>
  493. <span class="sr-only">[archive]</span></a></em></cite></p>
  494. </blockquote>
  495. <p>Réflexion du jour sur le vocabulaire qui évolue pour se présenter sur le Web. Je suis souvent intrigué par les biographies et textes de présentation sur mastodon qui sont à la fois singuliers tout en respectant des codes (micro-)culturels. Peut-être que l’on a besoin de se sentir dans un cadre de représentation connu pour se sentir exister dans une&nbsp;communauté.</p>
  496. <p>Le même auteur, en&nbsp;2002(!)&nbsp;:</p>
  497. <blockquote lang="en">
  498. <p>Five years ago there was all this buzz about <em>virtual communities</em>. How did that go? I have no idea, all I know is that everything revolves around who’s the hottest blogger right now. They talk about themselves, reference each other, all anxious about who has the most comments or the longest and most prestigious blogroll. Compared to that, <mark>my online journal is pure mental masturbation, but at least I have the occasional good photo and such nice&nbsp;typography.</mark></p>
  499. <p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/years-just-pass-by/" hreflang="en"
  500. title="Consultation de l’article (anglais)">Years just pass by</a>
  501. <a href="/david/cache/2024/4f003de8f8531a4aaf121ecf6c21ae66/" hreflang="en"
  502. data-tippy data-description="The desire to be part of a community of bloggers hits the harsh reality of how humans want thought leaders who appear to be successful."
  503. data-source="https://minutestomidnight.co.uk/blog/years-just-pass-by/"
  504. data-date="2024-03-09"
  505. data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg"
  506. data-domain="minutestomidnight.co.uk"
  507. ><svg xmlns="http://www.w3.org/2000/svg"
  508. width="24" height="24" viewBox="0 0 24 24" fill="none"
  509. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  510. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  511. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  512. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  513. </svg>
  514. <span class="sr-only">[archive]</span></a></em></cite></p>
  515. </blockquote>
  516. <a href="#hr-106" title="Lien vers cette section de la page"><hr id="hr-106" /></a>
  517. <pre><code>body:has(time[datetime]) li {
  518. list-style-type: &quot;❧ &quot;;
  519. }
  520. body:has(
  521. time[datetime^=&quot;2024-01&quot;],
  522. time[datetime^=&quot;2024-02&quot;],
  523. time[datetime^=&quot;2024-03&quot;]
  524. ) li {
  525. list-style-type: &quot;❆ &quot;;
  526. }
  527. body:has(
  528. time[datetime^=&quot;2024-04&quot;],
  529. time[datetime^=&quot;2024-05&quot;],
  530. time[datetime^=&quot;2024-06&quot;]
  531. ) li {
  532. list-style-type: &quot;❁ &quot;;
  533. }
  534. body:has(
  535. time[datetime^=&quot;2024-07&quot;],
  536. time[datetime^=&quot;2024-08&quot;],
  537. time[datetime^=&quot;2024-09&quot;]
  538. ) li {
  539. list-style-type: &quot;❂ &quot;;
  540. }
  541. </code></pre>
  542. <p>J’avais envie d’introduire une légère saisonnalité dans mes listes à puces. Surtout une <a href="/david/2024/03/07/#hr-102">autre excuse</a> pour jouer avec <code>:has()</code>. Je lis un peu trop de blogs qui manquent de fantaisie. Et puis il&nbsp;pleut…</p>
  543. <a href="#hr-107" title="Lien vers cette section de la page"><hr id="hr-107" /></a>
  544. <p>Chant du cardinal<br />
  545. Le matin s’éveille sans toi<br />
  546. Lovée dans mes&nbsp;bras</p>
  547. <nav>
  548. <p>
  549. <a href="/david/2024/evolution/"
  550. title="Liste de tous les articles 2024 associés à cette étiquette"
  551. rel="tag">#évolution</a>
  552. <a href="/david/2024/identite/"
  553. title="Liste de tous les articles 2024 associés à cette étiquette"
  554. rel="tag">#identité</a>
  555. <a href="/david/2024/poesie/"
  556. title="Liste de tous les articles 2024 associés à cette étiquette"
  557. rel="tag">#poésie</a>
  558. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  559. </p>
  560. </nav>
  561. <h2>
  562. <a href="/david/2024/03/01/" title="Lien permanent vers cet article">Simple</a> <time datetime="2024-03-01">1 mars 2024</time>
  563. </h2>
  564. <blockquote lang="en">
  565. <p>We can bring that into RSS by treating any interaction as content. If you post something, thats an entry in your feed (as before). If you comment on something, thats also an entry in your feed. If you like something, thats another entry in your feed. If you follow someone (which would mean subscribing to some RSS feed), thats also another entry in your feed. To mark that interactive nature of some feed entry, <mark>we can simple extend RSS a&nbsp;bit</mark></p>
  566. <p><cite><em><a data-link-domain="gist.github.com" href="https://gist.github.com/loreanvictor/bddd8824c744024d338e935bd7e96707" hreflang="en"
  567. title="Consultation de l’article (anglais)">Interaction as Content</a>
  568. <a href="/david/cache/2024/e401917f8e9785285afed817e5344443/" hreflang="en"
  569. data-tippy data-description="Interaction as Content. GitHub Gist: instantly share code, notes, and snippets."
  570. data-source="https://gist.github.com/loreanvictor/bddd8824c744024d338e935bd7e96707"
  571. data-date="2024-03-01"
  572. data-favicon="https://github.githubassets.com/favicons/favicon.png"
  573. data-domain="gist.github.com"
  574. ><svg xmlns="http://www.w3.org/2000/svg"
  575. width="24" height="24" viewBox="0 0 24 24" fill="none"
  576. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  577. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  578. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  579. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  580. </svg>
  581. <span class="sr-only">[archive]</span></a></em></cite></p>
  582. </blockquote>
  583. <p>Tout est dans le <q lang="en">simple</q>&nbsp;🙃.</p>
  584. <p>Rédiger une spécification comme <a data-link-domain="en.wikipedia.org" href="https://en.wikipedia.org/wiki/Media_RSS">Media RSS</a> n’est déjà pas trivial mais alors faire en sorte que cela soit adopté et devienne un standard c’est une autre paire de&nbsp;manches.</p>
  585. <blockquote lang="en">
  586. <p>RSS originated in 1999, and has strived to be a simple, easy to understand format, with relatively modest goals. After it became a popular format, <mark>developers wanted to extend it</mark> using modules defined in namespaces, as specified by the&nbsp;W3C.</p>
  587. <p>RSS 2.0&nbsp;adds that capability, following a simple rule. A RSS feed may contain elements and attributes not described on this page, only if those elements and attributes are defined in a&nbsp;namespace.</p>
  588. <p><cite><em><a data-link-domain="rssboard.org" href="https://www.rssboard.org/rss-specification#extendingRss" hreflang="en"
  589. title="Consultation de l’article (anglais)">RSS 2.0&nbsp;Specification</a>
  590. <a href="/david/cache/2024/85b765a918ef094a5a2dd13a1ff5dd7d/" hreflang="en"
  591. data-tippy data-description="The current version of the RSS 2.0 specification (2.0.11), published on March 30, 2009."
  592. data-source="https://www.rssboard.org/rss-specification#extendingRss"
  593. data-date="2024-03-01"
  594. data-favicon="https://www.rssboard.org/favicon.ico"
  595. data-domain="rssboard.org"
  596. ><svg xmlns="http://www.w3.org/2000/svg"
  597. width="24" height="24" viewBox="0 0 24 24" fill="none"
  598. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  599. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  600. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  601. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  602. </svg>
  603. <span class="sr-only">[archive]</span></a></em></cite></p>
  604. </blockquote>
  605. <p>Beaucoup de personnes ont envie de faire davantage avec RSS, c’est la diffusion à une échelle non anecdotique qui est difficile. Peut-être qu’un acteur comme Mastodon pourrait peser dans la balance d’une telle&nbsp;initiative.</p>
  606. <blockquote lang="en">
  607. <p>Another feature area I would think about is interactivity. I’m fascinated with Google’s work in Gmail around “Inbox Actions” – basically the one-click buttons to perform an email action like RSVP, or reviewing a bug. Here’s an explainer with some&nbsp;examples.</p>
  608. <p>Let’s call it Feed Actions. <mark>Feed Actions could also be an RSS&nbsp;extension.</mark></p>
  609. <p><cite><em><a data-link-domain="interconnected.org" href="https://interconnected.org/home/2021/05/26/chrome_and_rss" hreflang="en"
  610. title="Consultation de l’article (anglais)">Three requests for the Google Chrome team as they experiment with RSS</a>
  611. <a href="/david/cache/2024/4a9c4c407b34c40ec5b3783ac5f274a7/" hreflang="en"
  612. data-tippy data-description="Posted on Wednesday 26 May 2021. 976 words, 11 links. By Matt Webb."
  613. data-source="https://interconnected.org/home/2021/05/26/chrome_and_rss"
  614. data-date="2024-03-01"
  615. data-favicon=""
  616. data-domain="interconnected.org"
  617. ><svg xmlns="http://www.w3.org/2000/svg"
  618. width="24" height="24" viewBox="0 0 24 24" fill="none"
  619. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  620. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  621. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  622. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  623. </svg>
  624. <span class="sr-only">[archive]</span></a></em></cite></p>
  625. </blockquote>
  626. <p>J’ai deux communautés dans lesquelles c’est même devenu un <em>running gag</em> de créer un outil qui explorerait de nouvelles&nbsp;possibilités.</p>
  627. <p><a href="/david/2021/05/26/">Suivez-moi</a> et vous n’aurez plus jamais faim&#8239;! Gniarkgniarkgniark&nbsp;🦁⚡️</p>
  628. <nav>
  629. <p>
  630. <a href="/david/2024/evolution/"
  631. title="Liste de tous les articles 2024 associés à cette étiquette"
  632. rel="tag">#évolution</a>
  633. <a href="/david/2024/laboratoire/"
  634. title="Liste de tous les articles 2024 associés à cette étiquette"
  635. rel="tag">#laboratoire</a>
  636. <a href="/david/2024/web/"
  637. title="Liste de tous les articles 2024 associés à cette étiquette"
  638. rel="tag">#web</a>
  639. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  640. </p>
  641. </nav>
  642. <h2>
  643. <a href="/david/2024/02/08/" title="Lien permanent vers cet article">Écoute</a> <time datetime="2024-02-08">8 février 2024</time>
  644. </h2>
  645. <blockquote>
  646. <p>Ceci est tellement vrai que nous sommes seuls au monde dans la communication que, lorsque quelqu’un écoute et lorsque la communication réussit, c’est un miracle étincelant. […] C’est tellement rare, c’est tellement improbable, c’est tellement miraculeux que c’est peut-être ça la civilisation et la culture. <mark>Rencontrer quelqu’un qui&nbsp;écoute.</mark></p>
  647. <p><cite><em>Le Bonheur possible</em>, Michel Serres&nbsp;(1997)</cite></p>
  648. </blockquote>
  649. <p>Exercice de mise en forme des <a href="/david/2024/02/02/" title="Valeurs">valeurs</a> émergeantes des valeurs de Scopyleft aujourd’hui. Je suis content d’y reconnaître chaque personne et <em>en même temps</em> un collectif qui se découvre et qui apprend à faire ensemble. Avoir 8&nbsp;valeurs qui se démarquent dans 3&nbsp;contextes différents me donne davantage d’information et d’envie qu’une poignée affichée sur un site web. Un maillage de compréhension réciproque est en train d’être tissé entre&nbsp;nous.</p>
  650. <blockquote>
  651. <p>Ce besoin de venir (re)questionner la manière de faire ensemble est nécessaire à ces collectifs. Ce n’est pas dans l’objectif d’un travail évaluatif des bonnes ou mauvaises pratiques, mais bien dans un désir d’entretenir la flamme collective. Ces collectifs ont besoin de se questionner sans cesse sur leurs pratiques. Sur les raisons qui les poussent à faire ensemble. Sans quoi, l’activité du groupe piétine et ses membres peuvent se dégager du projet commun. C’est une manière de redonner de l’élan et de la motivation au collectif. Ce besoin de se redire&nbsp;: «&nbsp;pourquoi nous sommes-nous mis ensemble et où voulions-nous&nbsp;aller&#8239;?&nbsp;»</p>
  652. <p><cite><em><a data-link-domain="blog.notmyidea.org" href="https://blog.notmyidea.org/lart-de-conter-nos-experiences-collectives.html" hreflang="fr"
  653. title="Consultation de l’article">L’art de conter nos expériences collectives</a>
  654. <a href="/david/cache/2024/bd0c3ccce5c3f229f84c6c132ebdaca9/" hreflang="fr"
  655. data-tippy data-description="Faire récit à l'heure du storytelling par Benjamin Roux"
  656. data-source="https://blog.notmyidea.org/lart-de-conter-nos-experiences-collectives.html"
  657. data-date="2024-02-08"
  658. data-favicon=""
  659. data-domain="blog.notmyidea.org"
  660. ><svg xmlns="http://www.w3.org/2000/svg"
  661. width="24" height="24" viewBox="0 0 24 24" fill="none"
  662. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  663. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  664. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  665. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  666. </svg>
  667. <span class="sr-only">[archive]</span></a></em></cite></p>
  668. </blockquote>
  669. <nav>
  670. <p>
  671. <a href="/david/2024/apprentissage/"
  672. title="Liste de tous les articles 2024 associés à cette étiquette"
  673. rel="tag">#apprentissage</a>
  674. <a href="/david/2024/equipe/"
  675. title="Liste de tous les articles 2024 associés à cette étiquette"
  676. rel="tag">#équipe</a>
  677. <a href="/david/2024/evolution/"
  678. title="Liste de tous les articles 2024 associés à cette étiquette"
  679. rel="tag">#évolution</a>
  680. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  681. </p>
  682. </nav>
  683. <h2>
  684. <a href="/david/2024/02/01/" title="Lien permanent vers cet article">Vision</a> <time datetime="2024-02-01">1 février 2024</time>
  685. </h2>
  686. <blockquote lang="en">
  687. <p>But if you were to try just one thing using Vision Pro — just one thing — it has to be <mark>watching a movie</mark> in the TV app, in theater mode. Try that, and no matter how skeptical you were beforehand about the Vision Pro’s price tag, your hand will start inching toward your&nbsp;wallet.</p>
  688. <p><cite><em><a data-link-domain="daringfireball.net" href="https://daringfireball.net/2024/01/the_vision_pro" hreflang="en"
  689. title="Consultation de l’article (anglais)">Daring Fireball: The Vision Pro</a>
  690. <a href="/david/cache/2024/cd9184008ba5d9e4c9be4d0a0eea4f60/" hreflang="en"
  691. data-tippy data-description="A headset, a spatial productivity platform, and a personal entertainment device."
  692. data-source="https://daringfireball.net/2024/01/the_vision_pro"
  693. data-date="2024-01-31"
  694. data-favicon="https://daringfireball.net/graphics/favicon.ico?v=005"
  695. data-domain="daringfireball.net"
  696. ><svg xmlns="http://www.w3.org/2000/svg"
  697. width="24" height="24" viewBox="0 0 24 24" fill="none"
  698. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  699. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  700. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  701. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  702. </svg>
  703. <span class="sr-only">[archive]</span></a></em></cite></p>
  704. </blockquote>
  705. <p>Ce jouet est bien trop cher… et c’est une bonne chose. D’une certaine manière, c’est la seule innovation de 2023&nbsp;qui ne comporte pas IA dans le premier écran marketing, c’est déjà pas mal. Je n’ai pas la naïveté de penser que la version 2&nbsp;ne nous amènera pas vers le <em>SpatIAl Computing</em> pour autant, restons&nbsp;sérieux.</p>
  706. <p>Je peux imaginer des des <a data-link-domain="theinfiniteexperience.world" href="https://theinfiniteexperience.world">expériences immersives</a> dans des endroits dédiés, de la location comme on pouvait louer un DVD il y a des années, des salles dédiées en bibliothèques (ambiance dystopie cyberpunk assurée), à un moment il pourrait même y avoir un espace pour ça (payant&#8239;?) dans les <em>Apple Store</em>. Si le son est aussi bon que ce que peut décrire <em>Daring Fanboy</em>, j’aurais vraiment envie de me retrouver au milieu d’un concert, d’avoir le choix entre plusieurs points de vues et&nbsp;acoustiques.</p>
  707. <p>Le côté immersif aurait aussi sa place en terme d’apprentissage / transmission. Être au premier rang d’une conférence ou d’un cours pourrait permettre de redéfinir son attention&nbsp;(?) et sachant que la dernière version de l’iPhone permet de capter de telles vidéos, c’est peut-être un moyen de faire entrer quelqu’un dans son salon ce qui produirait un autre type&nbsp;d’intimité.</p>
  708. <p>En parlant de captation et d’intimité, avec les <em>deepfakes</em> il devient possible de se retrouver dans un salon mais dans une autre tenue. Toute prise de vidéo devient une menace potentielle. Impossible de ne pas penser à des objets connectés / synchronisés autour de la&nbsp;pornographie…</p>
  709. <a href="#hr-59" title="Lien vers cette section de la page"><hr id="hr-59" /></a>
  710. <blockquote lang="en">
  711. <p>The “i” in iPhone stands for “inequality”. […]</p>
  712. <p><mark>iPhone owners live in a different world</mark> than high-end Android buyers, and light-years away what the bulk of the market experiences. No matter how you slice it, the performance inequality gap is growing for CPU-bound workloads like JavaScript-heavy web&nbsp;apps.</p>
  713. <p><cite><em><a data-link-domain="infrequently.org" href="https://infrequently.org/2024/01/performance-inequality-gap-2024/" hreflang="en"
  714. title="Consultation de l’article (anglais)">The Performance Inequality Gap, 2024</a>
  715. <a href="/david/cache/2024/0676c7ccf1ab2b380641866789366d26/" hreflang="en"
  716. data-tippy data-description="How much HTML, CSS, and JavaScript can we afford? More than in years past, but much less than frontend developers are burdening users with."
  717. data-source="https://infrequently.org/2024/01/performance-inequality-gap-2024/"
  718. data-date="2024-01-31"
  719. data-favicon="https://infrequently.org/assets/images/favicons/ino-dark-opt-192x192.png"
  720. data-domain="infrequently.org"
  721. ><svg xmlns="http://www.w3.org/2000/svg"
  722. width="24" height="24" viewBox="0 0 24 24" fill="none"
  723. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  724. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  725. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  726. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  727. </svg>
  728. <span class="sr-only">[archive]</span></a></em></cite></p>
  729. </blockquote>
  730. <p>Ce rapport me rappelle que la notion d’accessibilité est très vaste. Et je suis mal placé pour donner des leçons en vous faisant charger 5&nbsp;polices de caractères pour vous afficher une page… je n’ai pas encore travaillé les performances du thème de l’année et c’est une&nbsp;erreur.</p>
  731. <blockquote lang="en">
  732. <p>We got to a place where performance has been a constant problem in large part because a tribe of programmers convinced themselves that it <em>wasn’t</em> and <em>wouldn’t be</em>. […]</p>
  733. <p>But tribalism-boosted confirmation bias mixed with JavaScript’s toxic positivity culture to precipitate out a Silicon Prosperity Gospel; all resources would go infinite if you just <em>believed</em>. […]</p>
  734. <p>The solutions are social, not technical, because <mark>the delusions are social,</mark> rather than&nbsp;technical.</p>
  735. <p><cite><em>Ibid.</em></cite></p>
  736. </blockquote>
  737. <p>Ça&nbsp;pique.</p>
  738. <a href="#hr-60" title="Lien vers cette section de la page"><hr id="hr-60" /></a>
  739. <blockquote lang="en">
  740. <p>Rather, the biggest benefits I see are <em>collective</em>, cutting across the industry as a whole. I think web components can make the entire web more accessible. They have the potential to unify currently fragmented communities, including various JavaScript frameworks <em>and</em> <mark>those who avoid them</mark>.</p>
  741. <p>[…] Web components won’t take web development by storm, or show us the One True Way to build websites. They don’t need to dethrone JavaScript frameworks. We probably won’t even all learn how to write&nbsp;them!</p>
  742. <p><cite><em><a data-link-domain="jakelazaroff.com" href="https://jakelazaroff.com/words/the-web-component-success-story/" hreflang="en"
  743. title="Consultation de l’article (anglais)">The Web Component Success Story</a>
  744. <a href="/david/cache/2024/f4d2d42eba58062be910407690ae447c/" hreflang="en"
  745. data-tippy data-description="Web components won't take web development by storm, or show us the One True Way to build websites. What they will do is let us collectively build a rich ecosystem of dynamic components that work with any web stack."
  746. data-source="https://jakelazaroff.com/words/the-web-component-success-story/"
  747. data-date="2024-01-31"
  748. data-favicon="https://jakelazaroff.com/favicon.ico"
  749. data-domain="jakelazaroff.com"
  750. ><svg xmlns="http://www.w3.org/2000/svg"
  751. width="24" height="24" viewBox="0 0 24 24" fill="none"
  752. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  753. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  754. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  755. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  756. </svg>
  757. <span class="sr-only">[archive]</span></a></em></cite></p>
  758. </blockquote>
  759. <p>Très bon article et la boite de prévisualisation au survol de chaque lien ressemble beaucoup à ce que j’avais l’intention de faire pour régler mes soucis d’accès à la version archivée tout en affichant le domaine. Actuellement chaque lien devient trop long et hache le texte lorsque ça n’est pas en pied de citation (et encore). Il faut que je creuse comment cela est fait, via un <em>web component</em> réutilisable&nbsp;j’imagine&nbsp;:-).</p>
  760. <p>PS&nbsp;: si vous minifiez votre JavaScript, les <a data-link-domain="MDN" href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/SourceMap">SourceMap</a> sont un moyen de partager votre expérience. Sinon l’aspect <q lang="en">collective</q> est beaucoup moins&nbsp;pertinent.</p>
  761. <nav>
  762. <p>
  763. <a href="/david/2024/accessibilite/"
  764. title="Liste de tous les articles 2024 associés à cette étiquette"
  765. rel="tag">#accessibilité</a>
  766. <a href="/david/2024/dystopie/"
  767. title="Liste de tous les articles 2024 associés à cette étiquette"
  768. rel="tag">#dystopie</a>
  769. <a href="/david/2024/evolution/"
  770. title="Liste de tous les articles 2024 associés à cette étiquette"
  771. rel="tag">#évolution</a>
  772. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  773. </p>
  774. </nav>
  775. <h2>
  776. <a href="/david/2024/01/20/" title="Lien permanent vers cet article">Extinction</a> <time datetime="2024-01-20">20 janvier 2024</time>
  777. </h2>
  778. <blockquote lang="en">
  779. <p>So where have all the websites gone? Well, the people who make them have all gone to war for the capitalist machine. They grew up and got jobs. A natural part of growing up. Silos came and plucked their voices. Invasive memes and short form content grew in their place. Hustle overtook leisure. Harassment overtook openness. Influence overtook creativity. An economy of interestingness replaced by one of followers, likes, and engagement&nbsp;metrics.</p>
  780. <p>One important thing to note; <mark>websites aren’t extinct.</mark> In fact, you’re on one now! Uploading your own words is ancient technology but still&nbsp;works.</p>
  781. <p><cite><em><a data-link-domain="daverupert.com" href="https://daverupert.com/2024/01/where-have-all-the-websites-gone/" hreflang="en"
  782. title="Consultation de l’article (anglais)">Where have all the flowers gone?</a>
  783. <a href="/david/cache/2024/7136e0810bfa42c4a9ca798a55cd2d53/" hreflang="en"
  784. data-tippy data-description="A post from Jason Velazquez called “Where have all the websites gone?” crossed my socials. It’s a good lament about the dearth of interesting content on the internet and how we’re stuck in the same boring content silos."
  785. data-source="https://daverupert.com/2024/01/where-have-all-the-websites-gone/"
  786. data-date="2024-01-19"
  787. data-favicon="https://daverupert.com/favicon.ico"
  788. data-domain="daverupert.com"
  789. ><svg xmlns="http://www.w3.org/2000/svg"
  790. width="24" height="24" viewBox="0 0 24 24" fill="none"
  791. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  792. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  793. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  794. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  795. </svg>
  796. <span class="sr-only">[archive]</span></a></em></cite></p>
  797. </blockquote>
  798. <p>En réponse à <q lang="en"><a data-link-domain="fromjason.xyz" href="https://www.fromjason.xyz/p/notebook/where-have-all-the-websites-gone/" hreflang="en"
  799. title="Consultation de l’article (anglais)">Where have all the websites gone?</a>
  800. <a href="/david/cache/2024/c3272392d462da90874d32841e5caac8/" hreflang="en"
  801. data-tippy data-description="It feels like all the cool websites from the late 2000s are gone. But maybe we are looking at this the wrong way. Maybe it is us who vanished."
  802. data-source="https://www.fromjason.xyz/p/notebook/where-have-all-the-websites-gone/"
  803. data-date="2024-01-09"
  804. data-favicon="https://www.fromjason.xyz/img/favicon.png"
  805. data-domain="fromjason.xyz"
  806. ><svg xmlns="http://www.w3.org/2000/svg"
  807. width="24" height="24" viewBox="0 0 24 24" fill="none"
  808. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  809. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  810. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  811. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  812. </svg>
  813. <span class="sr-only">[archive]</span></a></q> que j’ai <a href="/david/2024/01/10/#hr-24">déjà cité</a>. Peut-être que la capacité à publier est toujours là mais que nous avons <a href="/david/2024/01/12/#hr-27">trop changé</a> pour être capables de perdurer dans cette pratique. 2024&nbsp;pourrait me faire mentir car je vois une certaine effervescence dans mon agrégateur. On va bien voir si ça dure. On va bien voir si <em>je</em>&nbsp;dure.</p>
  814. <p><em>Guidé par le besoin, je suis en train d’automatiser des ancres sur mes <code>&lt;hr&gt;</code>, fausse bonne idée&#8239;? En affinant un peu le style ça me convient pour&nbsp;l’instant.</em></p>
  815. <a href="#hr-40" title="Lien vers cette section de la page"><hr id="hr-40" /></a>
  816. <blockquote>
  817. <p>public-inbox implements the sharing of an email inbox via git to complement or replace traditional mailing lists. Readers may read via NNTP, IMAP, POP3, Atom feeds or HTML&nbsp;archives.</p>
  818. <p>public-inbox spawned around three main&nbsp;ideas:</p>
  819. <ul>
  820. <li>Publicly accessible and archived communication is essential to Free Software&nbsp;development.</li>
  821. <li>Contributing to Free Software projects should not require the use of non-Free services or&nbsp;software.</li>
  822. <li><mark>Graphical user interfaces should not be required for text-based communication.</mark> Users may have broken graphics drivers, limited eyesight, or be unable to afford modern&nbsp;hardware.</li>
  823. </ul>
  824. <p>public-inbox aims to be easy-to-deploy and manage; encouraging projects to run their own instances with minimal&nbsp;overhead.</p>
  825. <p><cite><em><a data-link-domain="public-inbox.org" href="https://public-inbox.org/README.html" hreflang="en"
  826. title="Consultation de l’article (anglais)">public-inbox - an &quot;archives first&quot; approach to mailing lists</a>
  827. <a href="/david/cache/2024/30b40ff8034212e070dc7daf2b9406e9/" hreflang="en"
  828. data-tippy data-description="public-inbox implements the sharing of an email inbox via git to complement or replace traditional mailing lists. Readers may read via NNTP, IMAP, POP3, Atom feeds or HTML archives."
  829. data-source="https://public-inbox.org/README.html"
  830. data-date="2024-01-19"
  831. data-favicon="https://public-inbox.org/favicon.ico"
  832. data-domain="public-inbox.org"
  833. ><svg xmlns="http://www.w3.org/2000/svg"
  834. width="24" height="24" viewBox="0 0 24 24" fill="none"
  835. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  836. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  837. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  838. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  839. </svg>
  840. <span class="sr-only">[archive]</span></a></em></cite></p>
  841. </blockquote>
  842. <p>D’une certaine manière, l’<a data-link-domain="github.com" href="https://github.com/jgm/pandoc/issues/9250">extinction de voix des un·es</a> fait mon bonheur de découverte aujourd’hui. J’espère que le réflexe ne sera pas de passer de <em>Google Groups</em> à <em>Microsoft Github Discussions</em> par&nbsp;commodité.</p>
  843. <a href="#hr-41" title="Lien vers cette section de la page"><hr id="hr-41" /></a>
  844. <blockquote>
  845. <p>… ça veut dire qu’en vrai, les droits humains, tu t’en fiches pas&nbsp;mal.</p>
  846. <p>Et que tu es juste <mark>un peu raciste</mark>.</p>
  847. <p><cite><em><a data-link-domain="emmaclit.com" href="https://emmaclit.com/2024/01/19/culture-froncaise/">Culture&nbsp;fronçaise</a></em></cite></p>
  848. </blockquote>
  849. <p>Voilà.</p>
  850. <a href="#hr-42" title="Lien vers cette section de la page"><hr id="hr-42" /></a>
  851. <figure>
  852. <a href="/static/david/2024/2024-01-19-ski-de-fond-nocturne.jpg"
  853. title="Cliquer pour une version haute résolution">
  854. <img
  855. src="/static/david/2024/2024-01-19-ski-de-fond-nocturne.jpg"
  856. width="3024" height="3024"
  857. srcset="/static/david/2024/2024-01-19-ski-de-fond-nocturne.jpg 3024w, /static/david/2024/2024-01-19-ski-de-fond-nocturne_660x440.jpg 660w, /static/david/2024/2024-01-19-ski-de-fond-nocturne_990x660.jpg 990w, /static/david/2024/2024-01-19-ski-de-fond-nocturne_1320x880.jpg 1320w"
  858. sizes="min(100vw, calc(100vh * 3024 / 3024))"
  859. loading="lazy"
  860. decoding="async"
  861. alt="Un enfant de dos dans des traces de ski de fond classique à la tombée du jour">
  862. </a>
  863. <figcaption>-16°C, rien de mieux pour démarrer une fin de semaine qu’une sortie ski dans notre jardin après&nbsp;l’école.</figcaption>
  864. </figure>
  865. <p>Cette photo est floue, c’est devenu tellement rare avec un téléphone (<em>OK&nbsp;Boomer</em>&nbsp;:p). Les couleurs étaient superbes et une fois les mains réchauffées c’était une ambiance très agréable. On n’a pas croisé grand monde. La rééducation active continue tranquillement son&nbsp;chemin.</p>
  866. <nav>
  867. <p>
  868. <a href="/david/2024/dependance/"
  869. title="Liste de tous les articles 2024 associés à cette étiquette"
  870. rel="tag">#dépendance</a>
  871. <a href="/david/2024/evolution/"
  872. title="Liste de tous les articles 2024 associés à cette étiquette"
  873. rel="tag">#évolution</a>
  874. <a href="/david/2024/parentalite/"
  875. title="Liste de tous les articles 2024 associés à cette étiquette"
  876. rel="tag">#parentalité</a>
  877. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  878. </p>
  879. </nav>
  880. <h2>
  881. <a href="/david/2024/01/16/" title="Lien permanent vers cet article">Endorphines</a> <time datetime="2024-01-16">16 janvier 2024</time>
  882. </h2>
  883. <p>J’ai remis les pieds sur des skis (de fond). J’ai une piste à 150&nbsp;mètres de chez moi et c’était probablement les plus critiques. Je me suis déjà tordu la cheville plusieurs fois sur ce trajet. Mais une fois dans les traces les sensations étaient bonnes et l’entorse (<em>tape</em>ée) n’a pas couiné. Le mollet un peu plus mais je me demande si ce n’est pas à force de compenser en&nbsp;boitant.</p>
  884. <p>Cela conclus peut-être mon journal de&nbsp;chialage.</p>
  885. <a href="#hr-33" title="Lien vers cette section de la page"><hr id="hr-33" /></a>
  886. <p>Hier soir, je travaillais sur la <a href="/david/">page d’accueil</a> en voulant donner davantage d’espace à la recherche qui passe également en pied de page (qui est un&nbsp;chantier).</p>
  887. <p>Et puis ce matin <a data-link-domain="nicolas-hoizey.com" href="https://nicolas-hoizey.com/">Nicolas H.</a> m’indique que mon flux est cassé. Je répare cette histoire de caractère invisible qui casse le <em>parsing</em> du contenu HTML (intégrer une <a data-link-domain="validator.w3.org" href="https://validator.w3.org/feed/">validation</a> pourrait s’avérer être utile). Et je pousse les modifications qui contiennent la page d’accueil en chantier. Tant pis, au moins c’est&nbsp;fait.</p>
  888. <p>Il y a dorénavant 54&nbsp;liens sur cette page, j’ai besoin de revoir des choses mais au moins il commence à y avoir une cohérence sur le thème de l’année et ses pages générées. Le chemin continue de me donner le&nbsp;sourire.</p>
  889. <p>Je constate au passage que la <a href="/david/recherche/">page de recherche</a> fait 2&#8239;Mo (700&#8239;Ko à télécharger), désindexer des années ou explorer des <a data-link-domain="pagefind.app" href="https://pagefind.app/">alternatives</a>&#8239;? J’aime bien me dire que mes écrits de ces 8&nbsp;dernières années tiennent sur&nbsp;2&nbsp;disquettes.</p>
  890. <a href="#hr-34" title="Lien vers cette section de la page"><hr id="hr-34" /></a>
  891. <p>Vidéo du jour&nbsp;: <a data-link-domain="video.blast-info.fr" href="https://video.blast-info.fr/w/9885ed4e-386b-4b3b-bcb5-dc2e454939e6">DRY JANUARY, ÉCOLOGIE&nbsp;: POURQUOI LE POUVOIR A-T-IL SI PEUR DE LA SOBRIÉTÉ&#8239;?</a> (désolé pour les cris, ça semble être le style de&nbsp;BLAST&nbsp;🙃).</p>
  892. <a href="#hr-35" title="Lien vers cette section de la page"><hr id="hr-35" /></a>
  893. <p>On creuse les <a data-link-domain="MDN" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script/type/importmap"><code>importmap</code></a> pour <a data-link-domain="umap-project.org" href="https://umap-project.org/fr/">uMap</a> en ce moment. Un peu contraints par un passage aux modules JS qui supporte mal la minification + invalidation du cache. Il y a des choses intéressantes dans les possibilités que ça offre mais c’est du&nbsp;Baseline™2023.</p>
  894. <p>Si un produit accueille moins de personnes lors de mon départ que lors de mon arrivée, j’ai probablement mal fait mon travail&#8239;? <em>À&nbsp;méditer.</em></p>
  895. <blockquote lang="en">
  896. <p>If the new software no longer runs on old hardware, it is <mark>worse</mark> than the old&nbsp;software.</p>
  897. <p><cite><em><a data-link-domain="blog.jim-nielsen.com" href="https://blog.jim-nielsen.com/2024/notes-from-computing-sustainably/" hreflang="en"
  898. title="Consultation de l’article (anglais)">Notes from “An approach to computing and sustainability inspired from permaculture” by Devine LuLinvega</a>
  899. <a href="/david/cache/2024/1f40a33f9c57a16d420eb0868a129e96/" hreflang="en"
  900. data-tippy data-description="Writing about the big beautiful mess that is making things for the world wide web."
  901. data-source="https://blog.jim-nielsen.com/2024/notes-from-computing-sustainably/"
  902. data-date="2024-01-15"
  903. data-favicon="https://blog.jim-nielsen.com/favicon.ico"
  904. data-domain="blog.jim-nielsen.com"
  905. ><svg xmlns="http://www.w3.org/2000/svg"
  906. width="24" height="24" viewBox="0 0 24 24" fill="none"
  907. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  908. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  909. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  910. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  911. </svg>
  912. <span class="sr-only">[archive]</span></a></em></cite></p>
  913. </blockquote>
  914. <nav>
  915. <p>
  916. <a href="/david/2024/addiction/"
  917. title="Liste de tous les articles 2024 associés à cette étiquette"
  918. rel="tag">#addiction</a>
  919. <a href="/david/2024/evolution/"
  920. title="Liste de tous les articles 2024 associés à cette étiquette"
  921. rel="tag">#évolution</a>
  922. <a href="/david/2024/technique/"
  923. title="Liste de tous les articles 2024 associés à cette étiquette"
  924. rel="tag">#technique</a>
  925. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  926. </p>
  927. </nav>
  928. <h2>
  929. <a href="/david/2024/01/15/" title="Lien permanent vers cet article">Rééducation</a> <time datetime="2024-01-15">15 janvier 2024</time>
  930. </h2>
  931. <p>J’ai réussi à marcher 6&#8239;km dans la neige avec des bottes de neige assez hautes. Pas pire. On va voir si ça ne tire pas trop dans la nuit. J’ai appris à mettre des bandes de kynésiologie aussi pour un léger soutien sur la rotation interne. Ce n’est pas une entorse classique car généralement deux arbres ne sont pas impliqués donc la torsion est différente. Du moins, c’est ce que mon doctorat express en médecine me laisse à penser… et mes sensations&nbsp;surtout&#8239;!</p>
  932. <p>Récupération active ou&nbsp;impatience&#8239;?</p>
  933. <a href="#hr-32" title="Lien vers cette section de la page"><hr id="hr-32" /></a>
  934. <blockquote lang="en">
  935. <p>The front-end to your dev&nbsp;env.</p>
  936. <p><cite><em><a data-link-domain="mise.jdx.dev" href="https://mise.jdx.dev/">mise-en-place</a></em></cite></p>
  937. </blockquote>
  938. <p>Ironiquement, j’ai toujours la crainte que ces outils viennent davantage polluer mon environnement actuel. Je ne suis pas sur assez de produits pour rencontrer des limites à ce niveau. Je m’en sors plutôt bien avec <a data-link-domain="code.larlet.fr" href="https://code.larlet.fr/shell/#alias">quelques alias</a> et un <a data-link-domain="code.larlet.fr" href="https://code.larlet.fr/shell/#auto-deactivation-des-virtualenvs">environnement virtuel dé·monté</a> à l’entrée dans un&nbsp;dossier.</p>
  939. <p>Je compare un peu des carottes et des patates mais ça donne une direction en terme de frugalité sur ce plan là. On simplifie rarement un environnement en ajoutant une couche (coucou Docker), au mieux on masque une incompétence. Ce qui n’est pas toujours une <a href="/david/2024/01/05/" title="Vocabulaire">tension</a> en fonction du&nbsp;contexte&#8239;!</p>
  940. <nav>
  941. <p>
  942. <a href="/david/2024/addiction/"
  943. title="Liste de tous les articles 2024 associés à cette étiquette"
  944. rel="tag">#addiction</a>
  945. <a href="/david/2024/evolution/"
  946. title="Liste de tous les articles 2024 associés à cette étiquette"
  947. rel="tag">#évolution</a>
  948. <a href="/david/2024/sport/"
  949. title="Liste de tous les articles 2024 associés à cette étiquette"
  950. rel="tag">#sport</a>
  951. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  952. </p>
  953. </nav>
  954. <h2>
  955. <a href="/david/2024/01/11/" title="Lien permanent vers cet article">Impact</a> <time datetime="2024-01-11">11 janvier 2024</time>
  956. </h2>
  957. <blockquote lang="en">
  958. <p>If front web developers work closer to the users’ needs and problems, <mark>if they feel more implicated in the user experience,</mark> they will understand the impact of what they are building and will naturally adopt the strengths of the front web. […]</p>
  959. <p>Maybe, in order to fix the front web, we have to fix human nature: make things less about money and self-satisfaction, and more about improving people’s lives and understanding the impact of what we are&nbsp;creating.</p>
  960. <p><cite><em><a data-link-domain="gericci.me" href="https://gericci.me/we-need-to-talk-about-the-front-web-5.html" hreflang="en"
  961. title="Consultation de l’article (anglais)">Part 5: Clues to Fix the Front Web</a>
  962. <a href="/david/cache/2024/40aada3cc8d6897fda5a277c4299c1fd/" hreflang="en"
  963. data-tippy data-description="Clues to Fix the Front Web"
  964. data-source="https://gericci.me/we-need-to-talk-about-the-front-web-5.html"
  965. data-date="2024-01-09"
  966. data-favicon="https://gericci.me/img/favicon.png"
  967. data-domain="gericci.me"
  968. ><svg xmlns="http://www.w3.org/2000/svg"
  969. width="24" height="24" viewBox="0 0 24 24" fill="none"
  970. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  971. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  972. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  973. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  974. </svg>
  975. <span class="sr-only">[archive]</span></a></em></cite></p>
  976. </blockquote>
  977. <p>Même si je m’émeus encore de l’esthétique d’un <em>Web Component</em> ou d’une nouvelle technique CSS, j’essaye d’être plus attentif au fil des ans à l’impact potentiel des bouts de code que j’assemble. C’est là où <a data-link-domain="daverupert.com" href="https://daverupert.com/2022/06/demo-to-demo-loop/" hreflang="en"
  978. title="Consultation de l’article (anglais)">les démo</a>
  979. <a href="/david/cache/2024/9f8c0e75066c1882a3b4ce084e3223ed/" hreflang="en"
  980. data-tippy data-description="The personal blog of Dave Rupert, web developer and podcaster from Austin, TX."
  981. data-source="https://daverupert.com/2022/06/demo-to-demo-loop/"
  982. data-date="2024-01-09"
  983. data-favicon="https://daverupert.com/favicon.ico"
  984. data-domain="daverupert.com"
  985. ><svg xmlns="http://www.w3.org/2000/svg"
  986. width="24" height="24" viewBox="0 0 24 24" fill="none"
  987. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  988. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  989. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  990. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  991. </svg>
  992. <span class="sr-only">[archive]</span></a> prennent tout leur sens pour vérifier la pertinence de ce qui a été produit. Se libérer de l’égoïsme technique pour aller vers le soin porté aux utilisateur·ices, essayer de comprendre leurs besoins, synthétiser, proposer, se tromper, recommencer. Dans une spirale d’essais-erreurs, on se rapproche d’un centre enviable où les contraintes techniques sont minimisées et les besoins proches d’être comblés. Chaque partie ayant un petit peu appris sur l’autre au cours de ce bout de chemin&nbsp;commun.</p>
  993. <p><strong>Une carrière est la cartographie de ces expériences.</strong> Savoir identifier les <em>optima</em> locaux qui ont pu procurer de la joie ainsi que les lieux de convergence où l’on aime bien aller car il y a le bon dosage effort / récompense. Apprendre à reconnaître les sentiers hasardeux où l’on a déjà laissé des plumes et reconnaître aussi qu’un contexte et des personnes peuvent&nbsp;changer.</p>
  994. <p>Admettre que l’on a soi-même changé tout au long de ce&nbsp;cheminement.</p>
  995. <blockquote lang="en">
  996. <p>At most software startups, customers typically don’t care if your product runs on Heroku, Kubernetes, or a really brittle singly-homed machine in Joe’s closet. No purchasing decisions hinge on your commitment to write servers in Rust or use Nix for hermetic everything. And although they might exist, I have sadly never had a customer write a testimonial for the elegant collection of internal services involved in responding to that single HTTP&nbsp;request.</p>
  997. <p>No; customers are not paying for, nor give a shit about, these things. Sorry. It’s still cool stuff. It’s just not what you’re&nbsp;selling.</p>
  998. <p><mark>Customers want software that delivers problem-solving <em>impact</em>.</mark> And at the early stage, which is all the way until you’ve reached product-market fit, they’re almost certainly not getting enough, fast enough. You should be spending as much time as you can at this level of the stack, The Product: thinking, building, learning.</p>
  999. <p><cite><em><a data-link-domain="hoho.com" href="https://hoho.com/posts/your-stack-is-not-the-product/" hreflang="en"
  1000. title="Consultation de l’article (anglais)">Your tech stack is not the product</a>
  1001. <a href="/david/cache/2024/877b1e29328f6ad1b6fef26d7407ec5f/" hreflang="en"
  1002. data-tippy data-description="Early stage technology decisions must be, uncomfortably, a means to an end."
  1003. data-source="https://hoho.com/posts/your-stack-is-not-the-product/"
  1004. data-date="2024-01-09"
  1005. data-favicon="https://hoho.com/favicon-16x16.png"
  1006. data-domain="hoho.com"
  1007. ><svg xmlns="http://www.w3.org/2000/svg"
  1008. width="24" height="24" viewBox="0 0 24 24" fill="none"
  1009. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  1010. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  1011. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  1012. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  1013. </svg>
  1014. <span class="sr-only">[archive]</span></a></em></cite></p>
  1015. </blockquote>
  1016. <a href="#hr-25" title="Lien vers cette section de la page"><hr id="hr-25" /></a>
  1017. <blockquote lang="en">
  1018. <p>You can’t make an article on a UX topic without showcasing a practical example. Let’s explore examples that I spotted on the web and how to fix&nbsp;them.</p>
  1019. <p><cite><em><a data-link-domain="ishadeed.com" href="https://ishadeed.com/article/target-size" hreflang="en"
  1020. title="Consultation de l’article (anglais)">Designing better target sizes</a>
  1021. <a href="/david/cache/2024/c98206d38897264005bcd5b453d032b1/" hreflang="en"
  1022. data-tippy data-description="An interactive guide on designing better target sizes on the web."
  1023. data-source="https://ishadeed.com/article/target-size"
  1024. data-date="2024-01-10"
  1025. data-favicon="https://ishadeed.com/assets/favicon-32x32.png"
  1026. data-domain="ishadeed.com"
  1027. ><svg xmlns="http://www.w3.org/2000/svg"
  1028. width="24" height="24" viewBox="0 0 24 24" fill="none"
  1029. stroke="currentColor" stroke-width="2" stroke-linecap="square"
  1030. stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
  1031. <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
  1032. <line x1="12" y1="17" x2="12.01" y2="17"></line>
  1033. </svg>
  1034. <span class="sr-only">[archive]</span></a></em></cite></p>
  1035. </blockquote>
  1036. <p>Superbe article de Ahmad Shadeed. En résumé, il faut soigner ses <em>paddings</em> mais il y a pas mal d’astuces CSS pour y arriver dans certaines conditions. Je retiens notamment l’usage d’un <code>:after</code> pour ça <a data-link-domain="ishadeed.com" href="https://ishadeed.com/article/target-size#mobile-menu">lorsqu’il s’agit d’icônes</a>&nbsp;notamment&nbsp;:</p>
  1037. <pre><code>.search__filter:after {
  1038. content: &quot;&quot;;
  1039. position: absolute;
  1040. inset: 0;
  1041. z-index: -1;
  1042. transform: scale(2);
  1043. }
  1044. </code></pre>
  1045. <p>Je découvre au passage qu’il y a pas mal d’options d’accessibilité dans <a data-link-domain="polypane.app" href="https://polypane.app/">Polypane</a> que j’utilise depuis peu et que je n’ai pas pleinement&nbsp;exploré.</p>
  1046. <nav>
  1047. <p>
  1048. <a href="/david/2024/evolution/"
  1049. title="Liste de tous les articles 2024 associés à cette étiquette"
  1050. rel="tag">#évolution</a>
  1051. <a href="/david/2024/technique/"
  1052. title="Liste de tous les articles 2024 associés à cette étiquette"
  1053. rel="tag">#technique</a>
  1054. <a href="/david/2024/web/"
  1055. title="Liste de tous les articles 2024 associés à cette étiquette"
  1056. rel="tag">#web</a>
  1057. <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
  1058. </p>
  1059. </nav>
  1060. <form action="/david/recherche/" method="get">
  1061. <fieldset>
  1062. <legend>Recherche</legend>
  1063. <label for="input-search">Termes de votre recherche :</label>
  1064. <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
  1065. <input type="submit" value="Chercher">
  1066. <p id="indexation-infos">
  1067. <small>
  1068. Seuls les contenus de ces 8 dernières années sont indexés.
  1069. </small>
  1070. </p>
  1071. </fieldset>
  1072. </form>
  1073. <aside>
  1074. <theme-toggle></theme-toggle>
  1075. </aside>
  1076. </article>
  1077. <hr>
  1078. <footer>
  1079. <p>
  1080. <a href="/david/" title="Aller à l’accueil">Accueil</a>
  1081. <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
  1082. <a href="http://larlet.com"
  1083. title="Go to my English profile"
  1084. data-instant>Pro</a>
  1085. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
  1086. <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
  1087. </p>
  1088. <template id="theme-selector">
  1089. <form>
  1090. <style type="text/css">
  1091. fieldset div {
  1092. text-align: center;
  1093. }
  1094. </style>
  1095. <fieldset>
  1096. <legend>Thème</legend>
  1097. <div>
  1098. <label>
  1099. <input type="radio" value="auto" name="chosen-color-scheme" checked>
  1100. Auto
  1101. </label>
  1102. <label>
  1103. <input type="radio" value="dark" name="chosen-color-scheme">
  1104. Foncé
  1105. </label>
  1106. <label>
  1107. <input type="radio" value="light" name="chosen-color-scheme">
  1108. Clair
  1109. </label>
  1110. </div>
  1111. </fieldset>
  1112. </form>
  1113. </template>
  1114. </footer>
  1115. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  1116. <script>
  1117. class ThemeToggle extends HTMLElement {
  1118. constructor() {
  1119. super()
  1120. const themeSelectorTemplate = document.querySelector('#theme-selector')
  1121. const form = themeSelectorTemplate.content.firstElementChild
  1122. this.attachShadow({ mode: 'open' })
  1123. this.shadowRoot.appendChild(form.cloneNode(true))
  1124. }
  1125. connectedCallback() {
  1126. const form = this.shadowRoot.querySelector('form')
  1127. form.addEventListener('change', (e) => {
  1128. const chosenColorScheme = e.target.value
  1129. localStorage.setItem('theme', chosenColorScheme)
  1130. toggleTheme(chosenColorScheme)
  1131. })
  1132. const selectedTheme = localStorage.getItem('theme')
  1133. if (selectedTheme && selectedTheme !== 'undefined') {
  1134. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  1135. }
  1136. }
  1137. }
  1138. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  1139. window.addEventListener('load', () => {
  1140. let colorsLayer = undefined
  1141. let hasDarkRules = false
  1142. for (const styleSheet of Array.from(document.styleSheets)) {
  1143. let mediaRules = []
  1144. for (const layerRule of styleSheet.cssRules) {
  1145. if (!(layerRule instanceof CSSLayerBlockRule)) {
  1146. continue
  1147. }
  1148. if (layerRule.name === 'colors') {
  1149. colorsLayer = layerRule
  1150. }
  1151. for (const cssRule of layerRule.cssRules) {
  1152. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  1153. continue
  1154. }
  1155. // WARNING: Safari does not have/supports `conditionText`.
  1156. if (cssRule.conditionText) {
  1157. if (cssRule.conditionText !== prefersColorSchemeDark) {
  1158. continue
  1159. }
  1160. } else {
  1161. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  1162. continue
  1163. }
  1164. }
  1165. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  1166. }
  1167. }
  1168. // WARNING: do not try to insert a Rule to a styleSheet you are
  1169. // currently iterating on, otherwise the browser will be stuck
  1170. // in a infinite loop…
  1171. for (const mediaRule of mediaRules) {
  1172. // Safari requires the `0` second parameter (even if default).
  1173. colorsLayer.insertRule(mediaRule.cssText, 0)
  1174. hasDarkRules = true
  1175. }
  1176. }
  1177. if (hasDarkRules) {
  1178. if ('customElements' in window && !customElements.get('theme-toggle')) {
  1179. customElements.define('theme-toggle', ThemeToggle)
  1180. }
  1181. }
  1182. })
  1183. </script>
  1184. </body>
  1185. </html>