Mieruko的实验室

演化：前后端分离带来的前端工程化萌芽

前言：前端工程化是近年来屡被提及的一个概念，它并非凭空而来，而是在前端业务演化的过程中应运而生。公元前的前后端开发模式：牵一发而动全身在前端被称为“切图仔”的年代里，一个项目的开发流程是这样的： step1：前端拿到设计稿，用HTML+CSS实现。如果有必要，写一点点点点的js（比如简单的动画） step2:把写好的前端代码交给后端工程师 step3:后端工程师把前端代码里的HT......

Posted by mieruko on 2018-04-27

状态更新策略对比：React setState vs Vue nextTick

前言可能会是一篇有点长的源码阅读笔记。。。。。。之前Medium上有一位兄台曾经写过这样一篇文章: 这个标题说出了包括曾经的我在内的React开发者的心声。但是在读完知乎杨森：React 源码剖析系列－解密 setState这篇文章后，我不这么想了。具体setState的机制，在文中也有讲解，我之前也开博记录过自己的理解（理解React中的setState)。今天......

Posted by mieruko on 2018-03-01

React更进一步：在实践中理解React工作原理

前言最近读了程墨前辈的《深入浅出React和Redux》这本书，很庆幸自己是用RN写过些东西之后读的这本书，一边读一边回忆自己曾经实践的过程，对React的理解又加深了一层，特别开心。这篇文章是想结合之前写过的项目，对React的运行机制，实践原则做一个自己的梳理。驱使我了解React，学习React的项目，是”一图”。（突然觉得我博客里给一图打的广告是不是太多了哈哈哈哈，既然如此那我就再打......

Posted by mieruko on 2018-02-22

不懂为什么，突然想写一个Event-Emitter

前言最近学习使用Vue进行团队项目的开发，看到main.js里有个叫bus的东西，觉得bus这个名字也太可爱了吧，想着它到底是啥呢🤔。读完之后知道，这里的bus就是在Vue里写一个Event-Emitter。Event-Emitter是一个很常用的东西，github有一个开源库叫做mitt，就是专门来做这个事的。只有60行，读完之后觉得代码虽少，但还是有可圈可点的地方，所以有了这篇博客。 ......

Posted by mieruko on 2018-01-27

从redux-thunk的14行源码和dispatch函数的实现过程，说说我眼中的redux中间件

缘起我是在去年暑假第一次有了“该用redux代替烦死人的props传递了”的概念后，在github上扒拉别人的redux项目看，然后第一次见到thunk这个中间件。后来一图重构，我记得我们的redux里是用了这个中间件。选用的契机是，文档和别人的开源项目告诉我们，它有用。。。。然后最近总是遇到一个相同的问题：如果我有一个异步请求，需要把请求回来的数据给放进store里，我该咋办？？？嗨呀，既......

Posted by mieruko on 2018-01-04

异步网络请求进化史：从ajax到fetch到axios

不是前言的前言其实原生ajax和fetch已经很久没用了。。。毕竟axios真是太好用了。原生ajax其实就是XMLHttpRequest。或许每个前端在入门js基础的时候都见过这样一段代码: 123456789101112131415161718192021222324252627282930function success(text) { var text......

Posted by mieruko on 2018-01-02

在使用Redux重构应用之前:从React的context属性说开去

前言:和Redux不得不说的故事（这一段是生活流水账也就是写给自己看的废话可以跳过不看 Redux直走下一个加粗小标题就可以~）第一次使用RN构建完整的上架应用,是去年四月份开始的一图：图书馆的另一半（开源代码地址在这里）这个项目。当时学React的时候搜索到的资源,基本上多多少少都会把Redux,React-Router捎带着讲一下。但是因为初次开发,我的思路比较原始,......

Posted by mieruko on 2018-01-01

从实际应用的角度认识BFC

前言:BFC，即块级格式化上下文。对BFC好奇起源于工作当中的两个现象，一个是垂直方向上的边距重叠问题，一个是清除浮动。其实这俩现象在曾经的我眼里都是非常正常并可以理解的现象，前两天同事突然提到说这个其实是可以用BFC解决的。今天没啥事，刚好有空坐下来瞅瞅这个BFC。帮助与支持：感谢网易考拉前端团队的学习 BFC (Block Formatting Context)这篇文章。什......

Posted by mieruko on 2017-11-25

重新理解事件循环和异步队列：区分macro和micro

前言前两天看到一段代码，代码具体长啥样记不起来了，重点里面有个setTimeout（A君）,有个promise.then（B君）调用。我琢磨着大家都是异步，异步就是进队列等着，先进先出，那么肯定是A君的回调先执行，然后B君。结果那段代码跑出来是promise的调用先执行了。由此发现哈哈哈哈哈我自以为理解得很清楚的javascript异步队列其实理解得就是一坨。。。。。。:)感谢万能的知乎和简......

Posted by mieruko on 2017-10-02

理解React中的setState

前言之前我对setState这个api的理解，仅限于：它管组件自己的数据，它是异步。如此而已。前两天被一个前辈问到说“setState后究竟发生了什么？”。除了数生命周期外我竟什么都说不出来。这两天读了点东西，才知道正是因为对setState的一个巧妙的处理，React才表现出那么好的性能。（当然性能好这一点是多方面的，比如虚拟dom也功不可没）。要想理解React，必须理解setState......

Posted by mieruko on 2017-09-25