获得徽章 1
- #青训营笔记创作活动#
2月9日 day22
今日学习
对树状结构进行添加、删除、修改等处理时会很容易出错也不方便数据处理,平常的树状结构每层数组都会有一个子选项然后再嵌套下去而拍扁之后的树状结构其实是一个对象每个item都扁平化平铺在第一层也就清晰明了了,学到了展开评论点赞 - #青训营笔记创作活动#
2月8日 day21
今日学习
关于现代包管理器的深度思考——为什么现在我更推荐pnpm而不是npm/yarn?
pnpm的包安全速度快,磁盘空间利用高效,安全性高。安装也非常的简单,pnpm目录下为扁平结构但是说着软链接是嵌套的结构,把包本身和依赖放在同一个node_module下面与原生node兼容又能将package与相关的依赖组织在一起,node_modules比以前清晰规范了许多。展开评论点赞 - #青训营笔记创作活动#
2月7日 day20
今日学习
纯前端实现「羊了个羊」小游戏
哈哈哈,这么弱智的玩意即便是前端我上我也行博主这个背景就开始搞笑,这里就看到线性代数的作用从基础生成到优化地图卡片渲染,再到覆盖关系填充数据完善很好的一个教程。展开评论点赞 - #青训营笔记创作活动#
2月6日 day19
今日学习
前段应该掌握的浏览器调试技巧,console.log,不能解决前段中所有打印输出的问题;这尤其在为公司提供基础框架和组件库的同时页面渲染、网络、代码编译、依赖包、脚手架等等的问题越来越多,文中打印输出普通断点条件断点Dom断点VScode断点调试方式诸多调试可以解决相应的问题展开评论点赞 - #青训营笔记创作活动#
2月5日 day18
今日学习
别整一坨CSS代码了试试这几个实用函数
Clamp Max Min函数把一个值限制在一个上限与下限之间,当这个值超过最小值和最大值的范围时,在最小值与最大值之间选择一个值使用。在流体尺寸和定位、装饰性元素、流体高度、Loading Bar、动态分割器、动态border Radius和间距都可以使用这三个函数来进行前段的应用开发。展开评论点赞 - #青训营笔记创作活动#
2月4日 day17
今日学习(“还在用定时器吗?借助css来监听事件 ” 写码过程中经常会用到延迟加载定时查询,这时可以借助css来控制定时器 ;hover active配合transition延时监听实现延时触发效果,css动画设置infinite配合animationiteration监听实现周期触发。)展开评论点赞 - #青训营笔记创作活动#
2月3日 day16
今日学习(前端实现活体人脸检测)
人脸识别作为当下应用作为用户个人信息验证中非常普遍,大多数人脸识别都是由前端来录制视频再由后端来识别,这位博主的由纯前端应用的开发非常厉害且使用,受教了。展开评论点赞 - #青训营笔记创作活动#
2月2日 day15
今日学习(为什么说 90% 的前端不会调试 Ant Design 源码?)
antd 是 react 主流组件库,我们经常使用它但可能并没有调试过它的源码。
我们可以在 renderWithHooks 里调用函数组件的地方打个条件断点,在调用想调试的组件时断住,这样我们就可以 step into 到该组件定义的地方。但这样调试的并不是最初的源码,没有 jsx 和 ts 语法。
想调试最初的 tsx 源码需要用 sourcemap。
antd 有三种入口:es 目录对应 esm 入口,lib 目录对应 commonjs 入口,dist 目录对应 UMD 入口。
把 antd 代码下载下来,执行 npm run dist 就可以生成 UMD 形式的代码。
想要 sourcemap 映射到 tsx 源码,需要把 devtool 设置成 cheap-module-source-map,然后开启 babel-loader 和 ts-loader 的 sourcemap。
把产物覆盖 antd 的 dist 下的产物,再调试就可以直接调试 antd 组件的 tsx 源码了。展开评论点赞 - #青训营笔记创作活动#
2月1日 day14
今日学习(使用fabric.js 快速开发一个图片编辑器)
fabric.js创建对象,用EventEmitter创建事件发射器,可订阅单选、多选、取消选择事件。 通过vue的provide语法把fabric对象、EventEmitter对象向下传递,在mixins中保存选中的元素和选中状态。后续插入元素属性调整元素对齐优化既完成了一个图片编辑器的开发。展开评论点赞 - #青训营笔记创作活动#
1月31日 day13
今日学习(还在用 JS 做节流吗?CSS 也可以防止按钮重复点击)
函数节流是JS常用的防止按钮重复点击的优化手段,CSS也同样能够实现对 CSS 动画的控制,比如有一个动画控制按钮从禁用->可点击的变化,每次点击时让这个动画重新执行一遍,在执行的过程中,一直处于禁用状态,就达到了想要的效果。展开评论点赞