Giter VIP home page Giter VIP logo

Comments (4)

gbj avatar gbj commented on May 28, 2024 1

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.

gbj avatar gbj commented on May 28, 2024

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.

tqwewe avatar tqwewe commented on May 28, 2024

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.

tqwewe avatar tqwewe commented on May 28, 2024

Much appreciated, will try to implement the interval as a signal approach in the memo as you've suggested

from leptos.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.