RouteReuseStrategy减慢了Angular 4应用程序的速度

时间:2017-06-20 07:25:44

标签: angular routes

在我的Angular 4应用程序上使用RouteReuseStrategy时遇到问题。实际上,当我导航时,应用程序正在减速:我改变路径的速度越慢,速度越慢。

这是我用于CustomReuseStrategy的代码:

import { ActivatedRouteSnapshot, RouteReuseStrategy, DetachedRouteHandle } from '@angular/router';
import { AuthComponent } from '../auth/auth.component';

export class CustomReuseStrategy implements RouteReuseStrategy {

  handlers: { [key: string]: DetachedRouteHandle } = {};

  /**
   * Determines if this route (and its subtree) should be detached to be reused later.
   * Fired when shouldReuseRoute returns false
   * If it returns true, the method store will be fired.
   * @param route current route
   */
  shouldDetach(route: ActivatedRouteSnapshot): boolean {
    return true;
  }

  /**
   * Determines the action we want to do when storing a route.
   * Fired when shouldDeatch returns true.
   * @param route : current route
   * @param handle : identifies the stored component
   */
  store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void {
    let url: string = this.getRouteIdentifier(route);
    if (route.data['shouldReuseRoute']) {
      this.handlers[url] = handle;
    } else {
      delete (this.handlers[url]);
    }
  }

  /**
   * Determines if the current route should be reused from the stored components or not.
   * Fired when shouldReuseRoute returns false
   * @param route current route
   */
  shouldAttach(route: ActivatedRouteSnapshot): boolean {
    let url: string = this.getRouteIdentifier(route);
    // Reset all the stored routes if we're on the AuthComponent
    if (route.component === AuthComponent) {
      this.handlers = {};
      return false;
    }
    return !!route.routeConfig && !!this.handlers[url];
  }

  /**
   * Determines which route we want to retrieve if shouldAttach returns true.
   * Fired when shouldAttache returns true
   * @param route current route
   */
  retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
    let url: string = this.getRouteIdentifier(route);
    if (!route.routeConfig) {
      return null;
    }
    return this.handlers[url];
  }

  shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
    let currentUrl: string = this.getRouteIdentifier(curr);
    let futureUrl: string = this.getRouteIdentifier(future);
    return currentUrl === futureUrl;
  }

  /**
   * Returns the unique identifier for each route
   * @param route: route to identify
   */
  getRouteIdentifier(route: ActivatedRouteSnapshot): string {
    return route.url.join('/');
  }

}

我有一些非常特殊的情况需要重复使用路由,所以平均而言,我存储了最多2条路径。

有没有人有想法?

0 个答案:

没有答案