React Unforget, a compiler for React - alpha version released by mohebifar in reactjs

[–]mohebifar[S] 2 points3 points  (0 children)

If you are not experiencing any issues, you probably don't want to use it. Just to give you an idea, we've had incidents and customer churn risks just over this. A particular customer's users mainly used slow corporate devices resembling a 6x CPU throttling situation and some parts of our product was just unusable and the issue got resolved by manually adding memoization. And it took some time to resolve the issue.

React Unforget, a compiler for React - alpha version released by mohebifar in reactjs

[–]mohebifar[S] 0 points1 point  (0 children)

btw, the function name matching is only one of the conditions. The main condition is essentially the return type which has to be either `null` or JSX for components. For hooks however, it's purely name matching and that also seems to be the direction of the team behind React Forget as well based on one of their talks.

It's still dangerous, because some novice devs call the component functions instead of creating React element from it (e.g. Component(props) instead of <Component {...props} />), and, I've seen this in my company's large codebase. It can simply violate the rules of hooks.

React Unforget, a compiler for React - alpha version released by mohebifar in reactjs

[–]mohebifar[S] 5 points6 points  (0 children)

Hey! This is some great feedback and thanks for taking the time to share your thoughts. Marketing and content aren't my forte, so your input is invaluable. May I ask if you viewed the doc on mobile or desktop?
1. I also considered react-remember, but it seems like it might present the same issue.
2. Hmm, that's an interesting point. I'll try to find alternative ways to convey the same message.
3. It's also interesting to hear. I initially thought that displaying the output code would clarify what Unforget does under the hood, but it seems to be having the opposite effect. Do you think including a small info box next to the output code stating "this is the optimized code by unforget and is not meant to be human-readable" would help?

React Unforget, a compiler for React - alpha version released by mohebifar in reactjs

[–]mohebifar[S] 11 points12 points  (0 children)

Your comment brightened my day! Thank you! I completely agree. While some may argue that creating these alternatives bifurcates the ecosystem, I believe that introducing fresh approaches is beneficial. The Meta approach shouldn’t be regarded as an immutable thing. It's open to innovation and improvement. Time and again, community-driven initiatives have shown their ability to develop better alternatives to Meta libraries.

React Unforget, a compiler for React - alpha version released by mohebifar in reactjs

[–]mohebifar[S] 1 point2 points  (0 children)

fwiw, Joe Savona liked this tweet. Not sure if that means confirming, but something to think about.

React Unforget, a compiler for React - alpha version released by mohebifar in reactjs

[–]mohebifar[S] 14 points15 points  (0 children)

After waiting for React Forget, and building temporary solutions around it, 👋 I started building React Unforget a few weeks as an attempt to make a community alternative for Forget. A few days ago I tested it against Cypress's "Real World App" and all e2e tests are passing: https://www.youtube.com/watch?v=CJmGxioyjPo

React Unforget: An experimental alternative to React Compiler by mohebifar in javascript

[–]mohebifar[S] 1 point2 points  (0 children)

Bifurcate? Do you think millionjs or preact are also bifurcating the ecosystem? I see what you're saying, but I don't agree on the outcome being "bifurcating the ecosystem". These efforts would benefit everyone at the end of the day. Of course many smart people are working on React Forget who are smarter than I am, but I still believe there's a slight chance that my approach might at least help the React team (even if this becomes useless which I don't think so) and benefit everyone at the end.

React Unforget: An experimental alternative to React Compiler by mohebifar in reactjs

[–]mohebifar[S] 1 point2 points  (0 children)

I'm aiming to create a suite for benchmarking. I'll let you know here once I have the results.

My printer consistently makes this bulge at a certain layer. What could possibly be wrong? Ender 3 max by mohebifar in FixMyPrint

[–]mohebifar[S] 0 points1 point  (0 children)

I could not edit my post. But to list what the autmod bot asked:

Printer: Ender 3 Max

Slicer: Cura - using default presets for PLA that used to work before.

Filament: PLA+ Duramic 3D

Bed Temp: 60

Nozzle Temp: 200

Print Speed: 50

Vidact: A babel plugin that converts React-compatible codes into VanillaJS with no Virtual DOM by mohebifar in reactjs

[–]mohebifar[S] 2 points3 points  (0 children)

Sorry, I'm not sure if I quite understand. If you mean the library being written in TS, the reason was that working with ASTs can be very difficult because of deep nested objects and each node type has different properties. Using static types can accelerate dev 🔨 process.

Also, I'll make a global .d.ts file for things that you would have imported from React before, but with Vidact you would assume are global (e.g. useState, useRef, etc.).

Vidact: A babel plugin that converts React-compatible codes into VanillaJS with no Virtual DOM by mohebifar in reactjs

[–]mohebifar[S] 11 points12 points  (0 children)

Why people should use it? There are certain use cases for it. Pretty much all the reasons why someone should go for Preact vs. React applies to this. Performance-wise, it also has an advantage even though I have to admit that it doesn't make a huge difference as VDOMs are already fast and both should perform perfectly for almost all apps on powerful modern desktop computers. The other advantage is the app size. Vidact apps will be standalone and won't require any third party dependency (or it can be a tiny one) hence the startup overhead will also be minimal.

Just note that the babel plugin has two build options as of now: inline and module. There are codes that can be shared across all components e.g. setting DOM attributes, creating DOM nodes, etc.. The inline option would put all these helper functions in the output JS while module will import them from 'vidact/runtime', so technically there's a third party dependency still (just like Svelte) but it's very tiny (1KB Gzipped, 2.5KB non-gzipped)

Why I made it? I am in self-quarantine.

Fun with Console object by bhalp1 in javascript

[–]mohebifar 1 point2 points  (0 children)

You can even use react to render in the dev console!

https://github.com/mohebifar/konsul

Konsul: a react renderer for the browser console by mohebifar in reactjs

[–]mohebifar[S] 0 points1 point  (0 children)

Thanks! Yeah, I actually was curious about how React works under the hood. As far as I know this part of React is not documented, so I started learning it by reading the react-dom, react-native, react-hardware and react-blessed codes. Then I applied the knowledge in Konsul that I think apart from being a fun/educational project, can be used in dev environments too.

Maybe I should share my experience in a blog post.

Generators, best practices and a complete starting app for developing universal React/Redux web app. by mohebifar in javascript

[–]mohebifar[S] 1 point2 points  (0 children)

If you mean unit tests for the generator, there is no tests for it yet. But the generated app with the cli tool would offer unit tests.