浏览器使用流式布局模型 (Flow Based Layout)。 浏览器会把HTML解析成DOM，把CSS解析成CSSOM，DOM和CSSOM合并就产生了Render Tree。 有了RenderTree，我们就知道了所有节点的样式，然后计算他们在页面上的大小和位置，最后把节点…

该项目来自于 Github 用户 Chalarangelo，目前已在 Github 上获得了 5000 多Star，精心收集了多达 48 个有用的 JavaScript 代码片段，该用户的代码可以让程序员在 30 秒甚至更少的时间内理解这些经常用到的基础算法，来看看这些 Jav…

前端工程师首先是个程序员，其次也是个软件工程师，他们工作在离用户最近的地方，负责人机交互和用户体验，虽然叫“前端”，但其实他们的工作边界其实已经很宽了。展望未来，我想前端的工作会继续分化，也会继续融合，分工是工业革命以来社会高效协作的主要推动力，以后很长一段时间应该也会维持这种…

确实，你已经从新手变成了一个「熟手」，也可以胜任公司的工作安排。 只不过总觉得在日复一日地重复昨天的自己。 我也有过这种阶段。我说一下我的应对措施。 将代码分为「业务代码」和「技术代码」是一种简单的二分法。但是实际情况可能并不是这样。我的经验中还有第三种代码，就是「业务技术代码…

Loader 就像是一个翻译员，能把源文件经过转化后输出新的结果，并且一个文件还可以链式的经过多个翻译员翻译。 可以看出以上的处理过程需要有顺序的链式执行，先 sass-loader 再 css-loader 再 style-loader。 由上面的例子可以看出：一个 Load…

Webpack是目前最多人使用的前端打包工具，但webpack功能强大，导致配置比较复杂（各种对应转换loader，各种插件等），如果配置不合理还可能导致打包速度过慢。 最近出现了一款新的打包工具Parcel，受关注程度不亚于Webpack。下面就看下如何具体使用Parcel。…

UnderstandingTheReactSourceCode — InitialRendering(SimpleComponent)IPhotobyGerrievanderWalton Unspla

源码阅读：究竟怎样才算是读懂了？ 市面上有很多源码分析的文章，就我看到的而言，基本的套路就是梳理流程，讲一讲每个模块的功能，整篇文章有一大半都是直接挂源码。我不禁怀疑，作者真的看懂了吗？为什么我看完后还是什么都不懂呢？ 事实上一个经过无数次版本迭代的框架源码并不适合初学者直接阅…

| 导语 《孙子兵法·谋攻》：「知彼知己，百战不殆。」在和产品pk的时候，产品最经常的说一句话是，你看他们（竞品）都能实现，你为啥不能？你看他们（竞品）的速度怎么这么快，你看看你，为啥这么慢？ 《孙子兵法·谋攻》：「知彼知己，百战不殆。」在和产品pk的时候，产品最经常的说一句话…