引言前一段时间,正好在做微前端的接入和微前端管理平台的相关事项。而我们当前使用的微前端框架则是qiankun,他是这样介绍自己的:qiankun是一个基于single-spa的微前端实现库，旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。所以本文基于single-spa源码,来介绍single-spa当前使用版本5.9.4启动在官方demo中,要运行此框架需要做的是有这四步:准备好子应用的文件,需要抛出一些生命周期函数一个子应用app1的加载函数(可以是import异步加载,也可以是ajax/fetch加载)注册子应用启动程序app1.js:exportfunctionbootst
引言前一段时间,正好在做微前端的接入和微前端管理平台的相关事项。而我们当前使用的微前端框架则是qiankun,他是这样介绍自己的:qiankun是一个基于single-spa的微前端实现库，旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。所以本文基于single-spa源码,来介绍single-spa当前使用版本5.9.4启动在官方demo中,要运行此框架需要做的是有这四步:准备好子应用的文件,需要抛出一些生命周期函数一个子应用app1的加载函数(可以是import异步加载,也可以是ajax/fetch加载)注册子应用启动程序app1.js:exportfunctionbootst
vue-plugin-hiprint的学习与应用?生命不息，写作不止?继续踏上学习之路，学之分享笔记?总有一天我也能像各位大佬一样?一个有梦有戏的人@怒放吧德德?分享学习心得，欢迎指正，大家一起学习成长！生命不息，写作不止，养成良好的学习精神！目录vue-plugin-hiprint的学习与应用简介引入插件：代码简单介绍面板初始化预览直接打印批量打印保存JSON数据自定义组件简介本文介绍对vue-plugin-hiprint部分重要代码的解析，这是一个很好的开源插件，能够自己自定义打印模板，通过后端传来的数据进行渲染打印，官方也提供了许多的api供开发者使用。界面采用了antdesign。实现
vue-plugin-hiprint的学习与应用?生命不息，写作不止?继续踏上学习之路，学之分享笔记?总有一天我也能像各位大佬一样?一个有梦有戏的人@怒放吧德德?分享学习心得，欢迎指正，大家一起学习成长！生命不息，写作不止，养成良好的学习精神！目录vue-plugin-hiprint的学习与应用简介引入插件：代码简单介绍面板初始化预览直接打印批量打印保存JSON数据自定义组件简介本文介绍对vue-plugin-hiprint部分重要代码的解析，这是一个很好的开源插件，能够自己自定义打印模板，通过后端传来的数据进行渲染打印，官方也提供了许多的api供开发者使用。界面采用了antdesign。实现
一、什么是首屏加载首屏时间（FirstContentfulPaint），指的是浏览器从响应用户输入网址地址，到首屏内容渲染完成的时间，此时整个网页不一定要全部渲染完成，但需要展示当前视窗需要的内容，首屏加载可以说是用户体验中最重要的环节二、加载慢的原因在页面渲染的过程，导致加载速度慢的因素可能如下：网络延时问题资源文件体积是否过大资源是否重复发送请求去加载加载脚本的时候，渲染内容堵塞三、解决方案常见的几种SPA首屏优化方式减小入口文件积静态资源本地缓存UI框架按需加载图片资源的压缩组件重复打包开启GZip压缩 减小入口文件体积常用的手段是路由懒加载，把不同路由对应的组件分割成不同的代码块，待
一、什么是首屏加载首屏时间（FirstContentfulPaint），指的是浏览器从响应用户输入网址地址，到首屏内容渲染完成的时间，此时整个网页不一定要全部渲染完成，但需要展示当前视窗需要的内容，首屏加载可以说是用户体验中最重要的环节二、加载慢的原因在页面渲染的过程，导致加载速度慢的因素可能如下：网络延时问题资源文件体积是否过大资源是否重复发送请求去加载加载脚本的时候，渲染内容堵塞三、解决方案常见的几种SPA首屏优化方式减小入口文件积静态资源本地缓存UI框架按需加载图片资源的压缩组件重复打包开启GZip压缩 减小入口文件体积常用的手段是路由懒加载，把不同路由对应的组件分割成不同的代码块，待
dll?动态链接库英文为DLL，是DynamicLinkLibrary的缩写。DLL是一个包含可由多个程序，同时使用的代码和数据的库。起因在查看hzero前端项目框架介绍时提到了dll，外加之前经常看见dll文件，于是有了兴趣了解一下webpackdll。webpack官网介绍DLLPlugin 和 DLLReferencePlugin 用某种方法实现了拆分bundles，同时还大大提升了构建的速度.模块预编译原理webpack.dllPlugin本质是将大量复用模块且不会频繁更新的库进行预编译，且只需要编译一次，编译完成后产出指定文件（可以称为动态链接库）。在之后的构建过程中不会再对这些模块
dll?动态链接库英文为DLL，是DynamicLinkLibrary的缩写。DLL是一个包含可由多个程序，同时使用的代码和数据的库。起因在查看hzero前端项目框架介绍时提到了dll，外加之前经常看见dll文件，于是有了兴趣了解一下webpackdll。webpack官网介绍DLLPlugin 和 DLLReferencePlugin 用某种方法实现了拆分bundles，同时还大大提升了构建的速度.模块预编译原理webpack.dllPlugin本质是将大量复用模块且不会频繁更新的库进行预编译，且只需要编译一次，编译完成后产出指定文件（可以称为动态链接库）。在之后的构建过程中不会再对这些模块
微前端微前端，前端这次词就不用多做解释了，这个概念的重点在于这个“微”字，从字面意义上看，微是小的意思，小是相对于大的一个用于比较的形容词，所以通常是在项目庞大的情况下，才会考虑将它变小，去考虑将它拆分成若干个小项目。这就是做微前端所要达到的主要目标，将庞大的项目拆分成多个独立运行、独立部署和独立开发的小项目，使得项目利于维护和更新，然后在运行时，作为一个整体来呈现。项目过于庞大的可能存在一系列问题，比如构建速度慢、应用加载慢、定位问题麻烦、项目可维护性差等等。早期过往的案例中，通常会使用iframe作为微前端的一种解决方案，但iframe有一些明显的缺点，比如浏览器的前进后退，由于ifram
微前端微前端，前端这次词就不用多做解释了，这个概念的重点在于这个“微”字，从字面意义上看，微是小的意思，小是相对于大的一个用于比较的形容词，所以通常是在项目庞大的情况下，才会考虑将它变小，去考虑将它拆分成若干个小项目。这就是做微前端所要达到的主要目标，将庞大的项目拆分成多个独立运行、独立部署和独立开发的小项目，使得项目利于维护和更新，然后在运行时，作为一个整体来呈现。项目过于庞大的可能存在一系列问题，比如构建速度慢、应用加载慢、定位问题麻烦、项目可维护性差等等。早期过往的案例中，通常会使用iframe作为微前端的一种解决方案，但iframe有一些明显的缺点，比如浏览器的前进后退，由于ifram
