They made React great again?
Summary
TLDRIn a recent update that has taken the development community by surprise, the ReactJS team has introduced a game-changing compiler that promises to significantly enhance the developer experience. This new compiler, already in use at Meta for Instagram, is set to simplify coding, eliminate the need for cumbersome hooks like useMemo and useCallback, and introduce efficient features like server actions and improved handling of promises. Furthermore, the release of jQuery 4.0 marks a milestone, shedding outdated features and embracing ES modules. The video highlights how these advancements are blurring the lines between major JavaScript frameworks, suggesting a future where a unified framework could potentially end the ongoing framework wars.
Takeaways
- 😲 React has released a new compiler that will improve developer experience and performance, and simplify code writing.
- 🥳 The compiler will eliminate the need for hooks like useMemo and useCallback, which add complexity to React code.
- 😎 Other features being removed include forwardRef and server actions, which have been described as having a poor developer experience.
- 🤩 The compiler will allow React to handle data submission and optimistic updates more efficiently, similar to frameworks like Firebase.
- 🎉 jQuery has finally released version 4.0, which removes obsolete features, drops IE11 support, and migrates to ES modules.
- 🤔 React's new compiler will make its API more similar to other frameworks like Vue and Solid, which already have compilers.
- 😄 The use hook will replace useContext and allow promises and React context to be used inside loops and conditionals.
- 🤯 The video suggests that all major JavaScript frameworks are converging towards similar APIs and abstractions.
- 🤞 The video proposes that the community should decide on a single framework and build it into browsers to end the "framework wars".
- 🤑 React has intentionally added bad APIs in the past to look like "geniuses" when they remove them later.
Q & A
What is the big news about React according to the script?
-The big news is that React is getting a compiler, which Meta is already using in production to power Instagram.
What are the benefits of React getting a compiler?
-The compiler will simplify the code that developers write and likely bring solid performance improvements. It will eliminate the need for hooks like useMemo and useCallback.
What is the purpose of the useMemo hook in React?
-The useMemo hook wraps a computation in a function that will only run when the state it depends on changes, preventing unnecessary recomputation every time a component re-renders.
Why do frameworks like Vue and Solid have simpler code compared to React?
-Vue and Solid already have compilers that look at the code in advance and figure out where the reactivity is, allowing developers to write more simplified code.
What is the issue with React's forwardRef feature that the compiler will resolve?
-The forwardRef feature currently creates a higher-order component when you need to expose a DOM node to a parent. With the compiler, the ref will become a prop, making it easier to access without wrapping another function.
What are server actions in React, and why are they controversial?
-Server actions handle the data submission cycle from client to server and back again. Some have described the developer experience as being like PHP, but without the benefits.
How does React currently handle promises in client-side components?
-React currently can't use async/await to fetch data directly in client-side components. Instead, developers use the useHook to resolve promises and handle loading and error states with Suspense and Error boundaries.
What change is coming to the Solid framework in version 5?
-In Solid 5, the dollar sign syntax for computed values is being replaced with a rune (a special character).
What did jQuery recently announce after a decade of anticipation?
-jQuery recently announced version 4.0, dropping support for Internet Explorer 11 and migrating to ES modules.
What is the speaker's opinion on the convergence of major JavaScript frameworks?
-The speaker believes that all the major frameworks are starting to look identical, copying each other's abstractions and leading to nearly identical APIs. He suggests that it's time to decide on "the one true framework" and build it into the browser to end the "bloodshed."
Outlines
📢 React's Brilliant Developer Experience Improvements
The author, who self-identifies as a React hater, acknowledges the brilliant recent improvements made by the React team to enhance the developer experience. With the introduction of a compiler, React aims to simplify the code developers write, addressing issues like unnecessary recomputation and providing a smoother experience compared to other frameworks like Vue, Svelte, and Solid. The post covers the upcoming changes, such as the removal of hooks like useMemo and useCallback, improvements to ref handling, and the introduction of server actions for handling data submissions. The author also praises the use of promises and the useHook, which simplifies handling asynchronous data. Overall, the post celebrates React's efforts to streamline its API and match the simplicity of other frameworks.
Mindmap
Keywords
💡React
💡Compiler
💡useMemo
💡forwardRef
💡Server Actions
💡Suspense
💡useEffect
💡Frameworks
💡Reactivity
💡Mental Boilerplate
Highlights
A shocking new blog post from the ReactJS team was released, suggesting that React has been fixed and will dramatically improve the developer experience.
jQuery announced version 4.0, which got rid of obsolete features, dropped Internet Explorer 11 support, and migrated to ES modules.
ReactJS is getting a compiler, which Meta is already using in production to power Instagram and will likely bring solid performance improvements.
The React compiler will simplify the code developers write by eliminating the need for hooks like useMemo and useCallback, which are required to handle unnecessary recomputations in the current version.
The React compiler will allow for more simplified code, similar to frameworks like Vue and Solid, which already have compilers that analyze the code ahead of time to figure out reactivity.
The React compiler will also eliminate the need for features like forwardRef, which creates higher-order components for exposing DOM nodes to parent components.
Server actions, a controversial feature already available in Next.js, will be integrated into React, providing hooks like useFormStatus and useFormState for handling data submission cycles and optimistic UI updates.
React will improve its handling of promises and async/await in client-side components using the useHook, which can also handle React context and replace the useContext hook.
These improvements in React aim to simplify the code developers write and bring it closer to other frameworks, which have already adopted similar abstractions and APIs.
As frameworks become increasingly similar, there is a call for the industry to decide on a single true framework and build it into the browser to end the "bloodshed" of framework wars.
Transcripts
a few days ago a shocking new blog post
from the reactjs team dropped as a react
hater I hate to say it but they fixed
react I tried to let the hate flow
through me but the react team made some
brilliant moves that will dramatically
improve the developer experience just
when you thought react had become the
new jQuery and the JavaScript framework
wars were coming to an end the react
team has Unleashed their secret weapon a
compiler and in today's video we'll find
out what that word means it is February
26 2024 and you're watching the code
report speaking of jQuery one thing that
you may have missed is that after nearly
a decade of anticipation jQuery just
announced version 4.0 it got rid of a
bunch of stuff made obsolete by the
JavaScript language itself dropped ie1
support and migrated to es modules most
frontend developers nowadays are too
smug and arrogant to use jQuery but this
is great news for the millions of
websites out there that still use it the
big news though is that reactjs is
getting a compiler meta is already using
this compiler in production to power
Instagram and will likely bring solid
performance improvements but most
importantly it will simplify the code we
write as developers Developers L react
code is pretty ridiculous compared to
Frameworks like view felt and solid like
imagine we have some state that needs to
be computed into another value we can do
it like this in react but that value
will be unnecessarily recomputed every
time the component reeners it's
inefficient to address this react
provides a hook called use memo memo
means memoization which itself means
remember it wraps the computation in
another function which will only run
when the state that it's dependent on
changes which has to be explicitly put
in this array if we look at all the
other Frameworks though they don't do
stuff like this like in view we have
this computed function but there's no
need to include that dependency array
and in spell 3 it's even more simple
with the dollar sign syntax although
it's being replaced with a rune in spel
5 the reason these Frameworks can let
you write more simplified code is
because they have a compiler unlike
react which is purely runtime based they
look at your code in advance to figure
out where the reactivity is and bundle
that into the final product that goes to
the browser but now that react is
getting its own compiler it means hooks
like use memo and use callback are a
thing of the past and that's huge
because not only is the code ugly as as
hell but it also removes the mental
boiler plate of asking the question to
memoize or not to memoize and they
confirmed my conspiracy theory that
react intentionally adds bad apis like
this just to look like Geniuses when
they remove them later on but use memo
is not the only bad feature going away
another thing you won't need in the
future is forward ref which creates a
higher order component when you need to
expose a Dom node to the parent instead
ref will just be a prop so you can
easily access it without having to wrap
another function that's an easy win but
a more controversial feature is server
actions you can already use actions in
nextjs and many have described the
developer experience as being like PHP
but without Lambos the general idea
though is that react handles the data
submission cycle for you from client to
server and then back again what's cool
about this is react provides hooks like
use form status or use form state to
easily handle the data in a form but
then alongside that you have hooks like
use optimistic to get that Ultra fast
Firebase like feel on any backend
database the UI updates instantly based
on the expected change then in the rare
case it fails it reverts back but
another thing that sucks about react is
working with promises in react server
components like in nextjs you can use
async await to fetch data directly in a
component that's awesome but you can't
do it in a client side component and you
still can't in react 19 but you can use
the use hook which is the next best
thing it works on both promises and
react context which means it makes the
Ed context hook obsolete because unlike
used context use can also be used inside
of loops and conditionals but using use
allows you to use the value of a
resolved promise directly in the UI now
a promis is asynchronous and its value
is initially pending so you can handle
the loading state by wrapping it in a
suspense boundary and it might also
reject and throw an error in which case
you can wrap it in an error boundary I
don't really love this code myself but
it's way better than the common approach
of resolving a promise with the use
effect hook bottom line is that these
are some huge improvements for react
what's funny though is that if we take a
step back all the major Frameworks are
starting to look identical and have all
copied each other's abstractions leading
to nearly identical apis just with
things named slightly different as a
civilized society it's about time we
decide on the one true framework then we
build that framework into the browser to
put an end to this Bloodshed once and
for all this has been the code report
thanks for watching and I will see you
in the next JS one
5.0 / 5 (0 votes)