屏幕旋转与文档方向？如何监听文档方向变化，如何兼容横屏/竖屏模式下的样式布局以及实现强制横屏展示canvas手写电子签名页？基于实践问题，本文主要覆盖以下至少点：文档方向与屏幕方向不同端APP浏览器的横屏预览支持情况移动端适配横屏布局快速兼容canvas响应式适配屏幕旋转带来的问题以及兼容方法

打开和关闭抽屉式选项卡：按Esc键可打开和关闭 DevTools 的 Drawer（抽屉式选项卡） 在Drawer（抽屉式选项卡）中，你可以在 Console 控制台中执行命令，查看动画检查器(Animations)，配置网络条件(network conditions)和渲染(rendering)设置，搜索(search)字符串和文件等

Webpack构建流程：初始化配置参数 -> 绑定事件钩子回调 -> 确定Entry逐一遍历 -> 使用loader编译文件 -> 输出文件

Madal组件实现基本简介 类似于antd实现的modal组件，首先基本结构分析： modal-mask遮罩层 modal-warp内容包装层 modal主体内容层，包含：title、content、footer、close-btn 固定定位布局，全屏遮盖显示，所以内容自定义 实现功能目标： 两种调用方式<Modal {...props}>一些内容</Modal>、Modal.confirm({....

web可视化查看构建分析：得到了webpack构建信息文件stats.json，如何进行很好的可视化查看？ 方案一：通过可视化分析工具Webpack Analyse，是个在线Web应用，上传stats.json文件就可以；不过好像需要翻墙；

了解下同源策略 源（origin）*：就是协议、域名和端口号； 同源： 就是源相同，即协议、域名和端口完全相同； 同源策略：同源策略是浏览器的一个安全功能，不同源的客户端脚本在没有明确授权的情况下，不能读写对方资源； 同源策略的分类： DOM 同源策略：即针对于DOM，禁止对不同源页面的DOM进行操作;如不同域名的 ifra...

使用背景 当我们需要将项目部署到远程线上服务器时；传统的方法可能就是： 将本地代码通过ssh、ftp等方式上传到服务器； 然后通过ssh登入到服务器，配置好环境； 手动启动应用。 太过手动化，麻烦，操作繁琐。 现代自动化部署 环境：本地（Mac）；远程服务器（CentOS） 使用工具：Git、pm2、node； 需知概念：ssh秘钥登...

服务器下载安装包 下载: curl -O https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel62-4.0.6.tgz;

是可以用于生产环境的Nodejs的进程管理工具，并且它内置一个负载均衡。它不仅可以保证服务不会中断一直在线，并且提供0秒reload功能，还有其他一系列进程管理、监控功能。并且使用起来非常简单。

对于一个服务器应用来说，日志的记录是必不可少的，我们需要使用其记录项目程序每天都做了什么，什么时候发生过错误，发生过什么错误等等，便于日后回顾、实时掌握服务器的运行状态，还原问题场景。

在微信小程序中，有遇到要展示店铺评分，或者是订单完成后对商品进行评价，用到了星星展示，查了下，在微信中无法使用svg实现图片，微信中只能将svg图片转成base64来显示，所以是在vue中使用的svg来实现评分

有时候一个简单Bug的出现，往往是由于一点知识小细节；但往往这点小细节看似简单，其背后却颇有韵味。 （需求）这部分UI给换成这样的 看起来相对比较简单，分析下结构： 整体为无序列表，需要保留前置图标； 每个列表后跟随对号，且始终垂直居中； 嗯？首先需要个对号，Css好像可以实现（那就用不用麻烦用icon了）： 对...

传统Diff：diff算法即差异查找算法；对于Html DOM结构即为tree的差异查找算法；而对于计算两颗树的差异时间复杂度为O（n^3）,显然成本太高，React不可能采用这种传统算法；

在React中，render执行的结果得到的并不是真正的DOM节点，结果仅仅是轻量级的JavaScript对象，我们称之为virtual DOM。

编辑器&Mac 1、编辑器的使用vs code 插件 git辅助工具，可查看代码的书写者：Git Blame 2、 Mac工具使用 强大终端 item2 3、在 macOS 中完美配置文件名大小写敏感（解决git默认对大小写不敏感问题）解决git大小写不敏感 知识篇 一、git使用 一般企业中使用代码管理工具Git开发时都是通过拉分支进行功能细致开发，所...

setState不会立刻改变React组件中state的值（即setState是异步更新） setState通过一个队列机制实现state更新；

React组件事件响应 React在构建虚拟DOM的同时，还构建了自己的事件系统；且所有事件对象和W3C规范保持一致。 React的事件系统和浏览器事件系统相比，主要增加了两个特性：事件代理、和事件自动绑定。 1、事件代理 区别于浏览器事件处理方式，React并未将事件处理函数与对应的DOM节点直接关联，而是在顶层使用了一个全局...

3. 组件生命周期 React严格定义了组件的生命周期，生命周期可能会经历如下三个过程： 装载过程（Mount）：也就是把组件第一次在DOM树上渲染的过程； 更新过程（Updata）：当组件被从新渲染的过程； 卸载过程（Unmount）：组件从DOM树中删除的过程。 三种不同的过程，React库会调用组件的一些成员函数，即生命周期函数。 ...

React组件的性能优化 高德纳: "我们应该忘记忽略很小的性能优化，可以说97%的情况下，过早的优化是万恶之源，而我们应该关心对性能影响最关键的另外3%的代码。" 不要将性能优化的精力浪费在对整体性能提高不大的代码上，而对性能有关键影响的部分， 优化并不嫌早。因为，对性能影响最关键的部分，往往涉及解决方案核心，...

深入浅出React（一） 1、create-react-app工具使用 安装create-react-app {代码...} 创建项目 {代码...} 分解应用 package.json {代码...} npm start启动开发环境，npm run build创建生产环境优化代码，npm test用于测试单元，npm run eject把潜藏在react-scripts中的一序列技术栈“弹射”到应用的顶端，此命令不可逆且会...

React组件的this是什么 通过编写一个简单组件，并渲染出来，分别打印出自定义函数和render中的this： {代码...} 结果如图： 可以看到，render函数中的this指向了组件实例，而handler（）函数中的this则为undefined，这是为何？ JavaScript函数中的this 我们都知道JavaScript函数中的this不是在函数声明的时候定义的，而...