Comments (4)
One plausible way to do the kind of fold you're talking about: (This is just pseudo-code)
let interval = /* some signal that updates every 5 minutes */;
let UseEventSourceReturn { data, .. } = use_event_source("https://event-source-url");
let events = create_owning_memo(|prev: Option<Vec<T>>| {
let most_recent_event = data.get();
interval.track(); // make sure this runs at least every five minutes
let mut events = prev.unwrap_or_default();
events.retain(/* filter out the events older than 5 minutes */);
if events.last() != Some(most_recent_event) {
events.push(most_recent_event);
}
(events, true)
});
I'd say an effect is never really required unless you are synchronizing reactive state with the non-reactive world and so need to read the "leaves" of the reactive graph/tree. But YMMV as to which is easier to use.
from leptos.
If you haven't already, reading The Life Cycle of a Signal at the end of the book may be helpful in answering why effects/memos own signals.
The short version is that components don't exist at runtime. A "component" is just a function that is called to set up the DOM and reactive system. Creating a signal does climb up the scopes to find the nearest owner—it's just that owners and components are not the same thing.
An example like the one you provided is one of the reasons I'd generally say to avoid writing to signals from effects, but rather to derive state from other state. There's a relatively straightforward escape hatch, as you note.
from leptos.
Ah okay makes sense thank you.
I always try to brainstorm how to avoid using effects in Leptos, but in my particular use case I couldn't think of a better one.
I'm using leptos_use
's use_event_source
for sever sent events. This returns a Signal<Option<T>>
containing the latest event in the event source.
I want to store an accumulated list of the events in my app, and so decided to go with a RwSignal<Vec<...>>
. However the only way I could think of to accumulate values in this list was to use an effect to push the last event to this list.
let events = RwSignal::new(Vec::new());
let UseEventSourceReturn { data, .. } = use_event_source("https://event-source-url");
Effect::new(move |_| {
if let Some(event) = data.get() {
update!(|events| events.push(event));
}
});
One solution I tried was to use a Memo
, which uses its own return value, similar to a fold. But if I want to remove events older than 5 minutes in a set_interval for example, then I cannot really update the memo.
Is effect really required in my case? Is it the fault of leptos_use's event source API, not providing somekind of callback method for me to use? Or is there a much more obvious solution I'm missing.
from leptos.
Much appreciated, will try to implement the interval as a signal approach in the memo as you've suggested
from leptos.
Related Issues (20)
- leptos_macro 0.6.11 leptos::view! breaks with some comments
- Non-'static signals
- the format!() bug in <a href={format!()}> HOT 2
- Nested Suspense ignores SSR Mode and breaks Hydration HOT 2
- Error when running server function inside spawn_local HOT 5
- Click events are registered twice when two leptos custom elements are on a page HOT 3
- about mobile support
- Recursive effects never run after recursing HOT 4
- Clippy warnings in some components with rust 1.78 HOT 1
- rkyv, avoid the copy to byte ? HOT 4
- Check ActionForm input names at compile time HOT 4
- Allow server components in islands architecture to call code behind ssr without need for #[server] HOT 1
- porting over some react code to my project, having hydration issues
- leptos_router parent Route attr view is not generating view for dynamic routes HOT 4
- relese build causes SIGSEGV and SIGBUS while dev build is just fine HOT 3
- `HtmlElement::attrs` and `DynAttrs::dyn_attrs` Accept `&'static str` Instead of `Oco<'static, str>` HOT 2
- Notify crate (lib) not compiling when installing cargo-leptos HOT 1
- Query parameters are not properly escaped
- DeserializationError when using create_resource of data that use #[serde(deserialize_with = "xxx")]
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from leptos.