BFC 块格式化上下文

BFC是什么？

BFC (Block Formatting Context)是块格式化上下文，是 Web 页面的可视化CSS渲染的一部分，是块级盒子的布局过程发生的区域，也是浮动元素与其它元素交互的区域。块级盒子是什么可以了解一下视觉格式化模型。具有BFC特性的元素会被生成块盒子，块级盒子里面应用了BFC提供了一个独立的容器环境，块级盒子里面的元素在独立的环境里面进行一定规则的布局，容器里面的元素不会在布局上面影响到外面的元素，并且 BFC 具有普通容器所有的一些特性。

视觉格式化模型

CSS 视觉格式化模型(visual formatting model) 是用来处理和在视觉媒体上显示文档时使用的计算规则。该模型是 CSS 的基础概念之一。

什么是视觉格式化模型

视觉格式化模型会根据CSS盒子模型将文档中的元素转换为一个个盒子。——MDN

访问 JavaScript 链式属性

在开发的过程中，会经常访问深层 JavaScript 属性，这时如果其中一个属性会有断层， 控制台就会报错出现如下错误。如果一个程序没有兼容深层访问属性的错误，就会在后端一个未知错误的时候会报错，并且难已检测。

2018关键转折点

2018的时间过得比我想像中的还要快，离2018年结束还剩4天了，每年到这个时候都是啪啪啪打脸的时候，年前立的Flag，都在这个时候打得特别的痛，不过这个时候对18年的总结也是一个很好自省的方式，在18年完成了两个我比较重大的转变，一个是生活方式的转变，生活方式的转变是一个好的开始，但也意味着我需要花时间去习惯两个人的生活，生活是需要花心机花时间去打理的，如何快速打理生活这也是一种学问吧，另一个转变是工作环境的转变，来了一间互联网公司，公司需然不大，但也有技术成长的空间可以让我发挥。

关于 “zsh: command not found: *“

DOM

DOM 是针对 HTML 和 XML 文档的一个 API应该程序编程接口。DOM 用来描绘了一个可添加、移除和修改的层次的节点树。DOM 是由 DHTML (动态 HTML)开始创立的，现在都是跨平台、语言中立的。

DOM 是一个树形结构的根节点集合组成的。

原文链接: JS things I never knew existed
原文作者: Nick
译者： ClarenceC
本文为意译

我已经看过了全部的 MDN 文档及其它 JS API 文档发现很少有说明使用这些JS功能的文档，所以列出这样的一个列表把有用你所不知道JS功能列出来。

现在做显示设备适配越来越复杂了,不单只要调试Web端设置还得要兼容手持端各尺寸的手持端设备,当然还有越来越广泛的生态应用 PWA SPA 等,都是在展示的网页都成App形式存在了,不在像以前的网页简单的页面与后台反馈.
所以前端也需要一个优秀的工具来测量调试. Chrome Devtools 应运而生, Chrome Devtools 提供了强大的调试测量功能,下面我们简称 Chrome 开发者工具, Chrome 开发者工具是一套内置在Google Chrome中Web开发和调试工具.使用开发者工具来重演，调试和剖析您的网站. 下面我们看看 Chrome 开发者工具有那些功能可以帮助到前端开发者的. 本文主要是对 Chrome 开发者工具的功能介绍，具体功能操作步骤请查看 Chrome Devtools 的使用手册，(由于Chrome 开发者工具更新得很快,看到这文章的时候可能和现在这个版本不一致,功能还是差不多的,我会尽力更新)。

背景

虽然未能去到阿里巴巴 D2 前端盛会，但是在过后的回放当中也总结到了不少的东西，这篇文章是总结贺大 Johnhax 的关于 Microbenchmark For JavaScript 的性能测试演讲。

原文链接: css-naming-conventions-that-will-save-you-hours-of-debugging
原文作者: Ohans Emmanuel
译者: ClarenceC
本文为意译

我已经听很多开发者说他们不喜欢CSS。在我的经验来说，造成这样的原因，不是因为要花额外的时间去学CSS。

CSS并不是一门漂亮的‘语言’，但是它也已经成功当了 Web 风格语言快20年了。感觉还还不太差啊？

然而,如果你写大量的CSS，你会很快发现一个很大的缺憾， 是非常困难地去管理维护CSS的。
写得很差的CSS很快就会变成恶梦。

这篇文章的一些命名规则会帮你一些减轻压力和省很多时间在里面。