Fancy Front End Fancy Front End
  • 开始上手
  • 基础
  • 调度器(Scheduler)
  • 更新器(Updater)
  • 渲染器(Render)
  • 更新周期
  • hooks 原理
  • 总结
  • 📙 React源码漂流记
  • 开始上手
  • 基础
  • reactivity
  • runtime-core
  • runtime-dom
  • Awesome Web
  • Awesome NodeJS
话题
  • 导航
  • Q&A
  • 幻灯片
  • 关于
  • 分类
  • 标签
  • 归档
博客 (opens new window)
GitHub (opens new window)

Jonsam NG

让有意义的事变得有意思,让有意思的事变得有意义
  • 开始上手
  • 基础
  • 调度器(Scheduler)
  • 更新器(Updater)
  • 渲染器(Render)
  • 更新周期
  • hooks 原理
  • 总结
  • 📙 React源码漂流记
  • 开始上手
  • 基础
  • reactivity
  • runtime-core
  • runtime-dom
  • Awesome Web
  • Awesome NodeJS
话题
  • 导航
  • Q&A
  • 幻灯片
  • 关于
  • 分类
  • 标签
  • 归档
博客 (opens new window)
GitHub (opens new window)
  • 开始上手
  • Plan 计划
  • typescript-utility

  • single-spa源码

    • 开始阅读
    • app与应用管理

    • lifecycles与生命周期管理

      • 本章概要
        • 内容
        • 目标
        • Q&A
      • 生命周期:load 和 unload
      • 生命周期:bootstrap
      • 生命周期:mount 和 unmount
      • 生命周期:update
    • navigation与路由管理

    • parcel组件

    • 其他

    • single-spa-react

  • qiankun源码

  • webpack

  • axios

  • solid

  • vite源码

  • jquery源码

  • snabbdom

  • am-editor

  • html2canvas

  • express

  • acorn源码

  • immutable.js源码

  • web
  • single-spa源码
  • lifecycles与生命周期管理
jonsam
2022-04-14
目录

本章概要

在上一章中讲解了 single-spa 中主应用的 API,主要是一些提供给用户、devtool 等的顶层 API。最重要的 API 包括 registerApplication 、 unregisterApplication 等。这些内容实际上就是应用管理。

同时我们已经接触到微应用的生命周期,如 load、bootstrap、mount、update、unmount、unload 等。这一章中,我们来详细探讨 single-spa 中的微应用生命周期管理。

# 内容

# 生命周期与微应用的行为

s-spa 管理了微应用及其生命周期,这对于实现微前端的结构至关重要但不是全部,因为 s-spa 具有很强的可定制能力和灵活性,在生命周期中有很多微应用的行为和状态是可以由外界去维护的。qianKun 正是运用了这一点。

让微前端应用具有更多开箱即用的特性这正是 qianKun 所正在做的,在 qiqnKun 中,基于这样的生命周期的设计,它实现了更多如 JavaScript 沙箱、css 沙箱、模板解析、prefech、微应用内部的 hooks 等扩展功能。

# 目标

# Q&A

编辑 (opens new window)
上次更新: 2022/09/06, 14:25:16
Apps
生命周期:load 和 unload

← Apps 生命周期:load 和 unload→

最近更新
01
渲染原理之组件结构与 JSX 编译
09-07
02
计划跟踪
09-06
03
开始上手
09-06
更多文章>
Theme by Vdoing | Copyright © 2022-2022 Fancy Front End | Made by Jonsam by ❤
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式