用户7844999933849
获得徽章 1
#挑战每日一条沸点#
day20
每次位置和随机数判定合格，我们应该实际放置一张卡片，一个实际的 dom。然后根据卡片的 x、y、z、宽高 值设置实际位置
day20
每次位置和随机数判定合格，我们应该实际放置一张卡片，一个实际的 dom。然后根据卡片的 x、y、z、宽高 值设置实际位置
评论
点赞
#挑战每日一条沸点#
day19
console 是我们开发中经常使用的功能，用来输出打印和调试开发，比较熟悉的有log、error、warn，这几个是常用的，但是如果你仅仅只是了解这几个那就挺可惜了，错过了那些有助于调高开发效率的功能
day19
console 是我们开发中经常使用的功能，用来输出打印和调试开发，比较熟悉的有log、error、warn，这几个是常用的，但是如果你仅仅只是了解这几个那就挺可惜了，错过了那些有助于调高开发效率的功能
评论
点赞
#挑战每日一条沸点#
day18
首先，我们设定一个最小值为 0%
首选值是 --loading CSS变量的当前值
最大值代表当前的加载量减去进度条件的宽度
这里的CSS clamp()为我们提供了这个组件的三种不同的状态信息，这个方案很 nice
day18
首先，我们设定一个最小值为 0%
首选值是 --loading CSS变量的当前值
最大值代表当前的加载量减去进度条件的宽度
这里的CSS clamp()为我们提供了这个组件的三种不同的状态信息，这个方案很 nice
展开
评论
点赞
#挑战每日一条沸点#
day17
另外，在使用mouseout时还需要考虑 dom 嵌套结构，因为这些事件在父级 -> 子级的过程中仍然会触发，总之，细节会非常多，很容易误触发。
day17
另外，在使用mouseout时还需要考虑 dom 嵌套结构，因为这些事件在父级 -> 子级的过程中仍然会触发，总之，细节会非常多，很容易误触发。
评论
点赞
#挑战每日一条沸点#
day16
在网页中使用活体人脸检测大部分都是前端录制一段视频，让后端调用第三方接口去判断，今天就用了纯前端方式来实现这个功能啦啦啦啦啦啦
day16
在网页中使用活体人脸检测大部分都是前端录制一段视频，让后端调用第三方接口去判断，今天就用了纯前端方式来实现这个功能啦啦啦啦啦啦
评论
点赞
#挑战每日一条沸点#
day15
代码经过了 tsc 的编译，然后又经过了 babel 的编译，最后再通过 webpack 打包成 bundle.js。
tsc 和 babel 的编译都会生成 sourcemap，而 webpack 也会生成一个 sourcemap。
webpack 的 sourcemap 默认只会根据最后一个 loader 的 sourcemap 来生成。
day15
代码经过了 tsc 的编译，然后又经过了 babel 的编译，最后再通过 webpack 打包成 bundle.js。
tsc 和 babel 的编译都会生成 sourcemap，而 webpack 也会生成一个 sourcemap。
webpack 的 sourcemap 默认只会根据最后一个 loader 的 sourcemap 来生成。
展开
评论
点赞
#挑战每日一条沸点#
day14
在入口文件中初始化实例，然后与mixins结合，在mixins中定义了选择类型（多选、单选、未选中）、选中元素类型、选中id等属性，以及选中、取消选中的事件，子组件通过引入mixins来开发对应功能；如子组件需要对fabric对象进行操作，则可以通过inject获得原始对象。
day14
在入口文件中初始化实例，然后与mixins结合，在mixins中定义了选择类型（多选、单选、未选中）、选中元素类型、选中id等属性，以及选中、取消选中的事件，子组件通过引入mixins来开发对应功能；如子组件需要对fabric对象进行操作，则可以通过inject获得原始对象。
展开
评论
点赞
#挑战每日一条沸点#
day13
CSS 实现“节流”其实就是控制一个动画的精准控制，假设有一个动画控制按钮从禁用->可点击的变化，每次点击时让这个动画重新执行一遍，在执行的过程中，一直处于禁用状态，这样就达到了“节流”的效果
day13
CSS 实现“节流”其实就是控制一个动画的精准控制，假设有一个动画控制按钮从禁用->可点击的变化，每次点击时让这个动画重新执行一遍，在执行的过程中，一直处于禁用状态，这样就达到了“节流”的效果
评论
点赞
#挑战每日一条沸点#
day12
在 Web Worker 线程的运行环境中无法访问 document 对象，这一条符合当前的需求，但是该环境中能获取 XMLHttpRequest 对象，可以发送 ajax 请求，不符合不能调接口的要求
day12
在 Web Worker 线程的运行环境中无法访问 document 对象，这一条符合当前的需求，但是该环境中能获取 XMLHttpRequest 对象，可以发送 ajax 请求，不符合不能调接口的要求
评论
点赞
#挑战每日一条沸点#
day11
rem是指相对于根元素的字体大小的单位，在日常开发过程中我们通常把根元素（html/body）的字体设置为10px,方便于我们计算（此时子元素的1rem就相当于10px）。
day11
rem是指相对于根元素的字体大小的单位，在日常开发过程中我们通常把根元素（html/body）的字体设置为10px,方便于我们计算（此时子元素的1rem就相当于10px）。
评论
点赞
#挑战每日一条沸点#
day10
平时开发的时候数据都是通过请求接口获取的，也会存在接口没有数据的情况。这个时候正常的做法是给用户一个提示，让用户知道当前不是出 bug 了，而是确实没有数据
day10
平时开发的时候数据都是通过请求接口获取的，也会存在接口没有数据的情况。这个时候正常的做法是给用户一个提示，让用户知道当前不是出 bug 了，而是确实没有数据
评论
点赞
#挑战每日一条沸点#
day9
输入「文件夹名称-tinyImg」，接着工具会找到当前项目下所有的tinyImg，接着选择一或多个tinyImg，紧接着，工具会找出tinyImg下所有的png、jpe?g和svga，最后选择压缩模式「全量」或「自定义」，选择需要压缩的图片。
day9
输入「文件夹名称-tinyImg」，接着工具会找到当前项目下所有的tinyImg，接着选择一或多个tinyImg，紧接着，工具会找出tinyImg下所有的png、jpe?g和svga，最后选择压缩模式「全量」或「自定义」，选择需要压缩的图片。
评论
点赞
#挑战每日一条沸点#
dau8
Esbuild 作为 Bundler 已经被 Vite 作为开发阶段的依赖预打包工具，同时也被大量用作线上 esm CDN 服务，比如esm.sh等等；作为 Minimizer ，Esbuild 也已足够成熟，目前已经被 Vite 作为 JS 和 CSS 代码的压缩工具用上了生产环境。
dau8
Esbuild 作为 Bundler 已经被 Vite 作为开发阶段的依赖预打包工具，同时也被大量用作线上 esm CDN 服务，比如esm.sh等等；作为 Minimizer ，Esbuild 也已足够成熟，目前已经被 Vite 作为 JS 和 CSS 代码的压缩工具用上了生产环境。
展开
评论
点赞
#挑战每日一条沸点#
day7
WebRTC (Web Real-Time Communications) 是一项实时通讯技术，它允许网络应用或者站点，在不借助中间媒介的情况下，建立浏览器之间点对点（Peer-to-Peer）的连接，实现视频流和（或）音频流或者其他任意数据的传输。WebRTC 包含的这些标准使用户在无需安装任何插件或者第三方的软件的情况下，创建点对点（Peer-to-Peer）的数据分享和电话会议成为可能。
day7
WebRTC (Web Real-Time Communications) 是一项实时通讯技术，它允许网络应用或者站点，在不借助中间媒介的情况下，建立浏览器之间点对点（Peer-to-Peer）的连接，实现视频流和（或）音频流或者其他任意数据的传输。WebRTC 包含的这些标准使用户在无需安装任何插件或者第三方的软件的情况下，创建点对点（Peer-to-Peer）的数据分享和电话会议成为可能。
展开
评论
点赞
#挑战每日一条沸点#
day6
数据在网络上是以很小的帧的单位传输的，帧通过特定的称为网络驱动程序的程序进行成型，然后通过网卡发送到网线上，通过网线到达目的机器，在目的机器的一端执行相反的过程。接收端机器的以太网捕获到这些帧，并告诉操作系统帧已到达，然后对其进行存储。在这个传输和接收的过程，就可以使用抓包工具（Sniffers）进行抓包，作为前端开发者，通常是抓取应用层的 HTTP/HTTPS 的包。
day6
数据在网络上是以很小的帧的单位传输的，帧通过特定的称为网络驱动程序的程序进行成型，然后通过网卡发送到网线上，通过网线到达目的机器，在目的机器的一端执行相反的过程。接收端机器的以太网捕获到这些帧，并告诉操作系统帧已到达，然后对其进行存储。在这个传输和接收的过程，就可以使用抓包工具（Sniffers）进行抓包，作为前端开发者，通常是抓取应用层的 HTTP/HTTPS 的包。
展开
评论
点赞
#挑战每日一条沸点#
day5
使用 length 调整/清空数组
我们基本上覆盖了数组的 length 。
如果我们要调整数组的大小：
var entries = [1, 2, 3, 4, 5, 6, 7];
console.log(entries.length);
// 7
entries.length = 4;
console.log(entries.length);
// 4
console.log(entries);
// [1, 2, 3, 4]
如果我们要清空数组
day5
使用 length 调整/清空数组
我们基本上覆盖了数组的 length 。
如果我们要调整数组的大小：
var entries = [1, 2, 3, 4, 5, 6, 7];
console.log(entries.length);
// 7
entries.length = 4;
console.log(entries.length);
// 4
console.log(entries);
// [1, 2, 3, 4]
如果我们要清空数组
展开
1
点赞
#挑战每日一条沸点#
day3
现代的前端工程已经越来越离不开 Monorepo 了，无论是业务代码还是工具库，越来越多的项目已经采用 Monorepo 的方式来进行开发。Google 宁愿把所有的代码都放在一个 Monorepo 工程下面，Vue 3、Yarn、Npm7 等等知名开源项目的源码也是采用 Monorepo 的方式来进行管理的。
day3
现代的前端工程已经越来越离不开 Monorepo 了，无论是业务代码还是工具库，越来越多的项目已经采用 Monorepo 的方式来进行开发。Google 宁愿把所有的代码都放在一个 Monorepo 工程下面，Vue 3、Yarn、Npm7 等等知名开源项目的源码也是采用 Monorepo 的方式来进行管理的。
展开
评论
点赞