Merge branch 'main' into convolve

.github/workflows/pr-check-lint_content.yml

@@ -101,6 +101,12 @@ jobs:
           echo "FM_LINT_FAILED=${FM_LINT_FAILED}" >> $GITHUB_ENV
 
           echo "Running Prettier"
+          PRETTIER_FAILED=false
+          PRETTIER_LOG=$(yarn prettier --check ${files_to_lint} 2>&1) || PRETTIER_FAILED=true
+          echo "PRETTIER_LOG<<${EOF}" >> $GITHUB_ENV
+          echo "${PRETTIER_LOG}" >> $GITHUB_ENV
+          echo "${EOF}" >> $GITHUB_ENV
+          echo "PRETTIER_FAILED=${PRETTIER_FAILED}" >> $GITHUB_ENV
           yarn prettier -w ${files_to_lint}
 
           if [[ -n $(git diff) ]]; then
@@ -110,16 +116,17 @@ jobs:
           # info for troubleshooting
           echo MD_LINT_FAILED=${MD_LINT_FAILED}
           echo FM_LINT_FAILED=${FM_LINT_FAILED}
+          echo PRETTIER_FAILED=${PRETTIER_FAILED}
           git diff
 
       - name: Setup reviewdog
-        if: env.FILES_MODIFIED == 'true' || env.MD_LINT_FAILED == 'true'
+        if: ${{ env.FILES_MODIFIED == 'true' || env.MD_LINT_FAILED == 'true' }}
         uses: reviewdog/action-setup@v1
         with:
           reviewdog_version: latest
 
       - name: Suggest changes using diff
-        if: env.FILES_MODIFIED == 'true'
+        if: ${{ env.FILES_MODIFIED == 'true' }}
         env:
           REVIEWDOG_GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
@@ -134,7 +141,7 @@ jobs:
             -reporter=github-pr-review < "${TMPFILE}"
 
       - name: Add reviews for markdownlint errors
-        if: env.MD_LINT_FAILED == 'true'
+        if: ${{ env.MD_LINT_FAILED == 'true' }}
         env:
           REVIEWDOG_GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
@@ -147,11 +154,31 @@ jobs:
             -reporter="github-pr-review"
 
       - name: Fail if any issues pending
-        if: env.FILES_MODIFIED == 'true' || env.MD_LINT_FAILED == 'true' || env.FM_LINT_FAILED == 'true'
+        if: ${{ env.FILES_MODIFIED == 'true' || env.MD_LINT_FAILED == 'true' || env.FM_LINT_FAILED == 'true' }}
+        env:
+          MD_LINT_FAILED: ${{ env.MD_LINT_FAILED }}
+          FM_LINT_FAILED: ${{ env.FM_LINT_FAILED }}
+          PRETTIER_FAILED: ${{ env.PRETTIER_FAILED }}
+          MD_LINT_LOG: ${{ env.MD_LINT_LOG }}
+          FM_LINT_LOG: ${{ env.FM_LINT_LOG }}
+          PRETTIER_LOG: ${{ env.PRETTIER_LOG }}
         run: |
