𧡠This Week In React
π Remix: server state, waterfalls, + Next, + Prisma
π Remotion 2.6
π Preact Tutorial
π Relay 13
π 3D particles
π RN β‘οΈ SwiftUI
π JSI
π Skia
π TypeScript
π Container Queries
π Browser-Vite
π NAPI-RS 2
...more by email! βοΈ
𧡠Details π
π Remix: server state, waterfalls, + Next, + Prisma
π Remotion 2.6
π Preact Tutorial
π Relay 13
π 3D particles
π RN β‘οΈ SwiftUI
π JSI
π Skia
π TypeScript
π Container Queries
π Browser-Vite
π NAPI-RS 2
...more by email! βοΈ
𧡠Details π
𧡠Intro
No big unexpected React announcement this week, but a good variety of interesting reads!
@remix_run continues to get great marketing from its early adopters!
βοΈ Subscribe by email or read this online (more content inside)
β‘οΈ ThisWeekInReact.com
No big unexpected React announcement this week, but a good variety of interesting reads!
@remix_run continues to get great marketing from its early adopters!
βοΈ Subscribe by email or read this online (more content inside)
β‘οΈ ThisWeekInReact.com
@remix_run 𧡠Some Thoughts on Server State in Remix by @_zachdtaylor
Showing another time how @remix_run abstractions are created to run with or without JS, including the loader function.
JS = bonus. Remix can fall back to good old browser behavior
zachdtaylor.com/blog/some-thouβ¦
Showing another time how @remix_run abstractions are created to run with or without JS, including the loader function.
JS = bonus. Remix can fall back to good old browser behavior
zachdtaylor.com/blog/some-thouβ¦
@remix_run @_zachdtaylor 𧡠Remix, SQLite, and Prisma, Oh my! by @jonrcrowell
Nice overview of a few @remix_run features: links/CSS, Outlet, loader function...
I really like the ability to query server data (here Prisma) on the loader: this reminds NextJS but more co-located
fullstackfish.com/posts/2021-12-β¦
Nice overview of a few @remix_run features: links/CSS, Outlet, loader function...
I really like the ability to query server data (here Prisma) on the loader: this reminds NextJS but more co-located
fullstackfish.com/posts/2021-12-β¦
@remix_run @_zachdtaylor @jonrcrowell 𧡠Run Next and Remix on the same server by @sergiodxa
Showcase an interesting setup where Next.js and Remix work together inside a single Node.js server.
Looks interesting for incremental migration strategies.
sergiodxa.com/articles/run-nβ¦
Showcase an interesting setup where Next.js and Remix work together inside a single Node.js server.
Looks interesting for incremental migration strategies.
sergiodxa.com/articles/run-nβ¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa 𧡠Avoid waterfalls of queries in Remix loaders by @sergiodxa
@remix_run is generally good at parallelizing work and avoiding waterfalls
Yet you are not exempted from combining promises in loader functions
sergiodxa.com/articles/avoidβ¦
@remix_run is generally good at parallelizing work and avoiding waterfalls
Yet you are not exempted from combining promises in loader functions
sergiodxa.com/articles/avoidβ¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa 𧡠Preact Tutorial by @_developit
10 minutes to learn this lighter React alternative
Includes a live code editor + preview
preactjs.com/tutorial/
10 minutes to learn this lighter React alternative
Includes a live code editor + preview
preactjs.com/tutorial/
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit 𧡠Remotion v2.6 by @JNYBGR
Create videos with React π
Stable player to create live video editing previews
New error overlay
Most exciting: the next release is likely 3.0 with serverless support (AWS lambda). Will be much faster to produce videos!
remotion.dev/blog/2-6
Create videos with React π
Stable player to create live video editing previews
New error overlay
Most exciting: the next release is likely 3.0 with serverless support (AWS lambda). Will be much faster to produce videos!
remotion.dev/blog/2-6
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR 𧡠Relay v13.0 by @alunyov
github.com/facebook/relayβ¦
Stable release including the brand new Rust compiler.
Read this other blog post about it:
relay.dev/blog/2021/12/0β¦
github.com/facebook/relayβ¦
Stable release including the brand new Rust compiler.
Read this other blog post about it:
relay.dev/blog/2021/12/0β¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov 𧡠A React Native Engineer Builds A SwiftUI App, by @async
Interesting feedback.
React declarative model knowledge is reusable.
Good: animations, navigation, hot reload is good...
Bad: error messages, nested code pyramid...
medium.com/async/a-react-β¦
Interesting feedback.
React declarative model knowledge is reusable.
Good: animations, navigation, hot reload is good...
Bad: error messages, nested code pyramid...
medium.com/async/a-react-β¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async 𧡠react-native-reanimated-carousel by @doho_1016
New lib fully implemented in Reanimated 2
Active maintainer, many examples
Should help replace the various legacy libs solving a similar problem π
github.com/dohooo/react-nβ¦
New lib fully implemented in Reanimated 2
Active maintainer, many examples
Should help replace the various legacy libs solving a similar problem π
github.com/dohooo/react-nβ¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 𧡠react-native-jsi-image π + react-native-camera deprecated β οΈ
@mrousavy is slowly upgrading our dear React-Native ecosystem to JSI, one lib at a time
github.com/mrousavy/reactβ¦
@mrousavy is slowly upgrading our dear React-Native ecosystem to JSI, one lib at a time
github.com/mrousavy/reactβ¦
https://twitter.com/mrousavy/status/1479454627284365322
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy 𧡠An overview of all keyboard types available in React Native by @flexbox_
Simple yet useful cheatsheet resource with screenshots of the various React-Native keyboards
iOS & Android side by side
+ some extra tips
davidl.fr/blog/keyboard-β¦
Simple yet useful cheatsheet resource with screenshots of the various React-Native keyboards
iOS & Android side by side
+ some extra tips
davidl.fr/blog/keyboard-β¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy @flexbox_ 𧡠The Matrix Reacts
First React-Native-Skia tutorial by @wcandillon
Worth watching even if you are not into React-Native, even just for the Skia+Remotion Matrix intro π
(because obviously, it works on web + video too π)
First React-Native-Skia tutorial by @wcandillon
Worth watching even if you are not into React-Native, even just for the Skia+Remotion Matrix intro π
(because obviously, it works on web + video too π)
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy @flexbox_ @wcandillon 𧡠How not to learn TypeScript by @ddprrt
Great post, might help you learn TypeScript efficiently & incrementally
Mistakes:
- Ignore JS
- Annotate everything
- types vs values
- Going all-in in
- Learn the wrong TypeScript
TIL: noEmitOnError
fettblog.eu/how-not-to-leaβ¦
Great post, might help you learn TypeScript efficiently & incrementally
Mistakes:
- Ignore JS
- Annotate everything
- types vs values
- Going all-in in
- Learn the wrong TypeScript
TIL: noEmitOnError
fettblog.eu/how-not-to-leaβ¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy @flexbox_ @wcandillon @ddprrt 𧡠A New Container Query Polyfill That Just Works
Great @chriscoyier analysis of the polyfill from @DasSurma
CQ are very important for media query encapsulation with React components model.
Polyfill looks usable today, but SSR leads to FOUC π’
css-tricks.com/a-new-containeβ¦
Great @chriscoyier analysis of the polyfill from @DasSurma
CQ are very important for media query encapsulation with React components model.
Polyfill looks usable today, but SSR leads to FOUC π’
css-tricks.com/a-new-containeβ¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy @flexbox_ @wcandillon @ddprrt @chriscoyier @DasSurma 𧡠NAPI-RS v2.0 by @Brooooook_lyn
One of the lib that streamline efficient Rust adoption in modern frontend tooling
v2: retrocompatible rewrite solving v1 limitations, generating binding files, providing new features
WASM support planed
napi.rs/blog/announce-β¦
One of the lib that streamline efficient Rust adoption in modern frontend tooling
v2: retrocompatible rewrite solving v1 limitations, generating binding files, providing new features
WASM support planed
napi.rs/blog/announce-β¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy @flexbox_ @wcandillon @ddprrt @chriscoyier @DasSurma @Brooooook_lyn 𧡠Browser-Vite by @Gluckies @divriots
Runs Vite in the browser by shimming Vite FS and using Web Workers
Interesting comparison with @stackblitz WebContainers, looks more lightweight.
Curious to see what kind of innovation this will lead to.
divriots.com/blog/vite-in-tβ¦
Runs Vite in the browser by shimming Vite FS and using Web Workers
Interesting comparison with @stackblitz WebContainers, looks more lightweight.
Curious to see what kind of innovation this will lead to.
divriots.com/blog/vite-in-tβ¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy @flexbox_ @wcandillon @ddprrt @chriscoyier @DasSurma @Brooooook_lyn @Gluckies @divriots @stackblitz 𧡠Partytown beta by @adamdbradley
Offload third-party scripts in service worker => better web perf
Now in beta, requesting feedback to make it production-ready
Communication using Service Worker XHR sync, but exploring Atomics for faster impl (x10)
builder.io/blog/partytownβ¦
Offload third-party scripts in service worker => better web perf
Now in beta, requesting feedback to make it production-ready
Communication using Service Worker XHR sync, but exploring Atomics for faster impl (x10)
builder.io/blog/partytownβ¦
@remix_run @_zachdtaylor @jonrcrowell @sergiodxa @_developit @JNYBGR @alunyov @async @doho_1016 @mrousavy @flexbox_ @wcandillon @ddprrt @chriscoyier @DasSurma @Brooooook_lyn @Gluckies @divriots @stackblitz @adamdbradley 𧡠AWS Lambda: ES modules & top-level await support, by @jbesw
Exciting news to see this happening
AWS Lambda powers many other DX tools and platforms that frontend developers use regularly: it might also impact them positively
aws.amazon.com/fr/blogs/compuβ¦
Exciting news to see this happening
AWS Lambda powers many other DX tools and platforms that frontend developers use regularly: it might also impact them positively
aws.amazon.com/fr/blogs/compuβ¦
π¬ THREAD END! π§΅
βοΈ Subscribe & browse past editions at ThisWeekInReact.com
π More content, better insight by email
π Help me make this sustainable π
π¦ Retweet the thread "head" below π
βοΈ Subscribe & browse past editions at ThisWeekInReact.com
π More content, better insight by email
π Help me make this sustainable π
π¦ Retweet the thread "head" below π
https://twitter.com/sebastienlorber/status/1480959060254023684
β’ β’ β’
Missing some Tweet in this thread? You can try to
force a refresh
γ
