Search code examples
system.reactiveterminologyreactive-programmingrx-javareactfx

Terminology: What is a "glitch" in Functional Reactive Programming / RX?


What is the definition of a "glitch" in the context of Functional Reactive Programming?

I know that in some FRP frameworks "glitches" can occur while in others not. For example RX is not glitch free while ReactFX is glitch free [1].

Could someone give a very simple example demonstrating how and when glitches can occur when using RX and show on the same example how and why the corresponding ReactFX solution is glitch free.

Thanks for reading.


Solution

  • Definition

    My (own) favorite definition:

    A glitch is a temporary inconsistency in the observable state.

    Definition from Scala.Rx:

    In the context of FRP, a glitch is a temporary inconsistency in the dataflow graph. Due to the fact that updates do not happen instantaneously, but instead take time to compute, the values within an FRP system may be transiently out of sync during the update process. Furthermore, depending on the nature of the FRP system, it is possible to have nodes be updated more than once in a propagation.

    Example

    Consider integer variables a, b. Define sum and prod such that
    sum := a + b,
    prod := a * b.

    Let's rewrite this example to JavaFX:

    IntegerProperty a = new SimpleIntegerProperty();
    IntegerProperty b = new SimpleIntegerProperty();
    NumberBinding sum = a.add(b);
    NumberBinding prod = a.multiply(b);
    

    Now let's write a little consistency check:

    InvalidationListener consistencyCheck = obs -> {
        assert sum.intValue() == a.get() + b.get();
        assert prod.intValue() == a.get() * b.get();
    };
    
    sum.addListener(consistencyCheck);
    prod.addListener(consistencyCheck);
    
    a.set(1);
    b.set(2);
    

    This code fails with an assertion error on the last line, because:

    • b is updated (to 2)
      • sum is updated (to 3)
        • `consistencyCheck` is triggered, `a == 1`, `b == 2`, but `prod == 0`, because `prod` has not been updated yet

    This is a glitch — prod is temporarily inconsistent with a and b.

    Glitch Elimination Using ReactFX

    First note that ReactFX is not "glitch free" out of the box, but it gives you tools to eliminate glitches. Unless you take some conscious effort to use them, ReactFX is not more glitch-free than RX (e.g. rxJava).

    The techniques to eliminate glitches in ReactFX rely on the fact that event propagation is synchronous. On the other hand, event propagation in RX is always asynchronous, thus these techniques cannot be implemented in an RX system.

    In the example above, we want to defer listener notifications until both sum and prod have been updated. This is how to achieve this with ReactFX:

    import org.reactfx.Guardian;
    import org.reactfx.inhibeans.binding.Binding;
    
    IntegerProperty a = new SimpleIntegerProperty();
    IntegerProperty b = new SimpleIntegerProperty();
    Binding<Number> sum = Binding.wrap(a.add(b)); // Binding imported from ReactFX
    Binding<Number> prod = Binding.wrap(a.multiply(b)); // Binding imported from ReactFX
    
    InvalidationListener consistencyCheck = obs -> {
        assert sum.getValue().intValue() == a.get() + b.get();
        assert prod.getValue().intValue() == a.get() * b.get();
    };
    
    sum.addListener(consistencyCheck);
    prod.addListener(consistencyCheck);
    
    // defer sum and prod listeners until the end of the block
    Guardian.combine(sum, prod).guardWhile(() -> {
        a.set(1);
        b.set(2);
    });