-          echo -e "\nLogs from markdownlint:"
-          echo "${MD_LINT_LOG}"
-          echo -e "\nLogs from front-matter linter:"
-          echo "${FM_LINT_LOG}"
-          echo -e "\nPlease fix all the linting issues mentioned in above logs and in the review comments."
+          echo -e "\nPlease fix all the linting issues mentioned in the following logs and in the PR review comments."
+
+          if [[ ${MD_LINT_FAILED} == 'true' ]]; then
+            echo -e "\n\n🪵 Logs from markdownlint:"
+            echo "${MD_LINT_LOG}"
+          fi
+
+          if [[ ${FM_LINT_FAILED} == 'true' ]]; then
+            echo -e "\n\n🪵 Logs from front-matter linter:"
+            echo "${FM_LINT_LOG}"
+          fi
+
+          if [[ ${PRETTIER_FAILED} == 'true' ]]; then
+            echo -e "\n\n🪵 Logs from Prettier formatter:"
+            echo "${PRETTIER_LOG}"
+            echo -e "\nYou can use Prettier playground to format the files online (configuration pre-filled): https://prettier.io/playground/#N4Igxg9gdgLgprEAuEBiABABwIYGd7owAWc6CMAlgE6kBmFANqSTSADQgSaXS7KjYqVCAHcACoIR8U2BiOwBPPhwBGVbGADWcGAGVsAWzgAZClDjIYVAK5xV6rTt04wZgOaWbdkLjgGKnrYccAAemHBUFEawsgAqEVCCFHDStLK+HLjuTACK1hDwyGkMGSAAVrghutlweQUWSMWlAI758GLCmNIgeAC05nAAJkPsIFbYjO4AwhAGBtjIPQwMo1lQbkwAgjBWFCrW7RGm5kXp3kQwBgwA6kQU8LgucLpS9xQAbvcKi2C4yiDvWwASSgw1gujAkW4m1BuhgCiYpxK3kwwl813UmEWqJSEXeFg4Zl8VBgHWwbnmSNKOCoxMW8yomkGoigo1RZhg1wog2IyAAHAAGDg0VrUOBkikLRpnDgwbAqLk8ojIABMHGsvli8tSMpAfhUQ2Gg2M2HW1nJcAAYhAqPMdu5FtgDhAQABfV1AA \n"
+          fi
+
           exit 1

.vscode/dictionaries/ignore-list.txt

@@ -5,6 +5,7 @@ aaba
 aabaac
 aabbcc
 aabbccdd
+AACA
 aacbbbcac
 abaac
 abbbbbc
@@ -110,6 +111,7 @@ DSWbdfnrstvw
 dubby
 Duden
 dXNlcm5hbWU6cGFzc3dvcmQ
+EACC
 eirmod
 elitr
 ERHGDFy
@@ -144,6 +146,7 @@ futurelibrary.no
 gaesamplesite
 gims
 globalprivacycontrol.org
+glossarysidebar.yaml
 GNF576746573fhdg4737dh4
 gogerychwyrndrobwllllantysiliogogogoch
 Graece
@@ -182,6 +185,7 @@ kitchensink
 lambdatest
 Latine
 latinmodern-math
+learntocodewith.me
 leopardskin
 letmein
 libpkcs11testmodule
@@ -198,6 +202,7 @@ magis
 Mand
 manis
 Markmarkimark
+mdnsidebar.yaml
 megastore
 meinheld
 montecarlo

.vscode/dictionaries/non-english.txt

@@ -71,6 +71,7 @@ setembro
 shān
 studiorum
 tiene
+Tipos
 traducido
 trimestre
 tslí

.vscode/dictionaries/proper-names.txt

@@ -3,6 +3,7 @@ a11ysupport
 Academind
 Acrosync
 Addy
+Adham
 Adilah
 Akhgari
 alastairc
@@ -14,6 +15,7 @@ Amorim
 AMPPS
 Amstelvar
 Anand
+ANDI
 Andreessen
 Andrzej
 Anek
@@ -56,6 +58,7 @@ Bloggs
 Bocoup
 Boonie
 bottosson
+Boulton
 Brians
 Browserleaks
 Browsershots
@@ -65,6 +68,7 @@ BugZilla
 Bundlesize
 Bunyakovsky
 Burson
+Butterick
 Buzzcocks
 Bynens
 Bézier
@@ -81,6 +85,7 @@ Caterina
 Chadha
 Chakra
 Chamakh
+Chimero
 Chloé
 chrisdavidmills
 chrismills
@@ -101,6 +106,7 @@ Colomb
 ColorZilla
 Conde
 Condei
+COPPA
 Corber
 Cortana
 Coursera
@@ -116,6 +122,7 @@ Célestes
 Dahlkemper
 Dailymotion
 Danilo
+Dannaway
 Darmok
 Datumizer
 davbrito
@@ -172,6 +179,7 @@ Esben
 ethertank
 Exljbris
 Fairchild
+FDCP
 ffconf
 FileZilla
 Firefogg
@@ -220,6 +228,7 @@ Hidde
 Highrise
 Hildy
 hmatrjp
