在React之前的版本中,进行更新时是连续的,将会阻塞整个线程。如果此时有一些重要的任务,比如用户交互、动画等被阻塞时,体验显然是很差的。而有些更新实际并不用着急完成,比如根据网络请求结果更新的内容,或者发生在画面以外。React16为了解决这一问题,而提出了Fiber的核心架构。
React基于key的重排算法
我们知道,React在更新视图时,会比较新旧树的节点,计算出差异,然后根据差异来进行修改。对于同一层级的子节点,如果按顺序依次比较,发现不同则删去原有的,插入新的。这样虽然可行,但如果这一层只是更换了顺序,那么频繁地删除、插入节点,效率会很低。为了提高子元素对比的性能,React使用了基于key的算法,能够更好地复用已有的节点。
React-Redux总结
Redux的文档里提到参考了Elm的架构,之前一直写Elm,对Redux的东西接受的也比较快,这里主要讨论react-redux
里的Provider
,connect
实现,探讨其中性能优化的部分。
JavaScript单线程和事件循环
JavaScript的一大特点就是单线程,在JS引擎里,同一时间只能做一件事,不存在并发。
从CSS视觉格式化模型看盒模型
学习CSS的时候,大部分时间只是背属性,写写Demo,并没有真正系统地研究一些基础的原理,学到的还只是一些零碎的知识点。趁着有时间,通过查看w3c的官方文档,希望能从视觉格式化模型(Visual formatting model)的角度深入了解。本篇整理几个重要的知识点:盒模型,包含块,BFC,IFC。
Hexo+GitHub Pages搭建个人博客
心血来潮想搭个博客玩玩,搞域名、服务器什么的太麻烦,于是找了些教程学习用Hexo+GitHub Pages搭建个人博客,完全是静态文件。第一篇博客就记录下搭建的过程以及一些坑,以供以后参考,之后也可能继续更新。