3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-06-06 21:03:47 +02:00
Code Issues Projects Releases Packages Wiki Activity
docusaurus/assets/js/52aace1b.6ddc84ef.js
slorber a070dd9c97 deploy: 1c454a9430
2025-05-30 17:26:10 +00:00

1 line
No EOL
29 KiB
JavaScript
Raw Blame History

"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([["33415"],{67079:function(e,s,n){n.d(s,{Z:()=>t});let t={browserWindow:"browserWindow_my1Q",browserWindowHeader:"browserWindowHeader_jXSR",row:"row_KZDM",buttons:"buttons_uHc7",right:"right_oyze",browserWindowAddressBar:"browserWindowAddressBar_Pd8y",dot:"dot_giz1",browserWindowMenuIcon:"browserWindowMenuIcon_Vhuh",bar:"bar_rrRL",browserWindowBody:"browserWindowBody_Idgs"}},3826:function(e,s,n){n.d(s,{Z:()=>t});let t=n.p+"assets/images/social-card-b49b847d6c81d30ed3b8fff82aed14b5.png"},50443:function(e,s,n){n.d(s,{Z:()=>t});let t=n.p+"assets/images/social-card-b49b847d6c81d30ed3b8fff82aed14b5.png"},47799:function(e,s,n){n.r(s),n.d(s,{assets:()=>u,contentTitle:()=>d,default:()=>m,frontMatter:()=>c,metadata:()=>t,toc:()=>h});var t=n(18947),r=n(85893),a=n(80980),i=n(44456),o=n(51118),l=n(20835);let c={title:"Docusaurus 3.8",authors:["slorber"],tags:["release"],image:"./img/social-card.png",date:new Date("2025-05-26T00:00:00.000Z")},d=void 0,u={image:n(3826).Z,authorsImageUrls:[void 0]},h=[{value:"Performance",id:"performance",level:2},{value:"Docusaurus Faster",id:"docusaurus-faster",level:3},{value:"Persistent Cache",id:"persistent-cache",level:4},{value:"Worker Threads",id:"worker-threads",level:4},{value:"Other Optimizations",id:"other-optimizations",level:3},{value:"Impact",id:"impact",level:3},{value:"Future Flags",id:"future-flags",level:2},{value:"CSS Cascade Layers",id:"css-cascade-layers",level:3},{value:"<code>postBuild()</code> Change",id:"postbuild-change",level:3},{value:"System Color Mode",id:"system-color-mode",level:2},{value:"Code Block Refactor",id:"code-block-refactor",level:2},{value:"Translations",id:"translations",level:2},{value:"Maintenance",id:"maintenance",level:2},{value:"Other changes",id:"other-changes",level:2}];function p(e){let s={a:"a",admonition:"admonition",code:"code",h2:"h2",h3:"h3",h4:"h4",img:"img",li:"li",p:"p",pre:"pre",strong:"strong",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",ul:"ul",...(0,a.a)(),...e.components},{Details:t}=s;return t||function(e,s){throw Error("Expected "+(s?"component":"object")+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}("Details",!0),(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(s.p,{children:["We are happy to announce ",(0,r.jsx)(s.strong,{children:"Docusaurus 3.8"}),"."]}),"\n",(0,r.jsx)(s.p,{children:'This release improves build performance, includes new features and introduces "Future Flags" to prepare your site for Docusaurus 4.'}),"\n",(0,r.jsxs)(s.p,{children:["Upgrading is easy. We follow ",(0,r.jsx)(s.a,{href:"https://semver.org/",children:"Semantic Versioning"}),", and minor version updates have ",(0,r.jsx)(s.strong,{children:"no breaking changes"}),", accordingly to our ",(0,r.jsx)(s.a,{href:"/community/release-process",children:"release process"}),"."]}),"\n",(0,r.jsx)(s.p,{children:(0,r.jsx)(s.img,{alt:"Docusaurus blog post social card",src:n(50443).Z+"",width:"1200",height:"600"})}),"\n","\n","\n",(0,r.jsx)(s.h2,{id:"performance",children:"Performance"}),"\n",(0,r.jsx)(s.p,{children:"This release keeps improving our build infrastructure performance with various optimizations, and 2 new Docusaurus Faster options."}),"\n",(0,r.jsx)(s.h3,{id:"docusaurus-faster",children:"Docusaurus Faster"}),"\n",(0,r.jsxs)(s.p,{children:[(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/issues/10556",children:"Docusaurus Faster"})," has been introduced in ",(0,r.jsx)(s.a,{href:"/blog/releases/3.6#docusaurus-faster",children:"Docusaurus v3.6"}),", and permits you to opt-in for our upgraded build infrastructure and helps you build your site much faster. The experimental flags can be turned on individually, but we recommend to turn them all at once with this convenient shortcut:"]}),"\n",(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-js",children:"const config = {\n future: {\n // highlight-next-line\n experimental_faster: true,\n },\n};\n"})}),"\n",(0,r.jsx)(s.admonition,{type:"tip",children:(0,r.jsxs)(s.p,{children:["Don't forget to install the ",(0,r.jsx)(s.code,{children:"@docusaurus/faster"})," dependency first!"]})}),"\n",(0,r.jsx)(s.h4,{id:"persistent-cache",children:"Persistent Cache"}),"\n",(0,r.jsxs)(s.p,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10931",children:"#10931"}),", we have enabled the ",(0,r.jsx)(s.strong,{children:(0,r.jsx)(s.a,{href:"https://rspack.dev/blog/announcing-1-2#persistent-cache",children:"Rspack persistent cache"})}),". Similarly to the ",(0,r.jsx)(s.a,{href:"https://webpack.js.org/blog/2020-10-10-webpack-5-release/#persistent-caching",children:"Webpack persistent cache"})," (already supported), it permits to greatly speed up the bundling of the Docusaurus app on subsequent builds."]}),"\n",(0,r.jsxs)(s.p,{children:["In practice, your site should build much faster if you run ",(0,r.jsx)(s.code,{children:"docusaurus build"})," a second time."]}),"\n",(0,r.jsxs)(s.p,{children:["This feature depends on using the ",(0,r.jsx)(s.a,{href:"https://rspack.dev/",children:"Rspack bundler"}),", and can be turned on with the ",(0,r.jsx)(s.code,{children:"rspackPersistentCache"})," flag:"]}),"\n",(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-js",children:"const config = {\n future: {\n experimental_faster: {\n // highlight-start\n rspackBundler: true, // required flag\n rspackPersistentCache: true, // new flag\n // highlight-end\n },\n },\n};\n"})}),"\n",(0,r.jsxs)(s.admonition,{title:"Preserving the cache",type:"caution",children:[(0,r.jsxs)(s.p,{children:["The persistent cache requires preserving the ",(0,r.jsx)(s.code,{children:"./node_modules/.cache"})," folder across builds."]}),(0,r.jsx)(s.p,{children:"Popular CDNs such as Netlify and Vercel do that for you automatically. Depending on your CI and deployment pipeline, additional configuration can be needed to preserve the cache."})]}),"\n",(0,r.jsxs)(s.p,{children:[(0,r.jsx)(s.strong,{children:"Result"}),": On average, you can expect your site's bundling time to be ~2-5\xd7 faster on rebuilds \uD83D\uDD25. The impact can be even more significant if you ",(0,r.jsxs)(s.a,{href:"https://github.com/facebook/docusaurus/discussions/11199",children:["disable the optional ",(0,r.jsx)(s.code,{children:"concatenateModule"})," optimization"]}),"."]}),"\n",(0,r.jsx)(s.h4,{id:"worker-threads",children:"Worker Threads"}),"\n",(0,r.jsxs)(s.p,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10826",children:"#10826"}),", we introduced a ",(0,r.jsx)(s.a,{href:"https://github.com/tinylibs/tinypool",children:"Node.js Worker Thread pool"})," to run the static side generation code. With this new strategy, we can better leverage all the available CPUs, reduce static site generation time, and contain potential memory leaks."]}),"\n",(0,r.jsxs)(s.p,{children:["This feature can be turned on with the ",(0,r.jsx)(s.code,{children:"ssgWorkerThreads"})," flag, and requires the ",(0,r.jsx)(s.a,{href:"#postbuild-change",children:(0,r.jsx)(s.code,{children:"v4.removeLegacyPostBuildHeadAttribute"})})," Future Flag to be turned on:"]}),"\n",(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-js",children:"const config = {\n future: {\n v4: {\n // highlight-next-line\n removeLegacyPostBuildHeadAttribute: true, // required\n },\n experimental_faster: {\n // highlight-next-line\n ssgWorkerThreads: true,\n },\n },\n};\n"})}),"\n",(0,r.jsxs)(s.p,{children:[(0,r.jsx)(s.strong,{children:"Result"}),": On average, you can expect your site's static site generation time to be ~2\xd7 times faster \uD83D\uDD25. This was measured on a MacBook Pro M3 and result may vary depending on your CI."]}),"\n",(0,r.jsx)(s.h3,{id:"other-optimizations",children:"Other Optimizations"}),"\n",(0,r.jsx)(s.p,{children:"We identified and resolved several major bottlenecks, including:"}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11007",children:"#11007"}),", we optimized the dev server startup time for macOS users. We figured out that the code to open your browser used expensive synchronous/blocking calls that prevented the bundler from doing its work. From now on, the bundler and the macOS browser opening will run in parallel, leading to a faster ",(0,r.jsx)(s.code,{children:"docusaurus start"})," experience for all macOS users."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11163",children:"#11163"}),", we noticed that the docs ",(0,r.jsx)(s.code,{children:"showLastUpdateAuthor"})," and ",(0,r.jsx)(s.code,{children:"showLastUpdateTime"})," are quite expensive, and require to run a ",(0,r.jsx)(s.code,{children:"git log"})," command for each document. On large sites, running these commands in parallel can exhaust the system and lead to Node.js ",(0,r.jsx)(s.code,{children:"EBADF"})," errors. We implemented a Git command queue to avoid exhausting the system, which also slightly increased performance of our plugin's ",(0,r.jsx)(s.code,{children:"loadContent()"})," lifecycle."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10885",children:"#10885"}),", we implemented an SVG sprite for the external link icon. Due to its repeated appearance in various places of your site (navbar, footer, sidebars...), using a React SVG component lead to duplicated SVG markup in the final HTML. Using a sprite permits to only embed the icon SVG once, reducing the generated HTML size and the static generation time. We ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/issues/5865",children:"plan to use more SVG sprites"})," in the future."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11176",children:"#11176"}),", we fine-tuned the webpack/Rspack configuration to remove useless optimizations."]}),"\n"]}),"\n",(0,r.jsx)(s.admonition,{type:"tip",children:(0,r.jsxs)(s.p,{children:["If bundling time is a concern, consider disabling the optional ",(0,r.jsx)(s.code,{children:"concatenateModule"})," bundler optimization. We explain the tradeoffs and how to do it ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/discussions/11199",children:"here"}),". It only saves 3% JS, and for a very large site, this change was incredibly impactful: 4x faster on cold builds, x16 faster rebuilds \uD83D\uDD25."]})}),"\n",(0,r.jsx)(s.h3,{id:"impact",children:"Impact"}),"\n",(0,r.jsxs)(s.p,{children:["We have upgraded the ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/react-native-website/pull/4607",children:"React Native website to Docusaurus v3.8"})," already. Here's an updated benchmark showing the global Docusaurus Faster impact on total build time for a site with ~2000 pages:"]}),"\n",(0,r.jsxs)(s.table,{children:[(0,r.jsx)(s.thead,{children:(0,r.jsxs)(s.tr,{children:[(0,r.jsx)(s.th,{children:"ReactNative.dev"}),(0,r.jsx)(s.th,{children:"Cold Build"}),(0,r.jsx)(s.th,{children:"Warm Rebuild"})]})}),(0,r.jsxs)(s.tbody,{children:[(0,r.jsxs)(s.tr,{children:[(0,r.jsx)(s.td,{children:"\uD83D\uDC22 Docusaurus Slower"}),(0,r.jsx)(s.td,{children:"120s (baseline)"}),(0,r.jsx)(s.td,{children:"33s (3.6 \xd7 faster)"})]}),(0,r.jsxs)(s.tr,{children:[(0,r.jsx)(s.td,{children:"\u26A1\uFE0F Docusaurus Faster"}),(0,r.jsx)(s.td,{children:"31s (3.8 \xd7 faster)"}),(0,r.jsx)(s.td,{children:"17s (7 \xd7 faster)"})]})]})]}),"\n",(0,r.jsx)(s.p,{children:"We measured similar results on our website:"}),"\n",(0,r.jsxs)(s.table,{children:[(0,r.jsx)(s.thead,{children:(0,r.jsxs)(s.tr,{children:[(0,r.jsx)(s.th,{children:"Docusaurus.io"}),(0,r.jsx)(s.th,{children:"Cold Build"}),(0,r.jsx)(s.th,{children:"Warm Rebuild"})]})}),(0,r.jsxs)(s.tbody,{children:[(0,r.jsxs)(s.tr,{children:[(0,r.jsx)(s.td,{children:"\uD83D\uDC22\uFE0F Docusaurus Slower"}),(0,r.jsx)(s.td,{children:"146s (baseline)"}),(0,r.jsx)(s.td,{children:"45s (3.2 \xd7 faster)"})]}),(0,r.jsxs)(s.tr,{children:[(0,r.jsx)(s.td,{children:"\u26A1\uFE0F Docusaurus Faster"}),(0,r.jsx)(s.td,{children:"42s (3.5 \xd7 faster)"}),(0,r.jsx)(s.td,{children:"24s (6.1 \xd7 faster)"})]})]})]}),"\n",(0,r.jsxs)(s.p,{children:["You can also expect memory usage improvements, and a faster ",(0,r.jsx)(s.code,{children:"docusaurus start"})," experience."]}),"\n",(0,r.jsx)(s.h2,{id:"future-flags",children:"Future Flags"}),"\n",(0,r.jsxs)(s.p,{children:["The Docusaurus v4 Future Flags let you ",(0,r.jsx)(s.strong,{children:"opt-in for upcoming Docusaurus v4 breaking changes"}),", and help you manage them incrementally, one at a time. Enabling all the future flags will make your site easier to upgrade to Docusaurus v4 when it's released."]}),"\n",(0,r.jsxs)(s.admonition,{title:"not invented here",type:"info",children:[(0,r.jsx)(s.p,{children:"The concept of Future Flags is not our invention. It has been popularized in the Remix community. You can read more about this gradual feature adoption strategy here:"}),(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsx)(s.li,{children:(0,r.jsx)(s.a,{href:"https://remix.run/docs/en/main/guides/api-development-strategy",children:"Gradual Feature Adoption with Future Flags"})}),"\n",(0,r.jsx)(s.li,{children:(0,r.jsx)(s.a,{href:"https://remix.run/blog/future-flags",children:"Future Proofing Your Remix App"})}),"\n"]})]}),"\n",(0,r.jsxs)(s.admonition,{title:"Turn all the v4 future flags on",type:"tip",children:[(0,r.jsx)(s.p,{children:"You can turn all the v4 Future Flags on at once with the following shortcut:"}),(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-js",children:"const config = {\n future: {\n // highlight-next-line\n v4: true,\n },\n};\n"})}),(0,r.jsx)(s.p,{children:"This way, you are sure to always keep your site prepared for Docusaurus v4. Be aware that we'll introduce more Future Flags in the next minor versions. When upgrading, always read our release blog posts to understand the new breaking changes you opt into."})]}),"\n",(0,r.jsx)(s.h3,{id:"css-cascade-layers",children:"CSS Cascade Layers"}),"\n",(0,r.jsxs)(s.p,{children:["In Docusaurus v4, we plan to leverage ",(0,r.jsx)(s.a,{href:"https://css-tricks.com/css-cascade-layers/",children:"CSS Cascade Layers"}),". This modern CSS feature is widely supported and permits to group CSS rules in layers of specificity. It is particularly useful to give you more control over the CSS cascade. It makes the CSS rules less dependent on their insertion order. Your un-layered rules will now always override the layered CSS we provide."]}),"\n",(0,r.jsxs)(s.p,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11142",children:"#11142"}),", we implemented a new experimental ",(0,r.jsx)(s.a,{href:"/docs/api/plugins/@docusaurus/plugin-css-cascade-layers",children:(0,r.jsx)(s.code,{children:"@docusaurus/plugin-css-cascade-layers"})})," that you can turn on through the ",(0,r.jsx)(s.code,{children:"v4.useCssCascadeLayers"})," flag if you use the classic preset:"]}),"\n",(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-js",children:"export default {\n future: {\n v4: {\n // highlight-next-line\n useCssCascadeLayers: true,\n },\n },\n};\n"})}),"\n",(0,r.jsxs)(s.p,{children:["We consider this feature as a ",(0,r.jsx)(s.strong,{children:"breaking change"})," because it can slightly alter the CSS rules application order in customized sites. These issues are usually limited, and relatively easy to fix (see for example the ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/react-native-website/pull/4607",children:"React Native CSS changes"}),"). Sites that do not provide custom CSS and do not swizzle any component should not be affected."]}),"\n",(0,r.jsxs)(s.p,{children:["In practice, it permits to automatically apply built-in CSS Cascade Layers to all the CSS we provide, including our opinionated CSS framework ",(0,r.jsx)(s.a,{href:"https://infima.dev/",children:"Infima"}),":"]}),"\n",(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-css",children:"@layer docusaurus.infima {\n h1 {\n /* Infima css rules */\n }\n pre {\n /* Infima css rules */\n }\n}\n"})}),"\n",(0,r.jsxs)(s.p,{children:["Layers can help solves our long-standing ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/issues/6032",children:"Global CSS pollution issue"}),". Our built-in global CSS rules may conflict with yours, making it harder to use Docusaurus to create playgrounds, demos and embedded widgets that are isolated from our CSS. Thankfully, ",(0,r.jsx)(s.a,{href:"https://mayank.co/blog/revert-layer/",children:"CSS Cascade Layers can be reverted"})," to create HTML subtrees that are not affected by the CSS Docusaurus provides."]}),"\n",(0,r.jsxs)(t,{children:[(0,r.jsx)("summary",{children:"Reverting layers"}),(0,r.jsxs)(s.p,{children:["As ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11142",children:"this issue"})," and ",(0,r.jsx)(s.a,{href:"https://mayank.co/blog/revert-layer/",children:"this blog post"})," explain, it is possible to revert layers to isolate an HTML subtree from the CSS that comes from that layer."]}),(0,r.jsxs)(s.p,{children:["In practice, you can create a ",(0,r.jsx)(s.code,{children:".my-playground"})," class to revert the global CSS coming from Infima:"]}),(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-css",children:'/* The "impossible" :not() selector helps increase the specificity */\n.my-playground:not(#a#b) {\n &,\n * {\n @layer docusaurus.infima {\n all: revert-layer;\n }\n }\n}\n'})}),(0,r.jsx)(s.p,{children:"Then you can apply this class to any HTML element, so that Infima doesn't apply to any of its children. The HTML subtree becomes isolated from our built-in CSS."}),(0,r.jsx)(o.Z,{url:"/tests/pages/style-isolation?docusaurus-data-navbar=false"})]}),"\n",(0,r.jsxs)(s.h3,{id:"postbuild-change",children:[(0,r.jsx)(s.code,{children:"postBuild()"})," Change"]}),"\n",(0,r.jsxs)(s.p,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10850",children:"#10850"}),", we added a new ",(0,r.jsx)(s.code,{children:"removeLegacyPostBuildHeadAttribute"})," Future Flag that slightly changes the signature of the ",(0,r.jsx)(s.code,{children:"postBuild()"})," plugin lifecycle method, removing the ",(0,r.jsx)(s.code,{children:"head"})," attribute."]}),"\n",(0,r.jsx)(s.pre,{children:(0,r.jsx)(s.code,{className:"language-js",children:"export default {\n future: {\n v4: {\n // highlight-next-line\n removeLegacyPostBuildHeadAttribute: true,\n },\n },\n};\n"})}),"\n",(0,r.jsxs)(s.p,{children:["This legacy data structure is coming from our ",(0,r.jsx)(s.a,{href:"https://github.com/staylor/react-helmet-async",children:"react-helmet-async"})," dependency and should have never been exposed as public API in the first place. It is not serializable, which prevents us from implementing ",(0,r.jsx)(s.a,{href:"#worker-threads",children:"Worker Threads for the static site generation"}),"."]}),"\n",(0,r.jsxs)(s.p,{children:["While technically a ",(0,r.jsx)(s.strong,{children:"breaking change"}),", we believe this change will not affect anyone. We couldn't find any open source plugin that uses the ",(0,r.jsx)(s.code,{children:"head"})," parameter that this method receives. If turning this flag on breaks your site, please let us know ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10850",children:"here"}),"."]}),"\n",(0,r.jsx)(s.h2,{id:"system-color-mode",children:"System Color Mode"}),"\n",(0,r.jsxs)(s.p,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10987",children:"#10987"}),", the classic theme now lets you revert the color mode to the system/OS value."]}),"\n",(0,r.jsx)(i.Z,{children:(0,r.jsx)("div",{className:"margin-vert--md",style:{display:"flex",justifyContent:"center"},children:(0,r.jsx)(l.Z,{})})}),"\n",(0,r.jsx)(s.h2,{id:"code-block-refactor",children:"Code Block Refactor"}),"\n",(0,r.jsxs)(s.p,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11058",children:"#11058"}),", ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11059",children:"#11059"}),", ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11062",children:"#11062"})," and ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11077",children:"#11077"}),", the theme code block components have been significantly refactored in a way that should be much easier to swizzle and extend."]}),"\n",(0,r.jsxs)(s.p,{children:["According to our ",(0,r.jsx)(s.a,{href:"/community/release-process",children:"release process"}),", this is not a breaking change, but sites that have swizzled these components may need to upgrade them."]}),"\n",(0,r.jsx)(s.h2,{id:"translations",children:"Translations"}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["\uD83C\uDDF9\uD83C\uDDF7 ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10893",children:"#10893"}),": Add missing Turkish theme translations."]}),"\n",(0,r.jsxs)(s.li,{children:["\uD83C\uDDF5\uD83C\uDDF1 ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10884",children:"#10884"}),": Add missing Polish theme translations."]}),"\n",(0,r.jsxs)(s.li,{children:["\uD83C\uDDE8\uD83C\uDDF3 ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10816",children:"#10816"}),": Add missing Chinese theme translations."]}),"\n",(0,r.jsxs)(s.li,{children:["\uD83C\uDDEF\uD83C\uDDF5 ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11030",children:"#11030"}),": Add missing Japanese theme translations."]}),"\n"]}),"\n",(0,r.jsx)(s.h2,{id:"maintenance",children:"Maintenance"}),"\n",(0,r.jsxs)(s.p,{children:["Docusaurus 3.8 is ready for ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11168",children:"Node.js 24"})," and ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10966",children:"TypeScript 5.8"}),"."]}),"\n",(0,r.jsx)(s.p,{children:"We also removed useless npm packages and internalizing unmaintained ones:"}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11010",children:"#11010"})," and ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11014",children:"#11014"}),", we internalized the unmaintained ",(0,r.jsx)(s.code,{children:"react-ideal-image"})," and ",(0,r.jsx)(s.code,{children:"react-waypoint"})," package used in ",(0,r.jsx)(s.code,{children:"@docusaurus/plugin-ideal-image"}),", and made them compatible with React 19."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10956",children:"#10956"}),", we removed our dependency to the unmaintained ",(0,r.jsx)(s.code,{children:"react-dev-utils"})," package (from Create-React-App)."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10358",children:"#10358"}),", we replaced the unmaintained ",(0,r.jsx)(s.code,{children:"shelljs"})," package by ",(0,r.jsx)(s.code,{children:"execa"})]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11138",children:"#11138"}),", we removed the ",(0,r.jsx)(s.code,{children:"reading-time"})," package in favor of the built-in ",(0,r.jsx)(s.code,{children:"Intl.Segmenter"})," standard API to compute blog post reading times."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11037",children:"#11037"}),", we removed the useless ",(0,r.jsx)(s.code,{children:"clean-webpack-plugin"}),"."]}),"\n"]}),"\n",(0,r.jsx)(s.h2,{id:"other-changes",children:"Other changes"}),"\n",(0,r.jsx)(s.p,{children:"Other notable changes include:"}),"\n",(0,r.jsxs)(s.ul,{children:["\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10852",children:"#10852"}),", the theme ",(0,r.jsx)(s.code,{children:"docsVersionDropdown"})," navbar item now accepts a ",(0,r.jsx)(s.code,{children:"versions"})," attribute."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10953",children:"#10953"}),", the ",(0,r.jsx)(s.code,{children:"@docusaurus/remark-plugin-npm2yarn"})," plugin now supports Bun tabs conversions by default."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10945",children:"#10945"}),", more stable CSS classes are now applied to the main theme layout elements, to let you create more reliable CSS selectors."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10846",children:"#10846"}),", the Markdown code block ",(0,r.jsx)(s.code,{children:"showLineNumbers"})," metastring can now accept a number to initialize the line counter initial value."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11090",children:"#11090"}),", we made it easier to provide a custom page title formatter."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/11088",children:"#11088"}),", the page plugin now supports ",(0,r.jsx)(s.code,{children:"frontMatter.slug"})," like docs and blog plugins already do."]}),"\n",(0,r.jsxs)(s.li,{children:["In ",(0,r.jsx)(s.a,{href:"https://github.com/facebook/docusaurus/pull/10875",children:"#10875"}),", the docs versioning CLI now also copies localized docs JSON translation files."]}),"\n"]}),"\n",(0,r.jsxs)(s.p,{children:["Check the ",(0,r.jsx)(s.strong,{children:(0,r.jsx)(s.a,{href:"/changelog/3.8.0",children:"3.8.0 changelog entry"})})," for an exhaustive list of changes."]})]})}function m(e={}){let{wrapper:s}={...(0,a.a)(),...e.components};return s?(0,r.jsx)(s,{...e,children:(0,r.jsx)(p,{...e})}):p(e)}},51118:function(e,s,n){n.d(s,{Z:()=>a});var t=n(85893);n(67294);var r=n(44456);function a(e){let{url:s}=e;return(0,t.jsx)("div",{style:{padding:10},children:(0,t.jsx)(r.Z,{url:s,style:{minWidth:"min(100%,45vw)",width:800,maxWidth:"100%",overflow:"hidden"},bodyStyle:{padding:0},children:(0,t.jsx)("iframe",{src:s,title:s,style:{display:"block",width:"100%",height:300}})})})}},44456:function(e,s,n){n.d(s,{Z:()=>i});var t=n(85893);n(67294);var r=n(90496),a=n(67079);function i(e){let{children:s,minHeight:n,url:i="http://localhost:3000",style:o,bodyStyle:l}=e;return(0,t.jsxs)("div",{className:a.Z.browserWindow,style:{...o,minHeight:n},children:[(0,t.jsxs)("div",{className:a.Z.browserWindowHeader,children:[(0,t.jsxs)("div",{className:a.Z.buttons,children:[(0,t.jsx)("span",{className:a.Z.dot,style:{background:"#f25f58"}}),(0,t.jsx)("span",{className:a.Z.dot,style:{background:"#fbbe3c"}}),(0,t.jsx)("span",{className:a.Z.dot,style:{background:"#58cb42"}})]}),(0,t.jsx)("div",{className:(0,r.Z)(a.Z.browserWindowAddressBar,"text--truncate"),children:i}),(0,t.jsx)("div",{className:a.Z.browserWindowMenuIcon,children:(0,t.jsxs)("div",{children:[(0,t.jsx)("span",{className:a.Z.bar}),(0,t.jsx)("span",{className:a.Z.bar}),(0,t.jsx)("span",{className:a.Z.bar})]})})]}),(0,t.jsx)("div",{className:a.Z.browserWindowBody,style:l,children:s})]})}},80980:function(e,s,n){n.d(s,{Z:()=>o,a:()=>i});var t=n(67294);let r={},a=t.createContext(r);function i(e){let s=t.useContext(a);return t.useMemo(function(){return"function"==typeof e?e(s):{...s,...e}},[s,e])}function o(e){let s;return s=e.disableParentContext?"function"==typeof e.components?e.components(r):e.components||r:i(e.components),t.createElement(a.Provider,{value:s},e.children)}},18947:function(e){e.exports=JSON.parse('{"permalink":"/blog/releases/3.8","editUrl":"https://github.com/facebook/docusaurus/edit/main/website/blog/releases/3.8/index.mdx","source":"@site/blog/releases/3.8/index.mdx","title":"Docusaurus 3.8","description":"We are happy to announce Docusaurus 3.8.","date":"2025-05-26T00:00:00.000Z","tags":[{"inline":false,"label":"Release","permalink":"/blog/tags/release","description":"Blog posts about Docusaurus\' new releases"}],"readingTime":10.68,"hasTruncateMarker":true,"authors":[{"name":"S\xe9bastien Lorber","title":"Docusaurus maintainer, This Week In React editor","url":"https://thisweekinreact.com","page":{"permalink":"/blog/authors/slorber"},"description":"A freelance React and React-Native developer near Paris and Docusaurus maintainer. Also runs ThisWeekInReact.com, a newsletter to stay updated with the React ecosystem.","socials":{"bluesky":"https://bsky.app/profile/sebastienlorber.com","x":"https://x.com/sebastienlorber","linkedin":"https://www.linkedin.com/in/sebastienlorber/","github":"https://github.com/slorber","instagram":"https://www.instagram.com/thisweekinreact","newsletter":"https://thisweekinreact.com"},"imageURL":"https://github.com/slorber.png","key":"slorber"}],"frontMatter":{"title":"Docusaurus 3.8","authors":["slorber"],"tags":["release"],"image":"./img/social-card.png","date":"2025-05-26T00:00:00.000Z"},"unlisted":false,"lastUpdatedAt":1748625776000,"lastUpdatedBy":"S\xe9bastien Lorber","nextItem":{"title":"Docusaurus 3.7","permalink":"/blog/releases/3.7"}}')}}]);
Reference in a new issue View git blame Copy permalink