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

3 years ago
3 years ago
3 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the `title` element
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Tag #produit — David Larlet</title>
  13. <meta name="description" content="Publications relatives au tag #produit">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Documented, feel free to shoot an email. -->
  28. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  29. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  36. <script>
  37. function toggleTheme(themeName) {
  38. document.documentElement.classList.toggle(
  39. 'forced-dark',
  40. themeName === 'dark'
  41. )
  42. document.documentElement.classList.toggle(
  43. 'forced-light',
  44. themeName === 'light'
  45. )
  46. }
  47. const selectedTheme = localStorage.getItem('theme')
  48. if (selectedTheme !== 'undefined') {
  49. toggleTheme(selectedTheme)
  50. }
  51. </script>
  52. <style type="text/css">
  53. details[open] summary {
  54. display: none;
  55. }
  56. </style>
  57. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  58. <header>
  59. <h1>Publications relatives au tag #produit</h1>
  60. </header>
  61. <nav>
  62. <p class="center">
  63. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  64. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  65. </svg> Accueil</a>
  66. ‱ <a rel="tags" href="/david/#tags" title="Liste de toutes les Ă©tiquettes"><svg class="icon icon-tags">
  67. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-tags"></use>
  68. </svg> Étiquettes</a>
  69. </p>
  70. </nav>
  71. <hr>
  72. <main>
  73. <p>Les plus rĂ©centes en premier, les 3 premiĂšres sont dĂ©pliĂ©es et ensuite c’est Ă  la demande, bonne exploration !</p>
  74. <h2><a href="/david/2021/11/29/" title="Lien permanent vers cet article">Sens</a> (2021-11-29)</h2>
  75. <blockquote lang="en">
  76. <p>In software, participatory sense-making means developing a shared mental model of what the software is, what it’s going to be, and how it works. We need to understand what we’re building deeply, with a clear language to talk about it. <mark>It needs to make sense to each of us, and to all of us.</mark> We construct this model together: that means there’s more of us to work at making it real in the world. It also means the model is richer, fits with more of the real world, and more rigorous. This comes from our many perspectives participating.</p>
  77. <p><cite><em><a href="https://jessitron.com/2021/11/28/software-development-pushes-us-to-get-better-as-people/">Software development pushes us to get better as people</a></em> (<a href="/david/cache/2021/3db656ea2c3a04a3fb00d9e3457a8a2e/">cache</a>)</cite></p>
  78. </blockquote>
  79. <p>Cet article m’a rappelĂ© que je deviens une meilleure personne grĂące aux personnes avec lesquelles j’évolue ces derniĂšres annĂ©es. Prendre soin <em>ensemble</em> c’est aller bien au-delĂ  de son propre confort. C’est ce cheminement lĂ  qui permet d’apporter de la valeur Ă  ce qui est produit
 et Ă  ce qui est vĂ©cu.</p>
  80. <h2><a href="/david/2021/11/06/" title="Lien permanent vers cet article">Client</a> (2021-11-06)</h2>
  81. <blockquote lang="en">
  82. <p>The central cause of the failure was another anti-pattern, <strong>CEO as Customer</strong>. And it turns out that a company that can’t invest in the quality of its mainline product, won’t invest in the quality of its replacement, either. That’s a management anti-pattern, and starting over with new people and a blank piece of paper doesn’t change management. <mark>Only management can change management.</mark></p>
  83. <p><cite><em><a href="http://raganwald.com/2021/10/28/the-inner-osborne-effect.html">The Inner Osborne Effect</a></em> (<a href="/david/cache/2021/a98225895499217f24a9e081c2684dc4/">cache</a>)</cite></p>
  84. </blockquote>
  85. <p><abbr lang="en" title="Chief Executive Officer">CEO</abbr> comme client &lt; ComitĂ© directeur comme client &lt; Équipe de dĂ©veloppement comme cliente &lt; Équipe produit comme cliente &lt; Interviewé·es comme client·es.</p>
  86. <p>Étonnamment, entre le biais de sĂ©lection et la transformation des personnes recrutĂ©es, «&nbsp;Client comme client&nbsp;» est trĂšs difficile Ă  atteindre.</p>
  87. <p>À moins d’ĂȘtre son propre client.</p>
  88. <h2><a href="/david/2021/10/15/" title="Lien permanent vers cet article">Engagement</a> (2021-10-15)</h2>
  89. <p>Il y a une notion en alpinisme/escalade qui est relativement indĂ©pendante de la difficultĂ©. Il s’agit du niveau d’engagement de la paroi/voie. Ce n’est pas la mĂȘme chose de parcourir un chemin de randonnĂ©e ou de se faire une arrĂȘte avec 1000&nbsp;m d’à-pic de chaque cĂŽtĂ©. Pourtant la largeur est la mĂȘme, mais la consĂ©quence d’une inattention ou d’un trĂ©buchement n’a pas la mĂȘme criticitĂ©.</p>
  90. <p><a href="https://ronan.amicel.net/">Ronan</a> me rappelait Ă  juste titre qu’il en est de mĂȘme sur des produits informatiques. Il y a le chemin, mais il y aussi le vide autour (ou parfois plutĂŽt le trop plein). Il est facile de se laisser happer par des problĂ©matiques bien au-delĂ  du pĂ©rimĂštre auquel on voudrait bien se circonscrire pour Ă©pargner sa santĂ© mentale.</p>
  91. <p>En se focalisant sur le <a href="https://fr.wikipedia.org/wiki/Cotation_en_alpinisme#Neige,_glace_et_mixte">degrĂ© technique</a>, on nĂ©glige parfois la <a href="https://fr.wikipedia.org/wiki/Cotation_en_alpinisme#Neige,_glace_et_mixte">cotation de sĂ©rieux</a> qui est toute aussi importante — si ce n’est plus — pour revenir en un seul morceau.</p>
  92. <p>L’évaluation de sa capacitĂ© d’engagement est indissociable d’une bonne connaissance de ses capacitĂ©s et
 d’une certaine humilitĂ©.</p>
  93. <h2><a href="/david/2021/10/13/" title="Lien permanent vers cet article">Prodiverse</a> (2021-10-13)</h2>
  94. <details>
  95. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  96. <p>Je continue sur <a href="/david/2021/10/07/" title="Consigner">cette idĂ©e de produit</a>, l’avantage d’un <a href="/david/2021/01/01/" title="PresQuotidien">rythme hebdomadaire</a> est de pouvoir rebondir sur mes propres propos avec un peu de recul.</p>
  97. <p>Je me demande de plus en plus s’il n’y a pas dĂ©jĂ  tout ce qui serait nĂ©cessaire au niveau Ă©changes de messages et notifications avec mastodon. Ce qui pĂȘche un peu dans l’usage orientĂ© produit que j’imagine c’est davantage le rendu et la navigation. Et on touche peut-ĂȘtre du doigt un irritant personnel que j’ai dĂ©jĂ  avec le client par dĂ©faut et l’affichage des discussions.</p>
  98. <p>En ayant 6&nbsp;heures de dĂ©calage horaire avec la France, je me rĂ©veille souvent avec un train de retard et en lisant de maniĂšre antĂ©-chronologique le fil des discussions c’est vraiment fastidieux de s’y retrouver. Un affichage Ă -la-P2&nbsp;me permettrait de ne pas perdre le fil justement, avec une arborescence qui commencerait par m’afficher la source.</p>
  99. <p>C’est peut-ĂȘtre un premier petit pas&nbsp;: tenter de faire le client mastodon qui irait dans le sens d’une arborescence de discussions plus que d’un flux. Et tant qu’à faire <a href="https://github.com/popura-network/atoot">en asynchrone</a> histoire d’ajouter un peu de fun.</p>
  100. <blockquote>
  101. <p>Fais trĂšs attention Ă  qui tu racontes ton histoire parce que c’est ce que tu as de plus prĂ©cieux.</p>
  102. <p>C’est tout ce que tu possĂ©deras jamais&nbsp;: ta propre histoire.</p>
  103. <p><cite>Citation d’un aborigùne dans un livre de Sarah Marquis</cite></p>
  104. </blockquote>
  105. </details>
  106. <h2><a href="/david/2021/09/02/" title="Lien permanent vers cet article">Équipes</a> (2021-09-02)</h2>
  107. <details>
  108. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  109. <blockquote lang="en">
  110. <p>You might assume that if you put together a bunch of people and give them a goal, they’re a team. <mark>But that’s not how it works.</mark> While all constellations are working groups of some sort, in order for a working group to be considered a team two criteria need to be met.</p>
  111. <p><cite><em><a href="https://www.viktorcessan.com/the-first-question-to-ask-when-building-teams-is-this-really-a-team/">The First Question To Ask When Building Teams - Is This Really A Team?</a></em> (<a href="/david/cache/2021/77419ba77876ddc880823ee6321f9cbe/">cache</a>)</cite></p>
  112. </blockquote>
  113. <p>Je me rĂ©fĂšre souvent Ă  cette classification lorsqu’on me parle d’équipe. Elle a l’avantage d’ĂȘtre relativement simple Ă  (re)mettre en mĂ©moire grĂące aux schĂ©mas.</p>
  114. <p><strong>Un but commun qui nĂ©cessite d’ĂȘtre ensemble.</strong> Tous les mots comptent.</p>
  115. <p>Ne pas confondre avec un «&nbsp;groupe d’affinitĂ©&nbsp;»&nbsp;:</p>
  116. <blockquote>
  117. <p>L’influence du mouvement anarchiste sur l’alter-mondialisme procĂšde en grande partie de la diffusion de modes d’organisation comme le <em>groupe d’affinitĂ©</em>, une unitĂ© militante autonome d’environ 5&nbsp;Ă  20&nbsp;individus qui <mark>partagent une mĂȘme sensibilitĂ© Ă  l’égard des causes Ă  dĂ©fendre et des types d’actions Ă  privilĂ©gier</mark>. Le processus de prise de dĂ©cision y est anarchiste, c’est-Ă -dire qu’il est Ă©galitaire, participatif, dĂ©libĂ©ratif et consensuel.</p>
  118. <p><cite><em>Les nouveaux anarchistes</em>, Francis Dupuis-DĂ©ri</cite></p>
  119. </blockquote>
  120. </details>
  121. <h2><a href="/david/2021/07/30/" title="Lien permanent vers cet article">Poignée</a> (2021-07-30)</h2>
  122. <details>
  123. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  124. <blockquote>
  125. <p>Un outil est une opportunitĂ© avec une poignĂ©e. — Kevin Kelly, traduction libre</p>
  126. </blockquote>
  127. <p>Je tombe sur cette citation aujourd’hui et je me demande si je suis un fabricant de poignĂ©es.</p>
  128. <p>La sagesse est de savoir résister à la tentation de concevoir des poignées pour toutes les portes.</p>
  129. <blockquote>
  130. <p>Tous les gouvernements sont affligĂ©s d’un grave problĂšme chronique&nbsp;: Le pouvoir exerce une grande attraction sur les natures pathologiques. Ce n’est pas tant que le pouvoir corrompt, mais il fascine les sujets corruptibles. Ces gens ont tendance Ă  s’enivrer de violence, ce qui crĂ©e rapidement les conditions d’une accoutumance fĂącheuse.</p>
  131. <p><cite><em>Missionaria Protectiva, Texte QIV (dicto)</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> VI. La maison des mĂšres</em>, Frank Herbert</cite></p>
  132. </blockquote>
  133. </details>
  134. <h2><a href="/david/2021/07/05/" title="Lien permanent vers cet article">Ano(r)malisme</a> (2021-07-05)</h2>
  135. <details>
  136. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  137. <p>Se dire qu’une expĂ©rience singuliĂšre n’est pas reproductible car le contexte Ă©tait trop particulier. J’ai souvent croisĂ© ce schĂ©ma de pensĂ©e, notamment dans le contexte professionnel. C’est triste car ça referme brutalement des portes Ă  peine entrouvertes.</p>
  138. <p>Un contexte se crĂ©e et se façonne — disent les privilĂ©gié·es — mais il faut pour cela ĂȘtre suffisamment en (in)sĂ©curitĂ©. Un entre-deux gĂ©nĂšre un <a href="/david/2021/01/05/" title="Statu quo">statu quo</a>.</p>
  139. <blockquote>
  140. <p>La bureaucratie est la mort de l’initiative. Il n’est rien que des bureaucrates haĂŻssent plus que l’innovation, en particulier celle qui produit de meilleurs rĂ©sultats que les vieilles routines traditionnelles. <mark>Les amĂ©liorations font toujours paraĂźtre ineptes ceux qui se trouvent au sommet de la pyramide.</mark> Et qui prend plaisir Ă  avoir l’air inepte&#8239;?</p>
  141. <p><cite><em>Guide des Essais et Erreur dans l’Art de Gouverner, Archives du Bene Gesserit</em>, <em><a href="/david/2020/12/21/#dune">Dune</a> V. Les HĂ©rĂ©tiques de Dune</em>, Frank Herbert</cite></p>
  142. </blockquote>
  143. </details>
  144. <h2><a href="/david/2021/06/24/" title="Lien permanent vers cet article">Long terme</a> (2021-06-24)</h2>
  145. <details>
  146. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  147. <blockquote lang="en">
  148. <p>Agile’s success at the expense of UX is just one manifestation of a deeper truth: Businesses want scaling. And foundational UX work doesn’t scale. It doesn’t lend itself to predictable, repeatable processes and generic cookie-cutter roles. It can’t, because by definition it deals with unknown, slippery, hard-to-define problems that characterize the leading edge of an organically evolving business.</p>
  149. <p>The same things that make agile a great fit for scaling engineering work—regular sprint tempos; clearly articulated outcomes to be produced; breaking down the complex, unfolding experience of users into concrete elements that can be tied to code—are the very things that make it a terrible fit for foundational UX work. <mark>The holism necessary to do foundational UX is antithetical to the assembly-line chunks of user behavior</mark> agile requires.</p>
  150. <p><cite><em><a href="https://www.fastcompany.com/90642462/i-helped-pioneer-ux-design-what-i-see-today-horrifies-me">I helped pioneer UX design. What I see today disturbs me</a></em> (<a href="/david/cache/2021/f5a7f2346b8c7317be12857b52321f52/">cache</a>)</cite></p>
  151. </blockquote>
  152. <p>Je ne vais pas me focaliser sur l’opposition agile/UX car il y a pas mal de façons de pratiquer ces deux domaines. C’est certain qu’il est malheureux d’avoir appelĂ© ces itĂ©rations des <em>sprints</em> et qu’il faut rĂ©ussir Ă  avoir suffisamment de recul pour ne pas prendre ce terme au pied de la lettre (sinon ça finit par brĂ»ler).</p>
  153. <p><strong>DĂ©terminer ensemble ce que l’on veut produire Ă  long terme est trĂšs complexe pour une Ă©quipe.</strong> Le contexte change, les utilisateur·ices Ă©voluent, l’équipe elle-mĂȘme se renouvelle, dans cet espace mouvant il est difficile de conserver un semblant d’unitĂ© et de cohĂ©rence. Au moins vis-Ă -vis des interactions avec l’extĂ©rieur.</p>
  154. <p>On peut ĂȘtre tentĂ© d’avoir recours Ă  un <em>Design System</em> ou <a href="https://gouvfr.atlassian.net/wiki/spaces/DB/pages/736362561/Version+1.0.0">SystĂšme de Design</a> mĂȘme si ce cadre arrive avec une lourdeur qui lui est propre. Ça peut donner l’impression de mettre une carrosserie sur une trottinette qui n’en nĂ©cessitait pas tant. C’est une rĂ©ponse technique efficace (sans ĂȘtre performante) Ă  une problĂ©matique qui a trait <a href="/david/2021/06/23/" title="FullStack">Ă  l’humain et Ă  l’empathie</a>.</p>
  155. <p>Comment combiner la tactique (faire Ă  court terme) Ă  la stratĂ©gie (penser Ă  long terme) alors&#8239;? <strong>Sans technique</strong>, avec des <em>personnes</em> qui font le liant. Qui agrĂšgent, qui reli(s)ent, qui partagent l’enthousiasme.</p>
  156. <p>Qui prennent soin. Qui donnent loin.</p>
  157. </details>
  158. <h2><a href="/david/2021/06/18/" title="Lien permanent vers cet article">Inutile</a> (2021-06-18)</h2>
  159. <details>
  160. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  161. <p>Je me rappelle l’annĂ©e derniĂšre, Ă  la mĂȘme pĂ©riode, on se demandait si on allait avoir besoin de budget pour <a href="https://mesconseilscovid.sante.gouv.fr/">MesConseilsCovid</a> au cours des prochains 3&nbsp;ou 6&nbsp;mois. Un an aprĂšs, on aspire toujours Ă  ce que le produit ait la durĂ©e de vie la plus courte possible. C’est quand mĂȘme un angle particulier lorsqu’on investit du temps sur le dĂ©veloppement d’un outil que d’espĂ©rer son inutilitĂ© toute prochaine.</p>
  162. <blockquote lang="en">
  163. <p>Seen from a distance, (other people’s) existence seems to possess a coherence and a unity which they cannot have, in reality, but which seems evident to the spectator. This, of course, is <mark>an optical illusion</mark>. The distance (that is, the paucity of our knowledge) blurs the details and effaces everything that fits ill into the Gestalt. Illusion or not, we tend to see other people’s lives as works of art. And having seen them this way, we struggle to (make our lives) the same.</p>
  164. <p><cite><em>Liquid Modernity</em>, Bauman (2000) <em>via</em> <a href="https://kneelingbus.substack.com/p/162-minimum-viable-self">#162: Minimum Viable Self</a> (<a href="/david/cache/2021/5a89944a64394da98512ea35a64bafdc/">cache</a>)</cite></p>
  165. </blockquote>
  166. </details>
  167. <h2><a href="/david/2021/06/06/" title="Lien permanent vers cet article">Abonnement</a> (2021-06-06)</h2>
  168. <details>
  169. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  170. <blockquote lang="en">
  171. <p>That all sounds great. However, as I mentioned, we love goodwill, and a lot of people wince when they hear “subscription.” The first thing that pops up in a user’s head are scammy companies that make cancellation a nightmare, like multi-level marketing schemes, gym memberships, and Adobe. The App Store prevents these shenanigans: you get a reminder email before renewal, and you can cancel within the <em>Settings</em> app in seconds. Whenever a company offers a subscription, I always try to buy it through the App Store.</p>
  172. <p>Some folks absolutely loathe subscriptions on <em>principle</em>, and <mark>will never rent something if they can own it</mark>. This is not unreasonable. Halide is like a camera, and while professionals are used to renting gear, most consumers own their camera.</p>
  173. <p><cite><em><a href="https://lux.camera/lux-year-4-doubling-down/">Lux Year 4: Doubling Down</a></em> (<a href="/david/cache/2021/0c45751cd69748ca779b1442b26ad6c3/">cache</a>)</cite></p>
  174. </blockquote>
  175. <p>Les crĂ©ateurs de Halide (et Spectre) reviennent en dĂ©tail sur leur stratĂ©gie, notamment financiĂšre, pour faire Ă©voluer leur produit. J’utilise ces deux applications, aussi c’est d’autant plus intĂ©ressant de lire leurs doutes et leurs pistes vis Ă  vis de cette Ă©volution.</p>
  176. <p><em>Je ne crois pas avoir lu un seul retour de dĂ©veloppeur d’application pour iOS qui ne se plaigne pas de l’AppStore.</em></p>
  177. <p>Ce n’est vraiment pas Ă©vident de trouver un moyen d’ĂȘtre rĂ©munĂ©rĂ© de maniĂšre stable et pĂ©renne lorsqu’on vend un produit, surtout si on souhaite qu’il soit durable. Il y a des jours oĂč j’aimerais me prĂ©occuper de ces aspects là
 et d’autres oĂč je suis bien content de vendre ma «&nbsp;force de travail&nbsp;». C’est un choix de vie qui m’offre pour l’instant une plus grande libertĂ© d’esprit mais qui pourrait changer lorsque je n’aurai plus l’impression d’avoir suffisamment de <q>force</q> justement.</p>
  178. <p>En tant que dĂ©veloppeur, j’ai de plus en plus l’impression que l’on crĂ©e notre propre systĂšme d’abonnement en augmentant la complexitĂ© de nos outils et de notre <em>stack</em> (ça sonne toujours mieux en anglais), ce qui gĂ©nĂšre la nĂ©cessitĂ© d’une maintenance rĂ©guliĂšre assurant un fond de roulement. La «&nbsp;tierce maintenance applicative&nbsp;» n’est pas nouvelle mais elle me semble atteindre un tout autre niveau ces derniĂšres annĂ©es sur le Web.</p>
  179. <p>On crĂ©e tranquillement notre propre besoin, <a href="http://megelison.com/poor-in-tech">en Ă©tant sur-payé·es</a> (<a href="/david/cache/2021/86eba8e465d7ce11ef61a0c61f878f21/">cache</a>), et personne ne semble s’en offusquer plus que ça
