A place to cache linked articles (think custom and personal wayback machine)
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 14KB

3 vuotta sitten
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  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>#173: Experimental Jet Set (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. <!-- 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. <meta name="robots" content="noindex, nofollow">
  53. <meta content="origin-when-cross-origin" name="referrer">
  54. <!-- Canonical URL for SEO purposes -->
  55. <link rel="canonical" href="https://kneelingbus.substack.com/p/173-experimental-jet-set">
  56. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  57. <article>
  58. <header>
  59. <h1>#173: Experimental Jet Set</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 href="https://kneelingbus.substack.com/p/173-experimental-jet-set" title="Lien vers le contenu original">Source originale</a>
  67. </p>
  68. </nav>
  69. <hr>
  70. <p>A year ago I <a href="https://twitter.com/kneelingbus/status/1341999547107733515" rel="">tweeted</a> that when Netflix drops a big new show “it feels like a software update is being pushed to everyone's brain.” I’d recently noticed how <em>The Queen’s Gambit</em> had suddenly caused everyone to start talking about chess, as if the game itself was something we’d all just found out about. What that moment revealed to me was Netflix’s ability to program cultural discourse in a relatively direct way: You realize that a certain topic or event starts coming up frequently in conversations and social media posts—Fyre Festival, the ‘90s Chicago Bulls, chess—and then find out that topic is the subject of a Netflix blockbuster, living rent free in the hive mind (actually, getting <em>paid</em> to live there). Even now, but especially during the pandemic, there are only a few primary sources of large-scale collective experience, upstream of Twitter and TikTok, and Netflix has emerged as one of the most potent. In a sense, the streaming service is merely carrying the torch for 20th century mass media, which had a more comprehensive grip on the mainstream cultural agenda, but the phenomenon is more striking against the backdrop of today’s fragmented digital culture, serving as a prominent counterweight to the internet’s “long tail” (meanwhile, former touchstones like SNL and the <em>New York Times</em> are now generators of chum for social media consumption and metacommentary as much as they are primary sources of content). </p>
  71. <p>Last week, when we all suddenly started hearing about the Omicron COVID variant as Thanksgiving came to an end, it felt strangely similar to the manner in which Netflix seeds mainstream conversation topics, although the source was real-world events filtered through a multitude of media outlets. This isn’t an appraisal of the variant news itself, but rather an observation about how it reaches us: This strange resonance between fiction and contested fact—varieties of content that we encounter in a flat digital landscape—felt like a perfect post-2020 juxtaposition, in which reality and fantasy share equal billing and it all seems like a series of plot twists disseminated from some unseen writers’ room, a garbled narrative that in turn produces its own reality. Like climate change, COVID is settling into its status as a “permacrisis” as we approach the two-year mark, something that doesn’t just happen so much as it envelops us and becomes an enduring environment that we inhabit. <a href="https://twitter.com/johnrobb" rel="">John Robb</a>, who writes about technology and politics, predicted this week that the pandemic and climate change will soon fuse into one single permacrisis (if they haven’t already), characterized by ongoing amplification of fear, government restrictions, and consolidation of corporate power (the increasingly familiar playbook for long-term disasters). “In the disciplinary societies one was always starting again,” Deleuze <a href="http://home.lu.lv/~ruben/Deleuze%20-%20Postscript%20On%20The%20Societies%20Of%20Control.pdf" rel="">wrote</a>, “while in the societies of control one is never finished with anything.” Endlessness is inherent to the fabric of our reality now—feeds, <a href="https://reallifemag.com/loyalty-tests/" rel="">relationships with brands</a>, relationships with institutions, and yes, even catastrophes.</p>
  72. <p>The outcome of all this, Robb writes, will be the “virtualization of the middle class,” an effort for which the pandemic has provided a dry run: remote work and education, increased adoption of e-commerce, and a continuing expansion of online entertainment and digital socializing—pod life, if you will. Meanwhile, the implications of climate change demand that individuals adjust their behavior to reduce their carbon footprints. “The virtualization of middle-class behavior provided the first (and likely only) example of reducing carbon emissions at scale,” Robb writes. “It will will become the de facto goal of future climate change mitigation efforts.” So far, attempts to link environmental concerns to individual responsibility have been awkward—the elephant in the room is that everyone secretly hopes to expand their own carbon footprint even if everyone else’s shrinks (does anyone ever aspire to travel <em>less</em> next year?) From the climate hawk’s perspective, Robb notes, the massive global expansion of the “industrial middle-class lifestyle” during the 20th century was a disaster, and only something as drastic as a pandemic could even temporarily reverse that expansion. Going forward, the sustained version of such a reversal will be consumer-driven, but in a more ambiguous way. Robb cites the various developments currently being grouped under the metaverse umbrella: virtual and augmented reality, ongoing remote work and school, and digital versions of luxury goods (insert obligatory NFT reference here) as well as virtualization of food and transport via synthetic meat products and reduced car ownership, respectively. Some of these changes are even desirable but taken together, they amount to a downgrade from something more substantial—a lifestyle you might want for other people but hope to avoid yourself. Whether this all happens or not, however, the cultural programming is certain to continue, from Netflix and every other media purveyor, large and small; the more virtual our environment is, the more effectively we’ll all receive the updates.</p>
  73. </article>
  74. <hr>
  75. <footer>
  76. <p>
  77. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  78. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  79. </svg> Accueil</a> •
  80. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  81. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use>
  82. </svg> Suivre</a> •
  83. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  84. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use>
  85. </svg> Pro</a> •
  86. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  87. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use>
  88. </svg> Email</a> •
  89. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  90. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use>
  91. </svg> Légal</abbr>
  92. </p>
  93. <template id="theme-selector">
  94. <form>
  95. <fieldset>
  96. <legend><svg class="icon icon-brightness-contrast">
  97. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use>
  98. </svg> Thème</legend>
  99. <label>
  100. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  101. </label>
  102. <label>
  103. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  104. </label>
  105. <label>
  106. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  107. </label>
  108. </fieldset>
  109. </form>
  110. </template>
  111. </footer>
  112. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  113. <script>
  114. function loadThemeForm(templateName) {
  115. const themeSelectorTemplate = document.querySelector(templateName)
  116. const form = themeSelectorTemplate.content.firstElementChild
  117. themeSelectorTemplate.replaceWith(form)
  118. form.addEventListener('change', (e) => {
  119. const chosenColorScheme = e.target.value
  120. localStorage.setItem('theme', chosenColorScheme)
  121. toggleTheme(chosenColorScheme)
  122. })
  123. const selectedTheme = localStorage.getItem('theme')
  124. if (selectedTheme && selectedTheme !== 'undefined') {
  125. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  126. }
  127. }
  128. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  129. window.addEventListener('load', () => {
  130. let hasDarkRules = false
  131. for (const styleSheet of Array.from(document.styleSheets)) {
  132. let mediaRules = []
  133. for (const cssRule of styleSheet.cssRules) {
  134. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  135. continue
  136. }
  137. // WARNING: Safari does not have/supports `conditionText`.
  138. if (cssRule.conditionText) {
  139. if (cssRule.conditionText !== prefersColorSchemeDark) {
  140. continue
  141. }
  142. } else {
  143. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  144. continue
  145. }
  146. }
  147. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  148. }
  149. // WARNING: do not try to insert a Rule to a styleSheet you are
  150. // currently iterating on, otherwise the browser will be stuck
  151. // in a infinite loop…
  152. for (const mediaRule of mediaRules) {
  153. styleSheet.insertRule(mediaRule.cssText)
  154. hasDarkRules = true
  155. }
  156. }
  157. if (hasDarkRules) {
  158. loadThemeForm('#theme-selector')
  159. }
  160. })
  161. </script>
  162. </body>
  163. </html>