获得徽章 8
- 每日技术分享day03,想了半天,不知道分享啥,今天学习了webpack里面的HMR和devServer,webpack代码分离,其中包含了publicPath和devServer中的各个属性,卷了大概8个小时,一会跑完步,还留了一个半小时的小尾巴,脑子太累了
赞过21 - 每日技术分享_day02,今日分享的是webpack中devtool属性source-map,以及各个值的区别
1. 为什么要设置source-map,因为打包后的代码经过丑化,压缩和ES5转换之后,代码编号和索引号与源代码大大不同,如果代码发生错误,我们如何快速的定位源代码的错误位置呢?
devtool设置为source-map在打包之后生成.map文件,映射源文件的代码,同时在打包后的js文件最后一行有一行注释指向.map文件位置,浏览器看到这个注释就会去加载map文件 图1,图2
2. 各个值的区别
false 不生成映射文件,一个生产时使用 图5,图6
cheap-source-map 构建速度比source-map快,但是不生成列映射错误信息 (但已经够用了)
cheap-module-source-map 和cheap-source-map一致,不过对对源自loader的sourcemap处理更好, 目前比较推荐 图3,图4
hidden-source-map 隐藏打包文件最后一行的注释,但是生成.map文件(用的较少)
nosources-source-map 隐藏映射后的文件,只有代码错误提示,但是并没有加载后源代码,不能点进去
我表述的可能不大准确,希望大家能够多多包涵,如果有更好的表述方式,可以评论区下面留言,大家可以一起探讨一下
展开赞过23 - 每日技术分享_day01,今天分享的是防抖函数和性能优化应用场景
防抖函数源自电子元件的概念,具体是指,如果我们不想高频率的去触发某个事件,而是希望延迟一段时间之后再去触发这个事件.
比如购物车联想搜索,我们想要用户输入完毕之后再去发送请求,而不是输入一个字就发一次请求,防抖函数减轻了部分服务器压力.
防抖函数实现的思路,是设置一个标志位,如果标志位存在就代表有定时器的存在,那么需要清除这个定时器,重新去开启新的定时器,直到不再触发这个函数,定时器结束,触发事件
---第一天做技术分享,我表述的可能不大准确,希望大家能够多多包涵,如果有更好的表述方式,可以评论区下面留言,大家可以一起探讨一下
展开赞过评论1
![[捂脸]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_28.8981538.png)
![[哭笑]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_61.a296509.png)
![[流泪]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_6.dde0d83.png)