Wondering what’s next for npm?Check out our public roadmap! »

    ngx-hover-preload
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.3 • Public • Published

    mgechev

    ngx-hover-preload

    This package exports a PreloadingStrategy, which will preload a lazy-loaded route on mouse over a corresponding router link.

    Alternatives

    Other preloading strategies:

    • ngx-quicklink - Preloads the modules associated with all links visible in the viewport. Quicklink does more aggressive preloading compared to ngx-hover-preload, which makes it more network and CPU intensive.
    • Guess.js - Most advanced preloading strategy, which uses predictive prefetching. At build-time Guess.js compiles a data analytics model and includes it in your production bundle, so that at runtime after each navigation Guess.js prefetches only the modules that are likely to be needed next. Guess.js works particularly well with ngx-hover-preload, because if the prediction was wrong the preloading mechanism gracefully fallbacks to hover.

    Example

    Example is available here.

    Usage

    Install the module:

    yarn add ngx-hover-preload
    

    Import the HoverPreloadModule in your AppModule and your lazy-loaded modules to ensure the required directives are available:

    // ...
    import { HoverPreloadModule } from 'ngx-hover-preload';
    
    @NgModule({
      declarations: [
        // ...
      ],
      imports: [
        // ...
        HoverPreloadModule
      ],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

    Make sure you import the HoverPreloadModule in all lazy-loaded modules in which you want to have this functionality available

    Don't forget to set the HoverPreloadStrategy as your preloadStrategy:

    // ...
    import { HoverPreloadStrategy } from 'ngx-hover-preload';
    
    @NgModule({
      // ...
      imports: [RouterModule.forRoot(routes, { preloadingStrategy: HoverPreloadStrategy })],
    })
    export class AppModule {} // or AppRoutingModule

    License

    MIT

    Keywords

    none

    Install

    npm i ngx-hover-preload

    DownloadsWeekly Downloads

    241

    Version

    0.0.3

    License

    none

    Unpacked Size

    144 kB

    Total Files

    21

    Last publish

    Collaborators

    • avatar