+Hobday
 Hobson
 hochan
 Hochberg
@@ -471,6 +480,7 @@ Rekapi
 Remy
 Resig
 Rhiana
+Riazhskikh
 Rigby
 Rocher
 Rohini

.vscode/dictionaries/terms-abbreviations.txt

@@ -21,6 +21,7 @@ ANMF
 anonymization
 antialiasing
 antitracking
+apideck
 APNG
 appcontent
 arcosh
@@ -94,7 +95,6 @@ catchable
 CAVLC
 CCPA
 CCPL
-CDLR
 CELP
 CGATS
 cheatsheet
@@ -529,6 +529,7 @@ quickmenu
 qvalues
 QWERTZ
 randomizer
+rari
 rasterizes
 RDBMS
 RDBMSes
@@ -562,6 +563,7 @@ retarget
 retargeted
 retargeting
 retargetings
+reviewdog
 RFCOMM
 RGTC
 roadmaps
@@ -879,6 +881,7 @@ xrayed
 Xrays
 XRCPU
 XSSI
+yari
 yearless
 Zalgo
 zoomable

CONTRIBUTING.md

@@ -200,12 +200,7 @@ This will make it easier to submit a pull request for your changes.
 2. Open a browser and navigate to the equivalent pages you've changed.
    If you changed `files/en-us/web/javascript/index.md`, you would navigate to `http://localhost:5042/en-us/docs/web/javascript` in your browser, for example.
 
-3. Check for errors by clicking `Show flaws` on each previewed page.
-   You may be able to fix flaws by running:
-
-   ```bash
-   yarn content flaws <page_slug>
-   ```
+3. Check for detected flaws at the top of the previewed page. Some flaws may be automatically fixable.
 
 4. Commit your changes to the branch (our example is using the `fix-typo` branch) and push the changes to your fork's remote:
 
@@ -254,7 +249,8 @@ yarn content move <from-slug> <to-slug> [locale]
 > See the [Redirecting a document](#redirecting-a-document) section for more information.
 
 To use `yarn content move`, provide the slug of the document you'd like to move (e.g., `Learn/Accessibility`), and the slug of its new location (e.g., `Learn/A11y`).
-The locale of the existing document can be provided as an optional third argument (this defaults to `en-US`).
+The locale of the existing document can be provided as an optional third argument (this defaults to `en-US`). For other locales,
+`CONTENT_TRANSLATED_ROOT` has to be set correctly in your environment.
 If the document you'd like to move contains child documents (i.e. it represents a document tree), the `yarn content move` command will move the entire tree.
 
 Let's say you want to move the entire `/en-US/Learn/Accessibility` tree to `/en-US/Learn/A11y`, you can do so as follows:

files/en-us/_redirects.txt

@@ -3597,6 +3597,7 @@
 /en-US/docs/Glossary/SSL_Glossary	/en-US/docs/Glossary/SSL
 /en-US/docs/Glossary/Scrollport	/en-US/docs/Glossary/Scroll_container
 /en-US/docs/Glossary/Second-level_Domain	/en-US/docs/Glossary/SLD
+/en-US/docs/Glossary/Self-Executing_Anonymous_Function	/en-US/docs/Glossary/IIFE
 /en-US/docs/Glossary/Serialize	/en-US/docs/Glossary/Serialization
 /en-US/docs/Glossary/Simple_header	/en-US/docs/Glossary/CORS-safelisted_request_header
 /en-US/docs/Glossary/Simple_response_header	/en-US/docs/Glossary/CORS-safelisted_response_header
@@ -11765,7 +11766,6 @@
 /en-US/docs/Web/CSS/::cue-region	/en-US/docs/Web/API/WebVTT_API
 /en-US/docs/Web/CSS/:@-moz-document	/en-US/docs/Web/CSS/@document
 /en-US/docs/Web/CSS/:any	/en-US/docs/Web/CSS/:is
-/en-US/docs/Web/CSS/:closed	/en-US/docs/Web/CSS/:popover-open
 /en-US/docs/Web/CSS/:dir()	/en-US/docs/Web/CSS/:dir
 /en-US/docs/Web/CSS/:host()	/en-US/docs/Web/CSS/:host_function
 /en-US/docs/Web/CSS/:lang()	/en-US/docs/Web/CSS/:lang
@@ -11778,7 +11778,6 @@
 /en-US/docs/Web/CSS/:nth-last-col	/en-US/docs/Web/CSS/:nth-last-of-type
 /en-US/docs/Web/CSS/:nth-last-of-type()	/en-US/docs/Web/CSS/:nth-last-of-type
 /en-US/docs/Web/CSS/:nth-of-type()	/en-US/docs/Web/CSS/:nth-of-type
-/en-US/docs/Web/CSS/:open	/en-US/docs/Web/CSS/:popover-open
 /en-US/docs/Web/CSS/@-moz-document	/en-US/docs/Web/CSS/@document
 /en-US/docs/Web/CSS/@font-face/font-variant	/en-US/docs/Web/CSS/@font-face
 /en-US/docs/Web/CSS/@media/update-frequency	/en-US/docs/Web/CSS/@media/update

files/en-us/_wikihistory.json

@@ -4495,10 +4495,6 @@
     "modified": "2020-10-05T12:31:04.165Z",
     "contributors": ["alattalatta", "darby", "klez", "devanshmanu", "jswisher"]
   },
