首页
AI Coding
NEW
沸点
课程
直播
活动
AI刷题
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
打包
订阅
wenps
更多收藏集
微信扫码分享
微信
新浪微博
QQ
9篇文章 · 0订阅
Webpack 原理系列九:Tree-Shaking 实现原理
一、什么是 Tree Shaking Tree-Shaking 是一种基于 ES Module 规范的 Dead Code Elimination 技术,它会在运行过程中静态分析模块之间的导入导出,确
最终鼓起勇气把公司五年的webpack老项目改成了vite
1. 项目较早 + 代码量大 + 插件类库版本低 + 各个节点优化空间逐渐变小 2. 为接下来Pro工程瘦身做准备; *造成的困扰:* PS:在以上问题的基础上,webpac
从零打造你的前端开发脚手架
在实际开发过程中,我们经常都会用到脚手架来构建前端工程项目,使用脚手架可以大幅提升项目的构建速度,通过命令行的交互,选择你所需要的配置与集成,可快速完成初始项目的创建。
一套骚操作下来,webpack 项目打包速度飞升🚀、体积骤减↓
总结了 webpack5 的 8 个速度优化和 6 个体积优化的实用方案,在你的项目中也尝试一下吧,直接起飞
玩转 webpack,使你的打包速度提升 90%
webpack 打包优化并没有什么固定的模式,一般我们常见的优化就是拆包、分块、压缩等,并不是对每一个项目都适用,针对于特定项目,需要不断调试不断优化。 对于 webpack4,建议从零开始配置,在项目初期,使用 webpack4 默认的配置。 接下来,本篇文章会列出所有适用于…
面试官(7): 聊一聊 Babel?
如果只是 Babel 可能真没有必要,问题是其背后的原理在我们开发中应用过于广泛了,包括不限于: eslint jshint stylelint css-in-js prettier jsx vue-template uglify-js postcss less 等等等等,从模…
轻松理解webpack热更新原理
一种是页面刷新,不保留页面状态,就是简单粗暴,直接window.location.reload()。 另一种是基于WDS (Webpack-dev-server)的模块热替换,只需要局部刷新页面上发生变化的模块,同时可以保留当前的页面状态,比如复选框的选中状态、输入框的输入等。…
如何使用 splitChunks 精细控制代码分割
前端小伙伴都知道,为了降低包大小,经常会把依赖的前端模块独立打包,比如把 vue、vue-router 打到一个单独的包 vendor 中。另外,常会将存在多个路由的复杂页面的每个页面都单独打一个包,只有访问某个页面的时候,再去下载该页面的js包,以此来加快首页的渲染。 无论是…
「吐血整理」再来一打Webpack面试题
本文已收录在Github github.com/Geekhyt,欢迎Star。 从头发的浓密程度和干练的走路姿势我察觉到,面前坐着的这位面试官也是一把好手。我像以往一样,准备花3分钟的时间进行自我介绍。在此期间,我的目光被16寸的MacBook Pro所吸引,这次的自我介绍我做…