4. Vite 中的 HMR(热模块替换)是如何工作的?它在构建过程中有什么优势?

在Vite中,HMR(Hot Module Replacement,热模块替换)是一个重要的特性,它可以在开发阶段实现实时更新和快速重新加载模块,而无需完全刷新整个页面。

具体来说,Vite的HMR工作原理如下:https://www.nowcoder.com/issue/tutorial?zhuanlanId=Mg58Em&uuid=8e9ff865b0d84b46833cbfe45a5c001d

当应用程序启动时,Vite会创建一个WS(WebSocket)服务器,用于与浏览器建立实时通信。
当你修改了一个文件并保存时,Vite会检测到文件的变化,并将该变化推送到浏览器端。
浏览器通过WS连接接收到变化的通知后,会向Vite请求有关被更新模块的新代码。
Vite根据请求返回更新后的模块代码,并通知浏览器更新相应的模块。
浏览器利用新的模块代码进行局部更新,保持页面的状态和数据不变,提供了无刷新的开发体验。

Vite的HMR在构建过程中有以下优势:https://www.nowcoder.com/issue/tutorial?zhuanlanId=Mg58Em&uuid=8e9ff865b0d84b46833cbfe45a5c001d

快速更新:通过HMR,Vite能够在开发阶段实现快速更新,将变更仅限于修改的模块,而不需要重新构建和刷新整个页面。这大大缩短了调试和开发周期,提高了开发效率。
保持状态:HMR能够在模块更新时保持应用程序的状态和数据。当你修改一个模块后,不会丢失已有的应用状态,使得开发过程更加流畅。
模块级热更新:Vite的HMR能够实现模块级别的热替换。这意味着你可以在不影响其他模块的情况下,只更新当前修改的模块,从而最小化代码刷新带来的影响。
更少的构建开销:由于Vite不需要在每次文件修改时重新构建整个应用程序,因此在开发过程中能够减少构建开销,提高构建速度。

综上所述,Vite的HMR使得前端开发者在开发阶段能够更加高效地进行模块修改,快速查看结果并保持应用程序的状态,极大地提升了开发体验和开发效率。
全部评论

相关推荐

bg211本硕,无实习无实际项目,只有导师接的几个无关痛痒的项目。简历全是自己在网上找的项目。投的比较晚,因为某些毕设的事情。三月下旬开始投,4月才开始大规模投。字节一战是学校师兄推的部门,日常无转正,聊的还不错,但是算法没手撕出来 寄了二战腾讯全栈,问了一堆项目里的分库分表的操作,八股里面压根没有,但我项目做的很简单只分了表没分库,对方知道后瞬间没兴趣了。30分钟草草结束。之后腾讯再也没有捞我。之后开始狂做笔试。第一次做阿里系笔试看到那与力扣hot100风格完全不同的题目时直接懵了。本科上机考就烂,洛谷本科刷了2年一上机还是不会。本来觉得阿里系都寄了,直到做到蚂蚁的笔试轻松a出2.5道才又有了信心。后续笔试目标全都是两道。时间来到四月中旬,字节二面,部门是国际商业化,千万留意这个部门,面试官你会的不问,不会的揪着你问,挂就算了,面了这部门后,字节再也没有约面。美团笔试只做了一道还是约面了,面试官人很好很有耐心,问的都是常规八股,我答的并不好还是耐心回答还教我,我连mysql的基本命令都写不出来他还是让我过了。二面问的东西也是很常规 但我也没答好,最后果不其然寄了。后续痛定思痛,苦练mysql和背八股到滚瓜烂熟。蚂蚁约了个面试,但面试官既不开摄像头,说话也吞吞吐吐,磨洋工耗时间,35分钟一到就直接结束。百度真是个很幽默的公司,投了一直不理我,然后简历挂了。突然有天来个电话,说给我找到个合适的岗位。面试使用的软件叫如流,巨卡,面试官那边巨吵,面试时面试官全程无互动。面完之后跟我说不匹配,想找c++做存储不想找java。那你早不说非要浪费我50分钟。后续约面越来越少,只有阿里云了。一面常规八股,二面问了些八股加聊天,三面是最离谱的,问了些基本不常见的问题,比如java是怎么实现对lamba表达式的支持的,分析两种动态代理方式的执行流程,其中fastclass有什么用。。。然后手撕随手给了个力扣简单题存在重复元素2,哈系表秒了后要求给出不使用的优化解法,直接使用滑动窗口做出来。后面对我评价是有广度缺乏深度。提心吊胆一个周六后周日约了hr面。hr面完后泡了两个星期多池子,然后被其他部门捞了,加面一次后晚上发了意向书。同意了。面完阿里云之后,面了腾讯云智,做完笔试秒约面试,一面八股过,二面莫名其妙聊了些奇奇怪怪的问题,和面试官似乎不太对的上电波,但还是秒约二面,三面真是神奇,由于部门不使用java只用go和Python,三面面试官不太懂java,问我什么是reentrantlock和condition,也不太懂c和c++ ,我平常除开写些脚本基本不用Python。全程鸡同鸭讲,建议兄弟们选部门还是别随意选没有你擅长语言的,三面寄了是真的折磨。滴滴秋储第一场面的不好,但还是约了二面,等了一个小时当天二面来了 常规八股,之后反问环节也介绍部门了。第二天秒拒。后续做了些小厂笔试和招商银行信用卡中心的笔试和行测。想着找不到大厂就先去小厂再秋招。然后就收到了阿里云的电话。投了简历没有任何反应的公司有京东,阿里灵犀,阿里大文娱,B站,腾讯音乐,shein,momenta,顺丰做了个测评,oppo笔试后就卡住了,高德,贝壳找房,荣耀,小米,阿里飞猪,快手简历挂。笔试挂的有淘天,作业帮,拼多多,饿了么,美团没a出完整一道还是约面了,米哈游作出2道照样,虾皮也是,阿里国际,得物 。网易互娱投的是java岗面的是c++,面试时候拒了。暑期奇妙之旅,谁来谁挨虐。个中滋味,只有自己知道。
点赞 评论 收藏
分享
评论
点赞
1
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务