-  "Glossary/Self-Executing_Anonymous_Function": {
-    "modified": "2019-09-24T05:50:18.861Z",
-    "contributors": ["natevw", "Porkepix", "chrisdavidmills"]
-  },
   "Glossary/Semantics": {
     "modified": "2020-11-27T04:59:07.153Z",
     "contributors": [

files/en-us/glossary/compile/index.md

@@ -10,7 +10,7 @@ page-type: glossary-definition
 
 Typically, a compiler transforms code written in a higher-level language such as [C++](https://en.wikipedia.org/wiki/C++), [Rust](<https://en.wikipedia.org/wiki/Rust_(programming_language)>), or [Java](<https://en.wikipedia.org/wiki/Java_(programming_language)>) into executable (runnable) code — so-called **binary code** or **machine code**. [WebAssembly](/en-US/docs/WebAssembly), for example, is a form of executable binary code that [can be compiled from code written in C++, Rust, C#, Go, Swift, and several other languages](https://webassembly.org/getting-started/developers-guide/) and run on any web page, with most features supported in modern browsers (see [browser compatibility table](/en-US/docs/WebAssembly#browser_compatibility)).
 
-Most compilers perform either ahead-of-time (AOT) compilation or just-in-time (JIT) compilation.
+Most compilers perform either ahead-of-time (AOT) compilation or {{glossary("Just In Time Compilation", "just-in-time (JIT)")}} compilation.
 
 The GNU `gcc` compiler is one well-known example of an AOT compiler. AOT compilers are typically invoked from the command line in a shell environment (from within a terminal or console) or within an {{Glossary("IDE")}}.
 
@@ -22,3 +22,5 @@ Compilers may also translate among higher-level languages — for example, from
 
 - [Compiler](https://en.wikipedia.org/wiki/Compiler) on Wikipedia
 - [WebAssembly](/en-US/docs/WebAssembly)
+- Related glossary terms:
+  - {{glossary("Just In Time Compilation", "Just-In-Time (JIT)")}}

files/en-us/glossary/csr/index.md

@@ -0,0 +1,46 @@
+---
+title: Client-side rendering (CSR)
+slug: Glossary/CSR
+page-type: glossary-definition
+---
+
+{{GlossarySidebar}}
+
+**Client-side rendering** (CSR) refers to the practice of generating HTML content using JavaScript in the browser. CSR is opposed to {{glossary("SSR", "server-side rendering")}}, where the server generates the HTML content. Both techniques are not mutually exclusive and can be used together in the same application.
+
+A pure CSR app may return the following HTML content:
+
+```html
+<!doctype html>
+<html>
+  <head>
+    <title>My App</title>
+    <script src="bundle.js"></script>
+  </head>
+  <body>
+    <div id="root"></div>
+    <noscript>
+      <p>This app requires JavaScript to run.</p>
+    </noscript>
+  </body>
+</html>
+```
+
+Then, the actual page content is generated by JavaScript in `bundle.js`, using [DOM manipulation](/en-US/docs/Web/API/Document_Object_Model).
+
+Benefits of CSR include:
+
+- Interactivity: any page update, including route transitions, do not require a full page reload. This makes the app feel faster and more responsive.
+- Performance: the server only needs to send the initial HTML content and JavaScript assets. Subsequent page updates can be fetched from an API, which can be faster than fetching a full HTML page, and causes less load on the server.
+
+Both SSR and CSR have their performance tradeoffs, and a mix of SSR and CSR can be used to combine the benefits of both techniques. For example, the server can generate a page skeleton with empty placeholders, and the client can fetch additional data and update the page as needed.
+
+Note that {{glossary("SPA", "single-page applications")}} do not require the site to be CSR. Modern frameworks, such as [React](/en-US/docs/Learn_web_development/Core/Frameworks_libraries/React_getting_started), [Vue](/en-US/docs/Learn_web_development/Core/Frameworks_libraries/Vue_getting_started), and [Svelte](/en-US/docs/Learn_web_development/Core/Frameworks_libraries/Svelte_getting_started), can be used to build SPAs with SSR capabilities.
+
+## See also
+
+- [Introduction to client-side frameworks > server-side rendering](/en-US/docs/Learn_web_development/Core/Frameworks_libraries/Introduction#server-side_rendering)
+- [Client-side rendering](https://en.wikipedia.org/wiki/Client-side_rendering) on Wikipedia
+- {{glossary("SSR", "Server-side rendering")}}
+- {{glossary("SSG", "Static site generator")}}
+- {{glossary("SPA", "Single-page application")}}

files/en-us/glossary/head_of_line_blocking/index.md

@@ -0,0 +1,19 @@
+---
+title: Head-of-line blocking
+slug: Glossary/Head_of_line_blocking
+page-type: glossary-definition
+---
+
+{{GlossarySidebar}}
+
+In computer networking, **head-of-line blocking** (_HOL blocking_) refers to a performance bottleneck that occurs when a queue of packets is held up by the first packet in the queue, even though other packets in the queue could be processed.
+
+In HTTP/1.1, HOL blocking can occur when a client sends multiple requests to a {{glossary("server")}} without waiting for the responses. The server processes the requests in order, but if the response to the first request is delayed, the responses to subsequent requests are also delayed. HTTP/2 addresses this issue through request multiplexing, eliminating HOL blocking in the application layer, but it still exists at the transport ({{glossary("TCP")}}) layer.
+
+## See also
+
+- Related glossary terms
+  - {{glossary("HTTP")}}, {{glossary("HTTP 2", "HTTP/2")}}
+  - {{glossary("TCP")}}
+- [Populating the page: how browsers work](/en-US/docs/Web/Performance/How_browsers_work)
+- [Head-of-line blocking](https://en.wikipedia.org/wiki/Head-of-line_blocking) on Wikipedia

files/en-us/glossary/http_2/index.md

@@ -8,7 +8,7 @@ page-type: glossary-definition
 
 **HTTP/2** is a major revision of the [HTTP network protocol](/en-US/docs/Web/HTTP).
 
-The primary goals for HTTP/2 are to reduce {{glossary("latency")}} and head-of-line blocking by enabling full request and response multiplexing, minimize protocol overhead via efficient compression of HTTP header fields (HPACK), and support for request prioritization.
+The primary goals for HTTP/2 are to reduce {{glossary("latency")}} and {{glossary("head of line blocking", "head-of-line blocking")}} by enabling full request and response multiplexing, minimize protocol overhead via efficient compression of HTTP header fields (HPACK), and support for request prioritization.
 
 HTTP/2 also introduced a mechanism called Server Push, which allowed a server to send resources to a client in anticipation that the client would need them very soon.
 Server Push proved tricky to implement in practice, and has been removed from most major browser engines.