You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Here are the examples of React hook calls currently (Feliz v2.4.1, but I remember the case take place all my Feliz usage): useReact_useCallback_1CA17B65, useReact_useMemo_10C6A43C and so on. Firstly, That doesn't look pretty. And in practice it affects React Dev Tools user experience. Secondly, there is actual JS-code being produced in Feliz bundle, e.g. from fable_modules/Feliz.2.4.1/React.fs.js:
exportfunctionuseReact_useMemo_10C6A43C(createFunction,dependencies){constarg_1=defaultArg(dependencies,[]);returnInterop_reactApi.useMemo(createFunction,arg_1);}// and so on for the rest of the bindings
As I understand, this would not have happened if the containing React type had Erase attribute (to be erased by Fable). However it will work only when all of the type members are inline. And now I see that alongside the inline "pure" imports React type contains:
non-inline members that in fact could be made inline because of being "pure" imports);
non-inline members and even custom hooks with the actual logic (createDisposable, useEffectOnce, useCallbackRef, useCancellationToken) that couldn't be simply marked inline while being defined directly in the React type as they're now. However I see the solution in moving all these custom hooks to a separate module/non-erased type and then calling them from the inline members of React type -- so that there should be no critical changes from the F# API perspective.
P.S. Also Hook attribute should be removed from all these hook-members when the React type is erased.
The solution doesn't seems to require a lot of work, if it is actually correct -- haven't tried anything yet, just made assumptions based on my previous experience. Decided to ask for other opinions and expertise here before doing something 🙂
The text was updated successfully, but these errors were encountered:
Hi @ArtemyB I understand the generated JS is not ideal by Feliz, however sometimes it is not possible to inline members. I don't remember the exact reasons why some hooks aren't being inlined. That said, a PR would be really appreciated that includes these improvements 🙏
Here are the examples of React hook calls currently (
Feliz v2.4.1
, but I remember the case take place all myFeliz
usage):useReact_useCallback_1CA17B65
,useReact_useMemo_10C6A43C
and so on. Firstly, That doesn't look pretty. And in practice it affects React Dev Tools user experience. Secondly, there is actual JS-code being produced in Feliz bundle, e.g. fromfable_modules/Feliz.2.4.1/React.fs.js
:As I understand, this would not have happened if the containing
React
type hadErase
attribute (to be erased by Fable). However it will work only when all of the type members areinline
. And now I see that alongside theinline
"pure" importsReact
type contains:inline
members that in fact could be madeinline
because of being "pure" imports);inline
members and even custom hooks with the actual logic (createDisposable
,useEffectOnce
,useCallbackRef
,useCancellationToken
) that couldn't be simply markedinline
while being defined directly in theReact
type as they're now. However I see the solution in moving all these custom hooks to a separate module/non-erased type and then calling them from theinline
members ofReact
type -- so that there should be no critical changes from the F# API perspective.P.S. Also
Hook
attribute should be removed from all these hook-members when theReact
type is erased.The solution doesn't seems to require a lot of work, if it is actually correct -- haven't tried anything yet, just made assumptions based on my previous experience. Decided to ask for other opinions and expertise here before doing something 🙂
The text was updated successfully, but these errors were encountered: