Add lazyComp for easy non-rerendered component
See original GitHub issueSimilarly to Fable.React’s lazyView, we should have a function to easily create a component whose view function doesn’t need to be called if the model hasn’t changed. Currently this requires creating a Component class.
Proposed API mirroring Fable’s:
val lazyComp
: viewFunction: ('model -> Node)
-> 'model -> Node
when 'model : equality
val lazyCompWith
: equal: ('model -> 'model -> bool)
-> viewFunction: ('model -> Node)
-> 'model -> Node
val lazyComp2
: viewFunction: ('model -> Dispatch<'msg> -> Node)
-> 'model -> Dispatch<'msg> -> Node
when 'model : equality
val lazyComp2With
: equal: ('model -> 'model -> bool)
-> viewFunction: ('model -> Dispatch<'msg> -> Node)
-> 'model -> Dispatch<'msg> -> Node
val lazyComp3
: viewFunction: ('model1 -> 'model2 -> Dispatch<'msg> -> Node)
-> 'model1 -> 'model2 -> Dispatch<'msg> -> Node
when 'model1 : equality and 'model2 : equality
val lazyComp3With
: equal: (('model1 * 'model2) -> ('model1 * 'model2) -> bool)
-> viewFunction: ('model1 -> 'model2 -> Dispatch<'msg> -> Node)
-> 'model1 -> 'model2 -> Dispatch<'msg> -> Node
Issue Analytics
- State:
- Created 4 years ago
- Comments:13 (13 by maintainers)
Top Results From Across the Web
Lazy loading React components
React.lazy() makes it easy to create components that are loaded using dynamic import() but rendered like regular components.
Read more >Lazy Loading React Components (with react.lazy and suspense)
Lazy loading is the technique of rendering only-needed or critical user interface items first, then quietly unrolling the non-critical items later. It is...
Read more >Complete Guide to React Lazy Loading and Code Splitting
Learn how to optimize your app with a complete guide to React lazy loading and code splitting with coding examples, tips, videos, and...
Read more >Lazy loading in React | LoginRadius Blog
js")); const Admin = lazyLoader(() => import("./Admin.js")); //Instead of regular import statements, we will use the above approach for lazy loading ...
Read more >Lazy load components in react - javascript
1 Answer 1 ; import { Suspense · from ; 'react'; const HeavyComp = ; lazy(() => import( ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I was thinking we can simply have a single Component type for all lazy views, which receives the view function as a
[<Parameter>]
. It can even simply inherit fromElmishComponent
, which already has everything needed besides this parameter.@Tarmil Thank you for the feedback. I’ve made changes accordingly, added the last two signatures, added an additional example showcasing custom equality, and created a pull request with all the changes.