</p>
  180. <blockquote lang="en">
  181. <p>And I’m not 100% sure, but I think this might contribute to longevity. Some of my clients are still working with the same sites I built for them nearly 10&nbsp;years ago, a few with just minor security-related updates in the meantime and <mark>no other maintenance strictly required</mark>. That’s not to say that those sites couldn’t use a “lick of paint” to bring them in to the 2020s; the point is that they <em>work</em>. And for organizations working on really tight budgets, or budgets that fluctuate wildly due to public funding, stability is really important. They can’t afford a developer on retainer to keep things running smoothly.</p>
  182. <p><cite><em><a href="https://piperhaywood.com/two-articles-on-spa-or-spa-like-sites-vs-alternatives/">Two articles on SPA or SPA-like sites vs alternatives</a></em> (<a href="/david/cache/2021/d46752726e00de301573576176df1f1c/">cache</a>)</cite></p>
  183. </blockquote>
  184. </details>
  185. <h2><a href="/david/2021/04/30/" title="Lien permanent vers cet article">Produit</a> (2021-04-30)</h2>
  186. <details>
  187. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  188. <blockquote lang="en">
  189. <p>This was surprising because it seems so clearly against our own interest. In almost every case, companies fail because they build the wrong thing. <mark>Unless your customers are themselves engineers, I’m the wrong person to help with that.</mark> You want someone comfortable at the periphery of your system, who wants to learn about the competitive landscape, who wants to talk to customers. You want a product engineer.</p>
  190. <p><cite><em><a href="https://ideolalia.com/essays/trapped-in-the-technologist-factory.html">trapped in the technologist factory</a></em> (<a href="/david/cache/2021/0d69b48e03e8a6b26605dfda4a6f32dd/">cache</a>)</cite></p>
  191. </blockquote>
  192. <p>C’est un long cheminement personnel pour arriver Ă  cette conclusion. Le mien a durĂ© de trĂšs longues annĂ©es et d’une certaine maniĂšre je continue de l’arpenter. Se rappeler quotidiennement que le produit que je dĂ©veloppe n’est pas Ă©goĂŻstement pour moi — ou ma propre acquisition de connaissances — mais au service d’autres personnes. Cette dĂ©marche requiert un certain niveau de prise de conscience puis d’empathie pour espĂ©rer faire un produit utilisable et utilisĂ©.</p>
  193. <p>Et pendant ce temps lĂ &nbsp;:</p>
  194. <blockquote lang="en">
  195. <p>I choose requests from this list <mark>based on my current mood</mark> and what I would like to implement next. There is no secret sauce behind it. It’s all about building what people want.</p>
  196. <p><cite><em><a href="https://www.lunadio.com/blog/the-story-of-a-unicorn-solo-founder-making-dollar500000-arr/">The story of a unicorn solo founder making $500,000&nbsp;ARR</a></em> (<a href="/david/cache/2021/7a14f3cf8b05889a910c575726915486/">cache</a>)</cite></p>
  197. </blockquote>
  198. </details>
  199. <h2><a href="/david/2021/04/10/" title="Lien permanent vers cet article">Autrement</a> (2021-04-10)</h2>
  200. <details>
  201. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  202. <blockquote>
  203. <p>J’ai envie de pouvoir faire, penser, Ă©crire des choses inutiles, qui ne <em>servent</em> absolument Ă  rien. Des choses gratuites, dont les consĂ©quences ne sont pas importantes ou, de toute maniĂšre, ne constituent pas une cause finale. J’ai envie de faire aussi des choses nuisibles, qui nuisent Ă  l’impĂ©ratif de productivitĂ©, qui cassent cet espĂšce de flux insensĂ©. <mark>J’ai envie de perdre du temps</mark>, de dĂ©velopper un outil informatique qui ne sert Ă  rien, qui ne fonctionne pas, qui ne fait pas gagner du temps, qui n’est mĂȘme pas beau - car la beautĂ© aussi est assujettie Ă  l’utilitĂ©.</p>
  204. <p><cite><em><a href="http://blog.sens-public.org/marcellovitalirosati/cequipourrait/inutilite.html">Ce qui pourrait ĂȘtre autrement&nbsp;: Ă©loge de l’inutilitĂ©</a></em> (<a href="/david/cache/2021/0f611ad6e0e6b46c2d6a5da863d6e0be/">cache</a>)</cite></p>
  205. </blockquote>
  206. <p>À rapprocher de ce qui pourrait ĂȘtre <a href="/david/2021/03/09/" title="Fun">fun</a>. Je vous invite Ă  lire toute la sĂ©rie de Marcello intitulĂ©e «&nbsp;<a href="http://blog.sens-public.org/marcellovitalirosati/categories/cequipourrait/">Ce qui pourrait ĂȘtre autrement</a>&nbsp;».</p>
  207. </details>
  208. <h2><a href="/david/2021/03/19/" title="Lien permanent vers cet article">Support</a> (2021-03-19)</h2>
  209. <details>
  210. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  211. <blockquote lang="en">
  212. <p>Yes, not only that, also just experience with selling very low priced products and how that’s incompatible with the kind of companies that we run and the kind of service we want to offer. So we have a relatively large support department who spend a lot of time being very diligent and careful with all the customers they interact with. And the math on that is that like someone writes us an email and it costs about five bucks, you take all the costs involved with running support department. It costs about five dollars to answer an email.</p>
  213. <p>If you lower your price to the point where one email essentially put you under water on a on a customer relationship, <mark>you end up in a place where you don’t want to talk to your customers.</mark></p>
  214. <p><cite><em><a href="https://small-tech.org/videos/small-is-beautiful-07/">Small Is Beautiful livestream #7</a></em> (<a href="/david/cache/2021/184bcc38c39ce5b4d2f75fedd2c82198/">cache</a>)</cite></p>
  215. </blockquote>
  216. <p><em>Il y a beaucoup de choses intĂ©ressantes dans cette discussion, je remercie Laura et Aral d’avoir pris le temps de faire un transcript de l’échange qui me permet non seulement de le lire Ă  mon rythme mais en plus de l’archiver (bon et bien sĂ»r de le rendre accessible aux personnes en ayant davantage besoin).</em></p>
  217. <p>J’apprĂ©cie particuliĂšrement cette partie relative au support, qui lui donne un coĂ»t permettant d’arbitrer une intention. Lorsque l’on crĂ©e une chose, on y place un espoir dont on essaye de s’approcher. La difficultĂ© est de continuer Ă  partager cet espoir et/ou de le faire Ă©voluer sans renier totalement les conditions de son accession.</p>
  218. <p>Cette difficulté est un travail quotidien.</p>
  219. <blockquote lang="en">
  220. <p>We were about 45&nbsp;people, I think, at the time. We had four major products that were all sort of succeeding and growing. And we looked at that and said, you know what? We can’t continue with four major products at the same time, if we’re staying at 45&nbsp;people, we have to probably go to 150&nbsp;because there’s these tipping points where once you install this layer of management, you need a bunch more people and so on. So if we’re going to run this whole thing, I can see a straight path to us being 150, maybe 300&nbsp;people. And I looked at that and said, you know what, <mark>I don’t want to work there</mark>. I don’t want to work at a Basecamp of 300&nbsp;people.</p>
  221. <p><cite><em>Ibid.</em></cite></p>
  222. </blockquote>
  223. </details>
  224. <h2><a href="/david/2021/03/09/" title="Lien permanent vers cet article">Fun</a> (2021-03-09)</h2>
  225. <details>
  226. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  227. <blockquote lang="en">
  228. <p>And there’s plenty of other backfill features, as we like to call them. The stuff you’re just supposed to do. The things people will ask for.</p>
  229. <p>But people don’t ask for weird. They don’t ask for different. They even rarely ask for fun. Practical? Yup. Configurable? Definitely. Life is more than just that, though.</p>
  230. <p>[
]</p>
  231. <p>That’s why its <mark>our duty to stand up</mark> for weird/different/fun. Give it a seat at the planning table.</p>
  232. <p><cite><em><a href="https://world.hey.com/dhh/keep-hey-weird-de3e912c">Keep HEY weird</a></em> (<a href="/david/cache/2021/b0bb48391acd14185895724197f63417/">cache</a>)</cite></p>
  233. </blockquote>
  234. <p>C’est une des choses qui me titille avec les entretiens utilisateur·ices, les approches LEAN, etc. On obtient des produits plus pertinents, plus rapidement mais qu’en est-il de la partie fun&#8239;? C’est dĂ©jĂ  trĂšs bien d’arriver Ă  un outil fonctionnel mais comment le conjuguer Ă  une «&nbsp;humanitĂ©&nbsp;» imparfaite et surprenante&#8239;?</p>
  235. <p>Dans cet Ă©tau d’efficacitĂ©, on passe peut-ĂȘtre Ă  cĂŽtĂ© de quelque chose d’important. On court aprĂšs <q>une recherche aussi rapide que celle de Google</q>, <q>un achat aussi <em>1-click</em> que celui d’Amazon</q>, <q>une interface aussi simple que celle d’Apple</q> mais les fois oĂč j’ai des Ă©motions c’est quand je me connecte au site mĂȘme-pas-en-HTTPS de la ferme du coin pour commander des Ɠufs et qu’ils me rĂ©pondent manuellement pour me dire <q>À dimanche&#8239;!</q>.</p>
  236. </details>
  237. <h2><a href="/david/2021/03/03/" title="Lien permanent vers cet article">Vivre avec</a> (2021-03-03)</h2>
  238. <details>
  239. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  240. <blockquote>
  241. <p>Chaque jour de «&nbsp;vivre avec&nbsp;», les diffĂ©rents variants du virus circulent. Plus ils circulent, plus la probabilitĂ© de nouveaux variants augmente. En dĂ©cembre, quand les mĂ©dias ont commencĂ© Ă  parler de variants, les bavards ont jouĂ© les Ă©tonnĂ©s&nbsp;: Des variants&#8239;? Il y a des variants&#8239;? Quelle surprise&#8239;! Bah oui&#8239;! Des mutations. Des branches. Des variĂ©tĂ©s. Biologie Ă©lĂ©mentaire. Plus on laisse tourner cette saloperie, plus on risque de voir Ă©merger des variants. C’est ça aussi, le «&nbsp;vivre avec&nbsp;». Ça veut dire jouer avec le feu. Ça veut dire laisser brĂ»ler un immeuble, puis un quartier, voire toute une ville, en espĂ©rant que le feu en se propageant ne va pas atteindre une bonbonne de gaz, un bidon d’essence, ou un entrepĂŽt de produits chimiques.</p>
  242. <p>Chaque jour de «&nbsp;vivre avec&nbsp;», la peur fait son chemin. <mark>Chaque jour de «&nbsp;vivre avec&nbsp;», les esprits sont usĂ©s par les situations absurdes, les mensonges officiels, les injonctions contradictoires.</mark> Chaque jour de «&nbsp;vivre avec&nbsp;», les habitants de ce pays prennent conscience qu’ils ne peuvent plus compter sur leur pays. Chaque jour de «&nbsp;vivre avec&nbsp;», on rend les gens un peu plus fous – y compris l’auteur de ces lignes.</p>
  243. <p><cite><em><a href="https://prototypekblog.wordpress.com/2021/03/02/vivre-avec-les-fleaux/">Vivre avec les fléaux</a></em> (<a href="/david/cache/2021/f9327416703abe2963573a84d1d0a39e/">cache</a>)</cite></p>
  244. </blockquote>
  245. <p>Je ne vous cache pas qu’il m’est de plus en plus difficile de communiquer/implĂ©menter quotidiennement la doctrine gouvernementale. Faire un tel suivi me met <a href="/david/2020/05/26/">chaque jour depuis 9&nbsp;mois</a> aux premiĂšres loges des incohĂ©rences et autres revirements de situation. Le pire Ă©tant de faire le constat de l’accouchement, en un mot&nbsp;: douloureux. On attend toujours les doses de pĂ©ridurale
