@boshen_c Want proper accreditation and I'll give it to you; Represents about 6-7 months of work, It's not a half baked solution but it's also not 100% test262 solution either (that's what I was working towards), currently it only supports .js but the tricks port fine to .ts parsing
Very insightful; On the SIMD-JSON front though If I remember right they proved that SIMD-JSON is within 5% of memory bandwidth proving that the room to improve it by like 2x from here doesn't exist.
So unless someone finds a flaw in their reasoning I don't think we're going to get much faster.
@SumitM_X Literally nothing wrong with this code. It has no bugs, no performance issues, no code smells.
You could make a case for no index keys or defining array outside but both of those cases solve a problem that doesn't exist.
If the solution is cache node_modules, in what like a http-accessible cache? that's what NPM's CDN is in the first place; Unlikely to yield much gains other than co-locality.
The true solution is to use bun simply as a package manager and you'll take that 8mins down to like 3 start there.
@SumitM_X All of these answers are shambolic; Services should only cache on the 'leaf' nodes of your system. Never cache data one service owns in another service.
All the people saying 'useMemo' means i need to get chemotherapy.
assuming
const count = useMemo(() => a + b, [a,b]);
1. Function created every render (1st param)
2. Array created every render (2nd param)
3. Equality check and loop every render (internal)
4. Array created every render (internal to react)
5. Addition operator executed when a/b change.
No useMemo
1. Addition operator executed every render.
Every project that just uses useMemo everywhere is always slow because the useMemo's that are de-optimisation always outweigh the ones that arn't.
@steveruizok useMemo is not fine
Assuming useMemo(() => a + b, [a, b]);
- function created every render.
- array created every render (second argument)
- array created every render (inside useMemo inside React internals)
- equality checks for each a and b in a loop
- 1 addition operator executed ONLY when a/b change.
Without useMemo
1 addition operator executed always.
Every project that uses this everywhere the cases where it regresses performance will always counteract the cases where it helps. It's always a de-optimisation used everywhere.
To me personally; The strength of the JS Ecosystem is in it's "Openness", A place for the best ideas to compete against each other to push the whole ecosystem forwards.
Yes, there's multiple packages for everything this is how competition manifests. Because of this over the last few years we're now getting like ESBuild vs Turbopack vs Webpack vs Rspack vs Rolldown vs .... Wars.
We are getting svelete vs vue vs React vs Angular wars
We are getting SWC vs OXC vs ESBuild (their own parser) Wars
We are getting NextJS vs Tanstack start vs Remix wars.
We are getting Bun vs Node vs Deno Wars
These wars are great for innovation; We've never in all of web history been building this better,faster,simpler.
Literally can't replicate it; In fact seeing the opposite now where it's the same or faster. Feel like I'm in that Blackmirror episode.
My deepest apologies @en_JS; Until I can replicate will delete original post
Maybe my computer decided to run something heavy right as I swapped from false -> true.
Mmm my mistake then; Maybe I'll run the profiler on my codebase to see if it's the case never checked just assumed.
All this is building up a picture that I may be an outlier then; If you want to take a look at my app to see what's causing it can push a latest copy that's extremely simple to run (just bun i, bun run dev)
I honestly find this suprising. If you just navigate here which is the react compiler playground
https://t.co/yc6sdq7pXQ
You look at the "return <div>Hello world</div>" example; That div now ends up being stored on the heap via $[0], where-as before it was stored in stack memory.
The other reason I find it surprising; Is that conceptually there is NO memoization without heap memory. If we retain a reference to something outside of render, it's on the heap. So therefore how can react-compiler possibly be neutral on memory if it's memorizing everything.
It's this that I want to hone in on specifically, What is the actual guidance here of when to use it.
If the guidance is "opt out but default enabled" for all projects, then this obviously risks de-optimization in cases like mine, I have a yet unproven theory that only applications that abuse useMemo / useCallback / memo will benefit from react-compiler; But applications where state is correctly scoped already (to closest parent of it's consuming element, OR via some mechanism that enables fine-grained reactivity) then only de-optimisation will occur.
If it's enable via "opt in default disabled" then it's somewhat of an abstraction leak because the whole point of the compiler is not to have to think about it (in my mind).
It's this cross-roads that as an application AND library author I worry about.
@en_JS
Thanks for getting back to me would love to pick your brain a bit
Memory - Are you testing this in applications predominantly where they have a convention to useMemo / useCallback everything?
or are you also testing on applications that sparsely (and I would argue correctly) use useMemo / useCallback / memo [if not not at all]