Posted on | In
说明项目想要根据选择来实现初始化不同的模板，之前的模板太重了。 如何实现 cli 插件可能使用的依赖介绍： commander：node.js 命令行接口的完整解决方案，自定义命令 chalk：修改控制台中字符串的样式（字体样式加粗等／字体颜色／背景颜色） cross-spawn：Node.js 的子进程 child_process 模块下有一 spawn 函数，可以用于调用系统上的命令，如在 Linux, macOS 等系统上。这个库是用来兼容多平台 fs-extra：文件操作 path：这 ...
Read more »

Posted on
H5 端与 安卓、ios 端的通信基于 WebView 的机制和开放的 API, 实现这个功能有三种常见的方案： API注入，原理其实就是 Native 获取 JavaScript环境上下文，并直接在上面挂载对象或者方法，使 js 可以直接调用，Android 与 IOS 分别拥有对应的挂载方式。 WebView 中的 prompt/console/alert 拦截，通常使用 prompt，因为这个方法在前端中使用频率低，比较不会出现冲突； WebView URL Scheme 跳转拦截； ...
Read more »

Posted on | In
##主要监控指标 DNS查询时间——DNS查询的开始到结束所花费的时间； TCP连接时间——TCP建立连接到连接成功的所花费的时间； 首屏时间——用户浏览器首屏内所有内容都呈现出来所花费的时间； 用户可操作时间(dom Interactive)——用户可以进行正常的点击、输入等操作，默认可以统计domready时间，因为通常会在这时候绑定事件操作； DOM渲染完成时间——代表DOMContentLoaded事件完成的时间节点，此刻用户可以对页面进行操作，也就是页面中的domready时 ...
Read more »

Posted on | In
总结同步情况首次渲染 createElement 生成 reactComponent 调用 render 方法，传入 reactComponent 与 挂载点的实例 生成 FiberRoot ，主要的属性是 containerInfo （挂载点的实例），current （RootFiber），以及一大堆的 time 调度阶段，把 reactComponent 添加到 update 里，最后放到 RootFiber 的 updateQueue 里 建立 FIber 树关联阶段，如果碰到 comp ...
Read more »

Posted on | In
基础程序中的数在计算机内存中都是以二进制的形式存在的，位运算就是直接对整数在内存中对应的二进制位进行操作。 二进制 十进制转二进制时，采用“除 2 取余，逆序排列”法 用 2 整除十进制数，得到商和余数; 再用 2 整除商，得到新的商和余数; 重复第 1 和第 2 步，直到商为 0; 将先得到的余数作为二进制数的高位，后得到的余数作为二进制数的低位，依次排序; 1234567101 % 2 = 50 余 150 % 2 = 25 余 025 % 2 = 12 余 112 % 2 = 6 余 ...
Read more »

Posted on | In
事件React利用事件委托机制在document上统一监听DOM事件，再根据触发的target将事件分发到具体的组件实例。另外上面e是一个合成事件对象(SyntheticEvent)，而不是原始的DOM事件对象。 React自定义一套事件系统的动机有以下几个： 抹平浏览器之间的兼容性差异 事件‘合成’, 即事件自定义 抽象跨平台事件机制 例子123456789101112131415161718192021222324252627282930313233<html><bod ...
Read more »

Posted on | In
setState关于 setState() 你应该了解三件事： 不要直接修改 State 1234567// Wrong// 此代码不会重新渲染组件this.state.comment = 'Hello';// Correct// 而是应该使用 setState()this.setState({comment: 'Hello'}); State 的更新可能是异步的 出于性能考虑，React 可能会把多个 setState() 调用合并成一个调用。 因为 this.pr ...
Read more »

Posted on | In
生命周期组件的生命周期可分成三个状态： Mounting：已插入真实 DOM Updating：正在被重新渲染 Unmounting：已移出真实 DOM 生命周期的方法有： componentWillMount 在渲染前调用,在客户端也在服务端。 componentDidMount : 在第一次渲染后调用，只在客户端。之后组件已经生成了对应的DOM结构，可以通过this.getDOMNode()来进行访问。 如果你想和其他JavaScript框架一起使用，可以在这个方法中调用setTime ...
Read more »

Posted on
tua-body-scroll-lock解决模态窗滑动时候，穿透到背景，背景被滑动的问题 示例：使用的 vue 123456789101112import { lock, unlock } from "tua-body-scroll-lock";... mounted() { // 禁止滑动后还需要内部可以滚动的元素 console.warn(this.$refs["rule-list"]); lock(this.$re ...
Read more »