BFC(Block formatting contexts)初探
这篇讲的是前端开发中一个常见但容易模糊的概念——BFC（块级格式化上下文）。作者从自己面试和开发中遇到的困惑出发，系统梳理了BFC的定义、核心布局规则以及触发条件。 文章没有停留在理论，而是重点通过三个经典案例，演示了BFC的实际作用：如何利用它实现自适应两栏布局、有效清除内部浮动，以及防止外边距（margin）的垂直重叠。这些例子直指日常开发中的痛点，比如浮动带来的高度塌陷问题。 作者最后总结了关键点：BFC本质上是一个隔离的独立容器，其内外元素互不影响。理解这一点，就能明白为何BFC能解决上述布局难题。对于前端开发者而言，这篇文章能帮助理清BFC这个“既熟悉又陌生”的概念，并将它切实应用到解决实际问题中。
用 Virtual DOM 加速开发
这篇讲的是从传统 HTML 模板引擎过渡到 React 的 Virtual DOM，如何改善前端开发体验。作者以简聊（by Teambition）项目从 Backbone 转向 React 的实践为切入点，首先分析了传统字符串模板（如 doT.js）的局限：组件化困难（如前端无法直接 include 文件）、模板缩进产生多余空白、以及潜在的 JavaScript 注入风险。 接着，文章介绍了 React 的 JSX 规范——一种在 JavaScript 中编写类 XML 结构的方法。JSX 经过 Babel 等工具编译后，实际生成的是 React.createElement 函数调用，从而构建出一个轻量的、JSON 格式的 Virtual DOM 树。这个虚拟层是核心：当组件的 props 或 state 变化时，React 会重新生成 Virtual DOM 树，并通过高效的 Diff 算法计算出最小化的 DOM 更新操作，从而避免了繁琐的手动操作。 与传统模板相比，Virtual DOM 带来诸多优势：自动排除无意义空白、字符串自动转义防注入、JSON 结构天然支持组件组合，并且 JavaScript 可在 Node.js 和浏览器间共享代码。最终，这种声明式、数据驱动的开发模式让开发者从 jQuery 式的 DOM 操作中解放出来。文章末尾还提到，Virtual DOM 的理念正催生出 React Native、React-Canvas 等跨平台新可能，展示了这一架构的延伸价值。
React入门：关于虚拟DOM（Virtual DOM）
这篇讲的是React中虚拟DOM（Virtual DOM）的工作原理。作者从State变化如何触发UI更新讲起，指出React并非直接操作真实DOM，而是通过构建一个JavaScript对象形式的虚拟DOM树来进行模拟。 核心在于，虚拟DOM操作不立即反映到真实页面，这让React能将多次状态更新的渲染请求批量处理。等到事件循环结束，React通过高效的diff算法比较新旧虚拟DOM，计算出最小化的变更步骤，再一次性应用到真实DOM上。这种“计算最优更新路径”再“最小化执行”的模式，比开发者手动频繁操作真实DOM要快得多且更可靠。 文章进一步解释了虚拟DOM的API与真实DOM不同，其基本单位是“组件”（Components）。组件化结构让React的diff过程更加高效。简而言之，虚拟DOM用轻量的JavaScript对象代替了昂贵的DOM操作，在频繁更新的界面场景下显著提升了性能。
细说JavaScript中对象的属性和方法
这篇讲的是JavaScript对象的属性和方法，特别是ES5引入的那些。作者从阅读尼古拉斯·泽卡斯的《JavaScript面向对象精要》出发，意识到自己对这部分知识不够扎实，于是整理了这篇实用的总结。 文章结构清晰，分为两部分，系统梳理了Object和Object.prototype上的常用方法。作者分享了一个有趣的发现：要查看一个对象有哪些属性，最直接的方式不是搜索引擎，而是一行简洁的`Object.getOwnPropertyNames`代码，能列出所有属性名。 对于Object上的方法，文章重点剖析了几个ES5新增的关键API。例如，`Object.create`可以基于指定原型创建新对象，并允许直接定义初始属性；`Object.defineProperty`则提供了对属性特性（如是否可枚举、可写）的精细控制，这对实现底层库和框架至关重要。`Object.getPrototypeOf`也弥补了早期版本只能通过构造函数间接获取原型的不便。 整体来看，作者没有泛泛而谈，而是结合具体代码和MDN文档链接，把每个方法的签名、参数和典型用法都讲清楚了。这种基于实际开发经验的梳理，对于想夯实JS基础、特别是理解现代JavaScript对象模型的开发者来说，是个不错的参考。
小tip: 纯CSS实现视差滚动效果
这篇讲的是一个有趣的纯CSS技巧：实现视差滚动效果。作者从“视差滚动通常依赖JavaScript或插件”这个普遍认知出发，探讨了在不考虑IE兼容性的前提下，如何仅用几行CSS代码达成同样炫酷的效果。 核心实现思路巧妙地运用了CSS 3D的属性。作者在容器上设置`perspective`来建立3D视角，再对需要“慢速滚动”的背景元素应用`transform: translateZ(-1px) scale(2)`。这里的-1px与scale(2)是关键，它们共同制造了一种视觉错觉：虽然元素因Z轴位移在视觉上缩小了（如原文比喻的“近大远小”），但通过放大两倍补偿了这种缩小，使得在平面视角上看不出变化。然而，当页面滚动时，其位移速度自然与前景元素形成差异，从而产生视差感。原文用“电瓶车看月亮”的比喻很形象地说明了这一原理。 文章最后也提到了该技巧的适用边界，比如对直接body滚动效果不佳。对于想用最轻量级代码增加页面动态感，且无需支持老版本IE的项目来说，这个“解密”后的CSS小魔法提供了一个非常实用的思路。
javascript语句的执行过程分析
这篇技术文章深入剖析了JavaScript代码的执行流程，揭示了开发者常遇到的“代码顺序与执行顺序不符”现象背后的原理。作者从三个关键层面展开：首先，脚本按在HTML文档中出现的顺序执行；其次，也是重点，引擎会在执行前进行“预编译”，此时会提升所有`function`定义并赋值，而仅声明`var`变量并初始化为`undefined`，这直接导致了“函数调用在定义前仍可执行”但“变量调用在赋值前为`undefined`”的经典差异。最后，文章解释了按`