custom-preload.ts

import {PreloadingStrategy, Route} from "@angular/router";
import {Observable, of} from "rxjs";
import {Injectable} from "@angular/core";

/**
 * Starting point for a CustomPreloading class from our live session!
 * You can (and should) customize it further more to meet your needs
 */

@Injectable({providedIn: 'root'})
export class CustomPreloading implements PreloadingStrategy {
  private slowConnection = ['slow-3g', '2g', '3g'];

  preload(route: Route, load: () => Observable<any>): Observable<any> {

    // control with custom route data
    if(route.data && route.data['preload'] === false) {
      return of(null);
    }

    // Don't preload for slow connections!
    const connection = navigator?.connection;

    if(connection) {
      const networkSpeed = connection.effectiveType;

      if(this.slowConnection.includes(networkSpeed)) {
        return of(null);
      }
    }

    return load();
  }

}