A place to cache linked articles (think custom and personal wayback machine)
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

index.html 14KB

il y a 9 mois
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="en">
  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>YOLO Ver (archive) — David Larlet</title>
  13. <meta name="description" content="Publication mise en cache pour en conserver une trace.">
  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. <!-- Is that even respected? Retrospectively? What a shAItshow…
  28. https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  29. <meta name="robots" content="noai, noimageai">
  30. <!-- Documented, feel free to shoot an email. -->
  31. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  32. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  33. <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>
  34. <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>
  35. <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>
  36. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  37. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  38. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  39. <script>
  40. function toggleTheme(themeName) {
  41. document.documentElement.classList.toggle(
  42. 'forced-dark',
  43. themeName === 'dark'
  44. )
  45. document.documentElement.classList.toggle(
  46. 'forced-light',
  47. themeName === 'light'
  48. )
  49. }
  50. const selectedTheme = localStorage.getItem('theme')
  51. if (selectedTheme !== 'undefined') {
  52. toggleTheme(selectedTheme)
  53. }
  54. </script>
  55. <meta name="robots" content="noindex, nofollow">
  56. <meta content="origin-when-cross-origin" name="referrer">
  57. <!-- Canonical URL for SEO purposes -->
  58. <link rel="canonical" href="https://yolover.org/">
  59. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  60. <article>
  61. <header>
  62. <h1>YOLO Ver</h1>
  63. </header>
  64. <nav>
  65. <p class="center">
  66. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  67. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  68. </svg> Accueil</a> •
  69. <a href="https://yolover.org/" title="Lien vers le contenu original">Source originale</a>
  70. <br>
  71. Mis en cache le 2024-02-09
  72. </p>
  73. </nav>
  74. <hr>
  75. <h2>Summary</h2>
  76. <p>
  77. Given a version number MAJOR.MINOR.PATCH, increment the:
  78. </p>
  79. <ol>
  80. <li>
  81. <strong>Major</strong> version whenever you feel like it.
  82. </li>
  83. <li>
  84. <strong>Minor</strong> version whenever you feel like it.
  85. </li>
  86. <li>
  87. <strong>Patch</strong> version whenever you feel like it.
  88. </li>
  89. </ol>
  90. <p>
  91. Additional labels for whatever you feel like are available as extensions to
  92. the MAJOR.MINOR.PATCH format. The more the merrier.
  93. </p>
  94. <h2>Introduction</h2>
  95. <p> For years the software industry has used systems like
  96. <a href="https://semver.org"><strong>semver</strong></a> and <a href="https://calver.org"><strong>calver</strong></a> to communicate with users
  97. what to expect in an update. The prescriptiveness of <strong>semver</strong>
  98. granting relief to the library user who only has to update from version 1.1.0
  99. to 1.1.1 to make most recent Snyk alert go away. The flexibility of
  100. <strong>calver</strong> allowing the busy application developer to release
  101. without fear, not needing to worry about whether a set of changes is
  102. significant enough to justify a 2.0.0 release and the awkward conversation
  103. with marketing that will ensue.
  104. </p>
  105. <p>
  106. But behind their promises, these systems are flawed. They do not
  107. represent the reality of modern software practice. This document aims to
  108. rectify that. It is a call to arms for the software community to embrace
  109. how people really version their software:
  110. <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  111. Ver</strong>.
  112. </p>
  113. <h2>Goals</h2>
  114. <p>
  115. The goals of <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  116. Ver</strong> are simple: to allow you to justify any version bump you
  117. want. You've changed stuff, who knows exactly what, and figuring out whether
  118. it's technically a major, minor, or patch change is too much work. All
  119. you really want to do is paste "bug fixes and performance improvements" into
  120. the patch notes and call it a day. <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  121. Ver</strong> is here to help.
  122. </p>
  123. <p>
  124. What follows are example conversations you might have with users that
  125. are not familiar with <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  126. Ver</strong>:
  127. </p>
  128. <h3>Example 1</h3>
  129. <ul>
  130. <li>
  131. <strong>User</strong>: The most recent patch-level release of your
  132. software broke our service in production. You shouldn't have done that.
  133. You should instead consider <strong>semver</strong> so your users know
  134. what to expect.
  135. </li>
  136. <li>
  137. <strong>You</strong>: lol, we use <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  138. Ver</strong>.
  139. </li>
  140. </ul>
  141. <h3>Example 2</h3>
  142. <ul>
  143. <li>
  144. <strong>User</strong>: The most recent major-level release of your
  145. software was a huge disappointment. Almost nothing changed. Why
  146. would you bump the major version for no reason?
  147. </li>
  148. <li>
  149. <strong>You</strong>: lol, we use <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  150. Ver</strong>.
  151. </li>
  152. </ul>
  153. <h3>Example 3</h3>
  154. <ul>
  155. <li>
  156. <strong>User</strong>: I can't figure out what the version number of your
  157. software means. Can you explain all of the parts? e.g. "Version
  158. 121.0.6167.139 (Official Build) (arm64)"
  159. </li>
  160. <li>
  161. <strong>You</strong>: lol, we use <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  162. Ver</strong>.
  163. </li>
  164. </ul>
  165. <h2>Specification</h2>
  166. <ol>
  167. <li>
  168. </li>
  169. </ol>
  170. <h2>Recommendations</h2>
  171. <p>
  172. While <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  173. Ver</strong> does not require any specific versioning scheme, we can
  174. recommend some best practices from industry to get you started.
  175. </p>
  176. <ol>
  177. <li>
  178. Never, <strong>ever</strong>, release a version 1.0.0. This ensures
  179. compatibility with <strong>semver</strong>.
  180. </li>
  181. <li>
  182. Ensure that some artefact if your build process makes it in to your
  183. version. This could be a build number, a git hash, or a timestamp. This
  184. introduces visual noise and makes it more difficult to know what's
  185. changed.
  186. </li>
  187. <li>
  188. If you have a direct competitor, ensure that your version numbers are
  189. higher than theirs. This will make you look more successful.
  190. </li>
  191. <li>
  192. Consider releasing a breaking change without modifying the version number
  193. at all. This will keep your users on their toes.
  194. </li>
  195. <li>
  196. Every once in a while, skip a number. People love mystery.
  197. </li>
  198. <li>
  199. If your software depends on other software, consider not specifying a
  200. version of those dependencies. This ensures all of your users get a unique
  201. experience.
  202. </li>
  203. </ol>
  204. <h2>Backus-Naur Form Grammar for valid <strong><span class="y">Y</span><span class="o">O</span><span class="l">L</span><span class="o2">O</span>
  205. Ver</strong> versions</h2>
  206. <pre>
  207. &amp;ltvalid-yolover&amp;gt ::= &amp;ltany-char&amp;gt &amp;ltvalid-yolover&amp;gt | &amp;ltany-char&amp;gt
  208. &lt;any-char&gt; ::= &lt;letter&gt; | &lt;digit&gt; | &lt;punctuation&gt; | &lt;symbol&gt; | &lt;whitespace&gt; |
  209. &lt;emoji&gt;
  210. &lt;letter&gt; ::= "a" | "b" | "c" | ... | "Z"
  211. &lt;digit&gt; ::= "0" | "1" | ... | "9"
  212. &lt;punctuation&gt; ::= "." | "," | ";" | ":" | "!" | "?" | "-" | "_" | ...
  213. &lt;symbol&gt; ::= "@" | "#" | "$" | "%" | "&amp;" | "*" | "(" | ")" | ...
  214. &lt;whitespace&gt; ::= " " | "\t" | "\n" | "\r"
  215. &lt;emoji&gt; ::= &lt;standard-emojis&gt; | &lt;extended-emojis&gt;
  216. &lt;standard-emojis&gt; ::= "😀" | "😂" | ... | &lt;any other standard emoji&gt;
  217. &lt;extended-emojis&gt; ::= "👨‍👨‍👧‍👦" | "🏳️‍🌈" | ... | &lt;any other extended or combined emoji&gt;
  218. </pre>
  219. <h2>License</h2>
  220. <p>
  221. <a href="http://www.wtfpl.net/">WTFPL</a>
  222. </p>
  223. <h2>Attribution</h2>
  224. <p>
  225. This document is a parody of <a href="https://semver.org/">semver</a> and
  226. <a href="https://calver.org/">calver</a>. It is not intended to be taken
  227. seriously.
  228. </p>
  229. </article>
  230. <hr>
  231. <footer>
  232. <p>
  233. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  234. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  235. </svg> Accueil</a> •
  236. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  237. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
  238. </svg> Suivre</a> •
  239. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  240. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
  241. </svg> Pro</a> •
  242. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  243. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
  244. </svg> Email</a> •
  245. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  246. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
  247. </svg> Légal</abbr>
  248. </p>
  249. <template id="theme-selector">
  250. <form>
  251. <fieldset>
  252. <legend><svg class="icon icon-brightness-contrast">
  253. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
  254. </svg> Thème</legend>
  255. <label>
  256. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  257. </label>
  258. <label>
  259. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  260. </label>
  261. <label>
  262. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  263. </label>
  264. </fieldset>
  265. </form>
  266. </template>
  267. </footer>
  268. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  269. <script>
  270. function loadThemeForm(templateName) {
  271. const themeSelectorTemplate = document.querySelector(templateName)
  272. const form = themeSelectorTemplate.content.firstElementChild
  273. themeSelectorTemplate.replaceWith(form)
  274. form.addEventListener('change', (e) => {
  275. const chosenColorScheme = e.target.value
  276. localStorage.setItem('theme', chosenColorScheme)
  277. toggleTheme(chosenColorScheme)
  278. })
  279. const selectedTheme = localStorage.getItem('theme')
  280. if (selectedTheme && selectedTheme !== 'undefined') {
  281. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  282. }
  283. }
  284. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  285. window.addEventListener('load', () => {
  286. let hasDarkRules = false
  287. for (const styleSheet of Array.from(document.styleSheets)) {
  288. let mediaRules = []
  289. for (const cssRule of styleSheet.cssRules) {
  290. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  291. continue
  292. }
  293. // WARNING: Safari does not have/supports `conditionText`.
  294. if (cssRule.conditionText) {
  295. if (cssRule.conditionText !== prefersColorSchemeDark) {
  296. continue
  297. }
  298. } else {
  299. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  300. continue
  301. }
  302. }
  303. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  304. }
  305. // WARNING: do not try to insert a Rule to a styleSheet you are
  306. // currently iterating on, otherwise the browser will be stuck
  307. // in a infinite loop…
  308. for (const mediaRule of mediaRules) {
  309. styleSheet.insertRule(mediaRule.cssText)
  310. hasDarkRules = true
  311. }
  312. }
  313. if (hasDarkRules) {
  314. loadThemeForm('#theme-selector')
  315. }
  316. })
  317. </script>
  318. </body>
  319. </html>