This Week In React 276
โ๏ธ
- Boneyard
- Ink
- MUI
- React Router
- Next.js
- shadcn
- Docusaurus
- Comark
- Forms
- Shaders
๐ฑ
- RN 0.85
- ViewTransition
- Skia
- Windows
- CRNL
- Maestro
- Nitro Player
- RNGH
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/276
โ๏ธ @jwr.ski & I
Posts by Seb โ๏ธ ThisWeekInReact.com
This Week In React 276
โ๏ธ
- Boneyard
- Ink
- MUI
- React Router
- Next.js
- shadcn
- Docusaurus
- Comark
- Forms
- Shaders
๐ฑ
- RN 0.85
- ViewTransition
- Skia
- Windows
- CRNL
- Maestro
- Nitro Player
- RNGH
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/276
โ๏ธ @jwr.ski & I
There are many other little improvements in this release
Make sure to read the full release blog post here, which highlights a few other features and improvements
docusaurus.io/blog/release...
New VCS API - Experimental
This permits integrating with any Version Control System, and replaces our historical hardcoded Git strategy.
See also the new "Git Eager" strategy => performs much better
It reads the whole Git repo log at once instead of 1000s of "git log" calls
In Docusaurus v4, we want you to use native, strict MDX syntax
We'll disable the "mdx1Compat" flag
We encourage you to:
- Use .mdx extension
- Use directive syntax for admonitions
- Use MDX comments, not HTML syntax
- Use MDX comments for heading IDs ๐
Site Storage API - Now stable
You probably don't need this API
Although be aware that in Docusaurus v4, localStorage keys will be automatically namespaced to prevent key collisions by default
This means localStorage keys will be renamed:
"theme" โก๏ธ "theme-<hash>"
Docusaurus Faster opts in for our modern build infrastructure
This mode, introduced in v3.6, has been successfully adopted by many sites reporting x2-x10 build time improvements
Now is a good time to mark it as stable.
This will be the new default in Docusaurus v4
Detecting a compromised package in our typical dependency graph is one thing.
But ultimately, you need to take additional measures if you want to secure your site.
Although this is not Docusaurus-specific, check our recommendations in the release post:
In this release, we improved our supply chain security
v3.10 is the first official release with npm Trusted Publishing
We also have a CI workflow to help detect compromised packages.
๐ฅ Docusaurus 3.10 is out!
Milestone release - Prepare for Docusaurus 4
๐ Security: Trusted Publishing, CI scanner, recommendations
โก Docusaurus Faster - Stable, soon the new default
๐ช Strict MDX - No proprietary syntax
๐พ Storage API - Stable
๐ณ VCS API - Experimental
docusaurus.io/blog/release...
Even if you pin your own dependencies, you can't pin your transitive dependencies, so you only lock things on the first level
Doesn't seem like a viable solution to me unless all your graph does it
yes, but if we detect a specific package manager (for example "yarn create") technically what prevents us from copying a pre-generated and safe yarn.lock file in the genered site?
I guess the lockfile format for each package manager also evolves over time / versions ๐
What I mean by that is: I don't want to force a bun/yarn/pnpm user to use npm, and vice versa
I don't know, it seems that there are measures that are somehow shared between bundlers.
For example using the sfw cli, or .npmrc
Also our init cli can detect/select a bundler so technically we could "generate" one solution or another, eventually provide pre-made lockfiles?
๐โโ๏ธ npm security question โ
You are a Node framework author with a CLI to generate new apps
What measures can you take to ensure users are safe from supply chain attacks when initializing a new app?
Preferably:
- automatic, not docs
- decoupled from the pkg manager
This Week In React 275
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/275
โ๏ธ
- Next.js Adapter API
- TanStack Start RSC preview
- React Compiler in Rust
- React XSS
- Signals
- Inertia
- Astro
๐ฑ
- ExecuTorch
- Unistyles
- RN run
- Preflight
- Confetti
- AI/Skills
โ๏ธ @jwr.ski
๐ซก
This Week In React 275
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/275
โ๏ธ
- Next.js Adapter API
- TanStack Start RSC preview
- React Compiler in Rust
- React XSS
- Signals
- Inertia
- Astro
๐ฑ
- ExecuTorch
- Unistyles
- RN run
- Preflight
- Confetti
- AI/Skills
โ๏ธ @jwr.ski
Oh noo, can't make it this year ๐ข have fun without me
This Week In React 274
โ๏ธ
- Next.js
- React Router
- Storybook
- HeroUI
- Remotion
- Lucide Icons
- useEffect
๐ฑ
- Worklets / Reanimated
- Nitro Fetch
- React Navigation
- Rozenite
- MMKV
- Windows
- Swift
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/274
Enjoy ๐
This Week In React 274
โ๏ธ
- Next.js
- React Router
- Storybook
- HeroUI
- Remotion
- Lucide Icons
- useEffect
๐ฑ
- Worklets / Reanimated
- Nitro Fetch
- React Navigation
- Rozenite
- MMKV
- Windows
- Swift
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/274
Enjoy ๐
I'm not super familiar with that term but to me the idea is to use a better sentinel value than null/undefined (which imho are also used that way)
You might find this useful in other JS/TS contexts too.
The "unique symbol" feature of TypeScript is also worth your attention: it makes the symbol have its own identity, improving type-safety (think nominal typing/branding).
You can't compare 2 distinct unique symbols, they do not overlap
๐ React / JS / TS trick
Use symbols instead of null/undefined to represent missing values
This React provider example:
- makes it possible to provide "null"
- still checks that the user didn't forget the <Provider>
There are cases where "null" is a perfectly valid ctx value
This Week In React 273
โ๏ธ
- RedwoodSDK
- Next.js
- TanStack
- RSC
- Async React
- SSR perf
- Base UI
- AI
๐ฑ
- Expo UI / APIs
- Ease
- Keyboard
- Flow type stripping
- DnD
- AI
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/273
โ๏ธ @jwr.ski & I
This Week In React 273
โ๏ธ
- RedwoodSDK
- Next.js
- TanStack
- RSC
- Async React
- SSR perf
- Base UI
- AI
๐ฑ
- Expo UI / APIs
- Ease
- Keyboard
- Flow type stripping
- DnD
- AI
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/273
โ๏ธ @jwr.ski & I
๐ค Jetpack Compose in React Native is here
Expo UI in SDK 55 exposes real Compose & SwiftUI components, not JS reimplementations. Material Design 3 on Android, native SwiftUI on iOS.
Deets in @kudochien.dev's blog:
expo.dev/blog/expo-ui-in-sdk-55-jetpack-compose-now-available-for-react-native-apps
This Week In React 272 ๐ค @filipkaminski.com @tboba.pl
โ๏ธ
- Astro 6
- React Compiler in Rust?
- Next.js
- shadcn CLI 4
- Helmet Async 3
- React Aria
- Preact
๐ฑ
- Navigation
- Expo Agent/Observe/Widget
- Hermes TS
- Evals
- MMKV
- Activity
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/272
This Week In React 272 ๐ค @filipkaminski.com @tboba.pl
โ๏ธ
- Astro 6
- React Compiler in Rust?
- Next.js
- shadcn CLI 4
- Helmet Async 3
- React Aria
- Preact
๐ฑ
- Navigation
- Expo Agent/Observe/Widget
- Hermes TS
- Evals
- MMKV
- Activity
๐ฟ Read/subscribe: thisweekinreact.com/newsletter/272