</p>
  246. <p>J’ai vraiment de l’empathie pour les 68&nbsp;millions de français·es qui n’y comprennent rien aux directives et c’est la raison pour laquelle je continue Ă  faire mon travail de vulgarisation/simplification mais je sais que je suis en train d’y laisser des plumes. Ne serait-ce que par le fait de <em>vivre avec</em> ce doute oppressant&nbsp;: suis-je vraiment en train de faire le moins de dĂ©gĂąts possible&#8239;?!</p>
  247. </details>
  248. <h2><a href="/david/2021/02/03/" title="Lien permanent vers cet article">Consentement</a> (2021-02-03)</h2>
  249. <details>
  250. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  251. <blockquote lang="en">
  252. <p>The Consentful Tech Project’s definition of good <mark>digital consent</mark> is adapted from Planned Parenthood’s definition of sexual consent, which abbreviates to the easy-to-remember, tasty acronym “FRIES.” According to this definition, consent must be:</p>
  253. <ul>
  254. <li><strong>Freely given.</strong> Doing something with someone is a decision that should be made without pressure, force, manipulation, or while incapacitated.</li>
  255. <li><strong>Reversible.</strong> Anyone can change their mind about what they want to do, at any time.</li>
  256. <li><strong>Informed.</strong> Be honest. For example, if someone says they’ll use protection and then they don’t, that’s not consent.</li>
  257. <li><strong>Enthusiastic.</strong> If someone isn’t excited, or really into it, that’s not consent.</li>
  258. <li><strong>Specific.</strong> Saying yes to one thing doesn’t mean they’ve said yes to others.</li>
  259. </ul>
  260. <p><cite><em><a href="https://www.consentfultech.io/">What is Consentful Tech?</a></em></cite></p>
  261. </blockquote>
  262. <p>Jolie dĂ©couverte <a href="https://www.internetactu.net/2021/02/03/design-justice-repolitiser-le-design/">via un auto-commentaire</a> (<a href="/david/cache/2021/6faa32ba37a3b1232125db9858700627/">cache</a>) de la part d’Hubert Guillaud sur un article bien dense aussi. Il y a un <a href="http://www.consentfultech.io/wp-content/uploads/2019/10/Building-Consentful-Tech.pdf">PDF de 300&#8239;Ko</a> (<a href="/static/david/2021/Building-Consentful-Tech.pdf">cache</a>) qui vient complĂ©ter la dĂ©finition et qui donne davantage de prĂ©cisions — dont celle-ci en particulier&nbsp;:</p>
  263. <blockquote lang="en">
  264. <p>“Fail faster” is a maxim of application developers these days. It means putting something out into the world quickly and responding to user feedback in future iterations. This is a great way to optimize the value of your application to your users, by starting with something simple and experimenting until you get the right features.</p>
  265. <p>[
]</p>
  266. <p>It isn’t enough to iterate features in response to harm — <mark>we must also iterate the process that lead to those features being released</mark>. What would that process look like if it was centered around the privacy and security of survivors of violence? Of people from communities that are regularly subject to state surveillance?</p>
  267. </blockquote>
  268. <p>Les plateformes peuvent s’excuser <em>a posteriori</em> mais qu’en est-il de <a href="/david/2021/01/06/" title="Clown d’État">rendre des comptes</a> sur ce qui a Ă©tĂ© mis en place en interne pour ne pas reproduire de telles situations&#8239;? VoilĂ  de quoi ajouter pas mal d’eau au moulin qui me sert de cerveau. Et pendant ce temps lĂ , j’apprends qu’il y a des <q>chiens de garde de la vie privĂ©e</q> au Canada&nbsp;:</p>
  269. <blockquote>
  270. <p>Le rapport note entre autres que l’entreprise amĂ©ricaine a constituĂ© une base de donnĂ©es de «&nbsp;plus de trois milliards d’images de visages&nbsp;», y compris ceux d’un grand nombre de Canadiens et d’enfants. Des forces policiĂšres y ont eu accĂšs, tout comme des organisations commerciales, et ce, <mark>sans le consentement des personnes</mark>, dĂ©plorent le commissaire Daniel Therrien et ses homologues du QuĂ©bec, de l’Alberta et de la Colombie-Britannique.</p>
  271. <p><cite><em><a href="https://www.ledevoir.com/societe/594536/reconnaissance-faciale-clearview-ai-a-viole-la-vie-privee-des-canadiens">Reconnaissance faciale: Clearview AI a violé la vie privée des Canadiens</a></em> (<a href="/david/cache/2021/0e0d866f920298fbc0624c03ddc83d24/">cache</a>)</cite></p>
  272. </blockquote>
  273. </details>
  274. <h2><a href="/david/2021/01/21/" title="Lien permanent vers cet article">Questionnements</a> (2021-01-21)</h2>
  275. <details>
  276. <summary>DĂ©plier pour lire le contenu de la publication</summary>
  277. <blockquote>
  278. <p>Parfois, l’individu ne trouve jamais sa place dans le monde, il se sent diffĂ©rent et peu concernĂ© par les mouvements autour de lui. ImmergĂ© dans l’exil intĂ©rieur, retranchĂ© de la sociabilitĂ© mĂȘme s’il accepte d’y participer sous une forme minimale, il est sĂ©parĂ© de l’univers des autres et existe dans son propre monde. Le poids de l’individualisation, la nĂ©cessitĂ© de toujours fournir l’effort d’ĂȘtre soi et de produire les apparences d’une prĂ©sence au sein de la sociabilitĂ© sont toujours menacĂ©s par la dĂ©pression mais Ă©galement par une forme plus discrĂšte, celle de l’impersonnalisation qui consiste Ă  ne plus se prĂȘter Ă  la comĂ©die de la disponibilitĂ© aux autres en occupant un angle mort au sein de la sociabilitĂ©. L’individu est dĂ©tachĂ©, indiffĂ©rent, mais il est toujours lĂ  sans se sentir tenu de participer. <mark>Face aux mouvements du monde qu’il n’arrive plus Ă  suivre</mark>, il revendique un droit Ă  l’abstention, au silence, Ă  l’effacement, au retrait.</p>
  279. <p><cite><em>DisparaĂźtre de soi</em>, David Le Breton</cite></p>
  280. </blockquote>
  281. <p>Je me rappelle Ă  la mĂȘme pĂ©riode il y a un an, je faisais dĂ©jĂ  le hamster en ski de fond sur l’üle d’à cĂŽtĂ©. Je tournais en me posant des questions sur mon implication dans la visibilitĂ©/popularitĂ© de l’État français et de son gouvernement actuel. À l’époque, il s’agissait de savoir s’il Ă©tait vraiment <a href="/david/2020/04/18/">pertinent</a> de le rendre en capacitĂ© d’encaisser un <abbr title="Distributed Denial of Service attack">DDoS</abbr> d’amendements de la part de <em>La France Insoumise</em> (pour rappel, 42&#8239;000&nbsp;amendements Ă  traiter en une mĂȘme sĂ©ance pour le Projet de loi sur les retraites, 49.3, etc.).</p>
  282. <p>Aujourd’hui, tout a changĂ© et rien n’a changĂ©. La situation est <a href="/david/2020/05/26/">bien diffĂ©rente</a> mais je me pose pourtant les mĂȘmes questions de fond (sans skis, enfin si, bref). Dans quelle mesure est-ce que je cautionne une doctrine en essayant de la rendre intelligible par le plus grand nombre&#8239;? À qui profite <em>vraiment</em> la rĂ©activitĂ© dont mon <a href="/david/blog/2019/faire-equipe/">Ă©quipe</a> peut faire preuve&#8239;?</p>
  283. <p><strong>De plus en plus tentĂ© de passer du coq Ă  l’arbre
</strong></p>
  284. </details>
  285. </main>
  286. <hr>
  287. <footer>
  288. <p>
  289. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  290. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  291. </svg> Accueil</a> ‱
  292. <a href="/david/log/" title="AccĂšs au flux RSS"><svg class="icon icon-rss2">
  293. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
  294. </svg> Suivre</a> ‱
  295. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  296. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
  297. </svg> Pro</a> ‱
  298. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  299. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
  300. </svg> Email</a> ‱
  301. <abbr class="nowrap" title="HĂ©bergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  302. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
  303. </svg> LĂ©gal</abbr>
  304. </p>
  305. <template id="theme-selector">
  306. <form>
  307. <fieldset>
  308. <legend><svg class="icon icon-brightness-contrast">
  309. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
  310. </svg> ThĂšme</legend>
  311. <label>
  312. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  313. </label>
  314. <label>
  315. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  316. </label>
  317. <label>
  318. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  319. </label>
  320. </fieldset>
  321. </form>
  322. </template>
  323. </footer>
  324. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  325. <script>
  326. function loadThemeForm(templateName) {
  327. const themeSelectorTemplate = document.querySelector(templateName)
  328. const form = themeSelectorTemplate.content.firstElementChild
  329. themeSelectorTemplate.replaceWith(form)
  330. form.addEventListener('change', (e) => {
  331. const chosenColorScheme = e.target.value
  332. localStorage.setItem('theme', chosenColorScheme)
  333. toggleTheme(chosenColorScheme)
  334. })
  335. const selectedTheme = localStorage.getItem('theme')
  336. if (selectedTheme && selectedTheme !== 'undefined') {
  337. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  338. }
  339. }
  340. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  341. window.addEventListener('load', () => {
  342. let hasDarkRules = false
  343. for (const styleSheet of Array.from(document.styleSheets)) {
  344. let mediaRules = []
  345. for (const cssRule of styleSheet.cssRules) {
  346. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  347. continue
  348. }
  349. // WARNING: Safari does not have/supports `conditionText`.
  350. if (cssRule.conditionText) {
  351. if (cssRule.conditionText !== prefersColorSchemeDark) {
  352. continue
  353. }
  354. } else {
  355. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  356. continue
  357. }
  358. }
  359. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  360. }
  361. // WARNING: do not try to insert a Rule to a styleSheet you are
  362. // currently iterating on, otherwise the browser will be stuck
  363. // in a infinite loop

  364. for (const mediaRule of mediaRules) {
  365. styleSheet.insertRule(mediaRule.cssText)
  366. hasDarkRules = true
  367. }
  368. }
  369. if (hasDarkRules) {
  370. loadThemeForm('#theme-selector')
  371. }
  372. })
  373. </script>
  374. </body>
  375. </html>