AngularLynx

    Defer Blocks

    Two @defer blocks: one renders when you tap a button, and one renders after three seconds.

    defersrc/app/app.ts

    What it shows

    • @defer (when visible()) — renders <app-heavy> once the signal turns true. See @defer.
    • @defer (on timer(3000ms)) — renders it after a delay, with no user action.
    • @placeholder and @loading — show content before the trigger fires and while the block loads.
    • The main bundle by default — the deferred component still ships in your main bundle (Glossary) unless you turn on the experimental_isLazyBundle plugin option. See @blotch/angular-lynx-build.