zoukankan      html  css  js  c++  java
  • Angular6 组件树结构优化

    本片博客主要是记录实际项目开发中使用Angular6框架,遇到的一个问题。

    现象:

      Angular6框架写的前端web网页,在实际部署运行过程中遇到了一种现象,引入懒加载以后,加载登录面速度很快,但是登录成功以后,页面切换到首页面组件这个过程却很慢,总是登录页面显示登录成功以后,停留好长时间页面才会切换到首页面。

    现象分析:

      加载登录页面花费了一段时间开销,登录成功以后,页面切换到首页面,加载首页面又需要花费一段时间开销。加载首页module模块时候,花费的时间开销远大于登录组件的时间开销,所以呈现了现在的现象。

    解决策略:

      出于易用性的考虑,调整组件树结构,详情图1 和图2:

            

                              图1(原组件树结构)

              

                                  图2 (调整后的组件树结构)

    说明:

      将组件树调整以后,首先加载homeModule,加载仪表盘组件,仪表盘组件设置一个登陆拦截,判断是否已经登录,已登录,正常加载仪表盘组件,未登录,加载登录组件。其实时间花销并没有缩短,只是将加载首页的时间花销融汇到了首次加载页面的时间花销里面,缺点是首页面加载时间开销变大,首页面显示时间边长。

  • 相关阅读:
    月亮的背后
    2007经典妙语100句
    2007经典妙语100句
    VS C++ 2005的预生成事件及设置
    user case VS. user story
    如何用正确的方法来写出质量好的软件的75条体会
    用 Lucene 加速 Web 搜索应用程序的开发
    巾帼不让须眉——女生做运维 interesting topic
    ebean
    Download the 2.0.0 Release of the Scala IDE for Eclipse Scala IDE for Eclipse
  • 原文地址:https://www.cnblogs.com/mycnblogs-guoguo/p/10483215.html
Copyright © 2011-2022 走看看