webpack-bundle-analyzer 可以在打包后的目录产生一个文件,用以分析打包性能
webpack 在打包的时候将会剔除掉被没有被使用到的代码达到减小报体积,缩短 http 请求时间,起到一定效果的页面优化,此即tree shaking
1 DLL全称动态链接库(Dynamic Link Library),是为软件在windows中实现共享函数库的一种实现方式 2 webpack中也有内置的DLL的功能,它指的是我们可以将可以共享、并且不经常改变的代码,抽取成一个共享的库 3 这个库在之后编译的过程中,会被引入到其他项目中的代码中
MiniCssExtractPlugin可以将css单独抽离到一个css文件。
CDN称之为内容分发网络(Content Delivery Network 或 Content Distribution Network) 它指的是通过相互连接的网络系统,利用最靠近每个用户的服务器 更快、更可靠的将多媒体、应用程序等发送给用户 来提供高性能、可扩展及低成本的网络内容产地给用户
动态import使用最多的一个场景是懒加载(比如路由懒加载)封装一个 component js,返回个 component对象 我们可以点击按钮时,加载这个对象
微前端,之前一直都有简单了解过微服务,大概就是N个类型的服务都注册到主要服务上,然后就各自管理即可。而后期又发展了微服务,前端的微服务简单来说就是,【子应用】(N个站,或者应用,或者模块)都注册到一个【父应用】上,然后各自管理,开发即可,每个子用应又可以是独立的,也不用管子应用到底是用什么开发,总之最后对接注册到父应用上即可。
vite速度快,node_modules里的文件比webpack少太多太多,而且,对很多文件,如js、css等都内置了解析方式,不像webpack需要配置很多loader和plugins。
Webpack中常用的代码分离: 入口起点:使用entry配置手动分离代码 防止重复:使用Entry Dependencies或者SplitChunksPlugin去重和分离代码 动态导入:通过模块的内联函数调用来分离代码