通过使用 CSS、canvas 和 SVG 三种不同的方式实现同一个效果，反而成了对三种不同技术的最简单的介绍，这也是最后加上 canvas 实现的一部分原因，所以希望会对正在学些这些的初学者有所帮助...

前端工程化大家多多少少都接触过一些随便抓个小前端一问都知道：“前端工程化？大家都知道啊，大概就这样”为什么要工程化在我的理解有这几点：方便管理、专注开发、快速迭代等我们先说上图右边组件化：组件化开发自

React 是一个用于构建用户交互界面的 JavaScript 库，其核心 机制 就是跟踪组件的状态变化，并将更新的状态映射到到新的界面。在 React 中，我们将此过程称之为协调。我们调用 setState 方法来改变状态，而框架本身会去检查 state 或 props 是否…

以下几个问题是我们在实际开发中经常会遇到的场景，下面用几个简单的示例代码来还原一下。 3.更新时会把每个组件的更新合并，每个组件只会触发一次更新的生命周期。 由于源码比较复杂，就不贴在这里了，有兴趣的可以去github上clone一份然后按照下面的流程图去走一遍。 1.将set…

setState(updater, callback)这个方法是用来告诉react组件数据有更新，有可能需要重新渲染。它是异步的，react通常会集齐一批需要更新的组件，然后一次性更新来保证渲染的性能，所以这就给我们埋了一个坑： 那就是在使用setState改变状态之后，立刻通…

业余时间我也算看了不少优秀开源项目的源码比如react,redux,vuex,vue,babel，ant-design等，但是很少系统地进行总结，学到的知识非常有限，因此我一直想写一篇完善的源码解读方面的文章。 第二个原因是最近面试的过程中，发现很多候选人对redux的理解很浅…

在 Web 应用开发过程中，我们经常谈及到的就是优化，而优化往往又是既简单而又复杂的过程，优化这个命题很广，最终体现出来的都是用户体验问题，我们一切优化都是为了用户体验。 为什么说简单？在现代 Web 开发生态中，有非常优秀的工具链帮助我们做一些很实际的优化工作，例如 webp…

Webpack是现在主流的功能强大的模块化打包工具，在使用Webpack时，如果不注意性能优化，有非常大的可能会产生性能问题，性能问题主要分为开发时打包构建速度慢、开发调试时的重复性工作、以及输出文件质量不高等，因此性能优化也主要从这些方面来分析。本文主要是根据自己的理解对《深…

编程是一件很快乐的事，实现一个目的，我们可以有很多方法路径，在这篇文章我们介绍一些JavaScript的奇技淫巧，仅供大家参考，各路大神在平时的代码编写时，如很多简洁高效的书写方式；欢迎各位在下方留言。 由上结果，字面量产出的原始数据类型无法使用instanceof判断。 从打…